:root {
    --wca-bg: #FAF7F2;
    --wca-surface: #F5EFE7;
    --wca-border: #EFC89C;
    --wca-accent: #F5A000;
    --wca-primary: #A44E09;
    --wca-text: #5C2B05;
}

.wca-portal,
.wca-consent { color: var(--wca-text); max-width: 1080px; margin: 0 auto; }
.wca-portal h2,
.wca-portal h3,
.wca-portal h4 { color: var(--wca-text); letter-spacing: 0; }
.wca-portal h3 { font-size: 19px; line-height: 1.35; margin-bottom: 12px; }
.wca-portal section { margin: 30px 0; }

.wca-stats { display: grid; grid-template-columns: repeat(5, minmax(140px, 1fr)); gap: 12px; }
.wca-stats > div { background: var(--wca-bg); border: 1px solid var(--wca-border); border-top: 4px solid var(--wca-accent); border-radius: 8px; padding: 17px; box-shadow: 0 2px 0 var(--wca-border); }
.wca-stats span,
.wca-stats strong { display: block; }
.wca-stats span { font-weight: 600; }
.wca-stats strong { color: var(--wca-primary); font-size: 21px; line-height: 1.25; margin-top: 9px; }

.wca-link,
.wca-portal input,
.wca-portal select,
.wca-portal textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--wca-border); border-radius: 6px; padding: 10px 11px; background: var(--wca-bg); color: var(--wca-text); }
.wca-portal input:focus,
.wca-portal select:focus,
.wca-portal textarea:focus { outline: none; border-color: var(--wca-primary); box-shadow: 0 0 0 1px var(--wca-primary); }
.wca-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 760px; }
.wca-form label,
.wca-inline-portal-form label,
.wca-link-builder label { display: grid; gap: 6px; font-size: 14px; font-weight: 600; }
.wca-form .wca-button { justify-self: start; }
.wca-form .wca-span-2 { grid-column: 1 / -1; }
.wca-form input[type="checkbox"] { width: auto; min-width: 18px; }
.wca-inline-portal-form { display: grid; grid-template-columns: minmax(240px, 1fr) auto; align-items: end; gap: 10px; max-width: 720px; margin-bottom: 14px; }
.wca-link-builder { display: grid; grid-template-columns: minmax(240px, 1fr) auto; align-items: end; gap: 10px; margin-top: 14px; }
.wca-link-builder .wca-deep-link-output { grid-column: 1 / -1; }

.wca-button { min-height: 40px; border: 1px solid var(--wca-primary); border-radius: 6px; background: var(--wca-primary); color: var(--wca-bg); cursor: pointer; padding: 9px 16px; font-weight: 700; }
.wca-button:hover { background: var(--wca-accent); border-color: var(--wca-accent); color: var(--wca-text); }
.wca-button-secondary { background: var(--wca-surface); border-color: var(--wca-border); color: var(--wca-text); }
.wca-notice { border: 1px solid var(--wca-border); border-left: 5px solid var(--wca-primary); border-radius: 6px; background: var(--wca-surface); color: var(--wca-text); padding: 12px 16px; margin: 16px 0; }
.wca-consent { background: var(--wca-surface); border: 1px solid var(--wca-border); border-radius: 8px; padding: 16px; }

.wca-table-wrap { overflow-x: auto; border: 1px solid var(--wca-border); border-radius: 8px; background: var(--wca-bg); }
.wca-portal table { width: 100%; border-collapse: collapse; background: var(--wca-bg); color: var(--wca-text); }
.wca-portal th { background: var(--wca-surface); color: var(--wca-text); font-size: 12px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.wca-portal th,
.wca-portal td { border-bottom: 1px solid var(--wca-border); padding: 12px 14px; text-align: left; vertical-align: top; }
.wca-portal tbody tr:hover { background: var(--wca-surface); }
.wca-portal code { background: var(--wca-surface); color: var(--wca-text); }

.wca-status { display: inline-flex; align-items: center; border: 1px solid var(--wca-border); border-radius: 99px; padding: 4px 9px; background: var(--wca-surface); color: var(--wca-text); font-size: 12px; font-weight: 700; white-space: nowrap; }
.wca-status-paid,
.wca-status-unpaid,
.wca-status-approved { background: var(--wca-border); }
.wca-status-pending,
.wca-status-processing,
.wca-status-requested { border-color: var(--wca-accent); }
.wca-status-flagged,
.wca-status-rejected,
.wca-status-cancelled,
.wca-status-reset { background: var(--wca-primary); border-color: var(--wca-primary); color: var(--wca-bg); }

.wca-creative-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.wca-creative { display: grid; grid-template-columns: 140px 1fr; gap: 14px; border: 1px solid var(--wca-border); border-radius: 8px; background: var(--wca-bg); padding: 14px; }
.wca-creative img { width: 140px; height: 100px; border-radius: 6px; object-fit: cover; }
.wca-creative h4 { margin: 0 0 8px; font-size: 16px; }
.wca-creative p { margin: 0 0 10px; }

.wca-pagination { display: flex; justify-content: flex-end; margin: 16px 0 26px; }
.wca-pagination > .page-numbers { display: flex; align-items: center; gap: 5px; margin: 0; padding: 0; }
.wca-pagination li { list-style: none; margin: 0; }
.wca-pagination a.page-numbers,
.wca-pagination span.page-numbers { display: inline-flex; min-width: 34px; height: 34px; align-items: center; justify-content: center; border: 1px solid var(--wca-border); border-radius: 6px; background: var(--wca-bg); color: var(--wca-text); text-decoration: none; box-sizing: border-box; }
.wca-pagination a.page-numbers:hover { background: var(--wca-surface); border-color: var(--wca-primary); }
.wca-pagination span.current { background: var(--wca-primary); border-color: var(--wca-primary); color: var(--wca-bg); }
.wca-pagination span.dots { border-color: transparent; background: transparent; }
.wca-pagination .prev,
.wca-pagination .next { font-size: 20px; }

@media (max-width: 900px) {
    .wca-stats { grid-template-columns: 1fr 1fr; }
    .wca-creative-grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .wca-stats,
    .wca-form,
    .wca-inline-portal-form,
    .wca-link-builder { grid-template-columns: 1fr; }
    .wca-link-builder .wca-deep-link-output { grid-column: auto; }
    .wca-form .wca-span-2 { grid-column: auto; }
    .wca-creative { grid-template-columns: 1fr; }
    .wca-creative img { width: 100%; height: auto; aspect-ratio: 16 / 9; }
    .wca-pagination { justify-content: center; }
}