/* Pau Update - frontend styles
   Place this file at: pau-update/includes/style.css
*/

/* --- Marquee / container --- */
.pau-marquee{
  position: relative;
  padding: 10px 16px;
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 6px;
  overflow: hidden;
  display:flex;
  align-items:center;
  gap: 12px;
  box-sizing: border-box;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

.pau-marquee marquee{
  flex: 1 1 auto;
  display:block;
  white-space: nowrap;
  font-size: 15px;
  line-height:1.6;
  background: transparent;
  border: none;
}

.pau-marquee marquee a{
  display:inline-block;
  margin-right: 24px;
  text-decoration: none;
  font-weight: 600;
  padding: 2px 4px;
  border-radius: 3px;
  transition: opacity .15s ease, transform .15s ease;
}
.pau-marquee marquee a:focus,
.pau-marquee marquee a:hover{
  opacity: .85;
  transform: translateY(-1px);
}

/* View More button (on right of marquee) */
.pau-view-more{
  flex: 0 0 auto;
  margin-left: 12px;
  text-decoration: none;
  padding: 8px 12px;
  border-radius: 4px;
  background: #0073aa;
  color:#fff;
  font-weight:600;
  border: none;
  transition: background .15s ease, transform .08s ease;
}
.pau-view-more:hover{ background:#005177; transform: translateY(-1px); }

/* --- Archive table --- */
.pau-archive table{
  width:90%;
  border-collapse: collapse;
  margin-top: 20px;
  table-layout: fixed;
  word-wrap: break-word;
margin:auto;
}
.pau-archive th, .pau-archive td{
  padding: 12px 10px;
  border-bottom: 1px solid #e6e6e6;
  vertical-align: middle;
}
.pau-archive thead th{
  text-align:left;
  font-weight:700;
  color:#333;
  background: #fbfbfb;
}

/* Buttons inside table */
.pau-archive td .button{
  display:inline-block;
  padding:8px 10px;
  border-radius:6px;
  background:#0073aa;
  color:#fff;
  text-decoration:none;
  font-weight:600;
}
.pau-archive td .button:hover{ background:#005177; }

/* Column widths (as requested) */
.pau-archive th:nth-child(1), .pau-archive td:nth-child(1){width:80%;}
.pau-archive th:nth-child(2), .pau-archive td:nth-child(2){ width:20%;  }
.pau-archive th:nth-child(3), .pau-archive td:nth-child(3){ width:auto; }


/* ----- MOBILE OVERRIDES ----- */
@media (max-width: 787px) {
    .pau-table {
        font-size: 14px;
    }

    /* 1st column = 80 % */
    .pau-archive th:nth-child(1),
    .pau-archive td:nth-child(1) {
        width: 100%; 
padding:10px;
    }

    /* 2nd column = 20 % */
    .pau-archive th:nth-child(2),
    .pau-archive td:nth-child(2) {
        width: 100%;
padding:10px;

    }}

/* Date styling */
.pau-archive td .pau-date { font-weight:700; }

/* Pagination container */
.pau-archive .pagination{
  margin-top: 18px;
  text-align:center;
}

/* --- Single post --- */
.pau-single{
  max-width:900px;
  margin: 20px auto;
  padding: 0 12px;
}
.pau-single h1{
  font-size:28px;
  margin-bottom:12px;
}
.pau-single img{
  max-width:100%;
  height:auto;
  display:block;
  margin-bottom:12px;
}
.pau-single .content{
  line-height:1.8;
  margin-top:10px;
}

/* --- Responsive fallback --- */
@media (max-width:768px){
  .pau-archive table, .pau-archive thead, .pau-archive tbody, .pau-archive th, .pau-archive td, .pau-archive tr{
    display:block;
  }
  .pau-archive tr{ margin-bottom: 14px; border-bottom: 1px solid #f0f0f0; padding-bottom:10px; }
  .pau-archive td{ padding:6px 0; text-align:left; }
  .pau-archive td:nth-child(2), .pau-archive td:nth-child(3){ text-align:left; }
  .pau-marquee{ flex-direction: column; gap:8px; align-items:stretch; }
  .pau-view-more{ align-self:flex-end; }
}