/* Only the collected-ad classification page owns these filter styles. */
.ad-mapping-page {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}
.ad-mapping-page [hidden] { display: none !important; }
.table-controls.ad-mapping-controls {
    display: block;
    flex: 0 0 auto;
    padding: 8px 10px;
    max-height: 52%;
    overflow: auto;
}
.ad-mapping-primary { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.ad-mapping-field { display:flex; align-items:center; gap:6px; min-width:0; max-width:100%; color:var(--color-text-secondary); font-size:12px; white-space:nowrap; }
.ad-mapping-field .form-control { width:152px; flex:0 1 152px; min-width:0; height:32px; padding:5px 8px; font-size:12px; }
.ad-mapping-search .form-control { width:240px; flex-basis:240px; }
.ad-mapping-controls .btn { display:inline-flex; align-items:center; justify-content:center; min-height:32px; padding:5px 10px; margin:0; font-size:12px; white-space:nowrap; }
.ad-mapping-controls .ad-mapping-status .btn { min-height:28px; }
.ad-mapping-secondary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-md);
    margin-top: var(--spacing-md);
}
.ad-mapping-status { display: flex; flex-wrap: wrap; gap: var(--spacing-xs); }
.ad-mapping-status .btn {
    color: var(--color-text-secondary);
    background: var(--color-bg-light);
    border-color: var(--color-border-light);
}
.ad-mapping-status .btn[aria-pressed="true"] {
    color: var(--color-text-white);
    background: var(--color-primary);
    border-color: var(--color-primary);
}
.ad-mapping-result { margin-right: auto; color: var(--color-text-muted); font-size: var(--font-size-sm); }
.ad-mapping-actions { display: flex; flex-wrap: wrap; gap: var(--spacing-sm); }
.ad-mapping-details { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; margin-top:8px; padding:10px; border:1px solid var(--color-border-light); border-radius:6px; background:var(--color-bg-light); }
.ad-mapping-applied { display: flex; flex-wrap: wrap; gap: var(--spacing-xs); margin-top: var(--spacing-sm); }
.ad-mapping-chip {
    max-width: 100%;
    padding: var(--spacing-xs) var(--spacing-sm);
    border: 1px solid var(--color-border-light);
    border-radius: var(--border-radius-sm);
    background: var(--color-bg-light);
    color: var(--color-text-secondary);
    font: inherit;
    font-size: var(--font-size-xs);
    overflow-wrap: anywhere;
    cursor: pointer;
}
.ad-mapping-option-error { margin: var(--spacing-sm) 0 0; color: var(--color-danger); }
.ad-mapping-table-container { flex: 1; min-width: 0; min-height: 0; }
/* The theme's header margin is outside Tabulator's height calculation. */
.ad-mapping-page .tabulator-header { margin-bottom: 0; }
@media (max-width: 900px) {
    .ad-mapping-page .tabulator-footer-contents { flex-wrap: wrap; gap: var(--spacing-sm); }
    .ad-mapping-page .tabulator-paginator {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        gap: var(--spacing-xs);
        min-width: 0;
        max-width: 100%;
        margin-left: auto;
        white-space: normal;
    }
}
@media (max-width: 480px) {
    .ad-mapping-primary .ad-mapping-field, .ad-mapping-details .ad-mapping-field { width:100%; }
    .ad-mapping-field .form-control { flex:1; width:0; }
    .ad-mapping-field { white-space:normal; }
    .ad-mapping-controls { padding: var(--spacing-sm); }
    .ad-mapping-result { flex-basis: 100%; }
    .ad-mapping-page .tabulator .tabulator-footer .tabulator-paginator { flex:1 1 100%; }
}
.ad-mapping-help { color:var(--color-text-muted); font-size:12px; margin-top:6px; }
.ad-mapping-help summary { cursor:pointer; width:fit-content; }
.ad-mapping-help p { margin:6px 0; line-height:1.5; white-space:normal; }
.ad-mapping-row-match { border:1px solid var(--color-border-light); border-radius:4px; background:var(--color-bg-white); color:var(--color-primary); font-size:11px; padding:2px 5px; cursor:pointer; }
.ad-mapping-modal { margin:auto; inset:0; width:min(560px,calc(100vw - 32px)); max-height:85vh; overflow:auto; padding:20px; border:0; border-radius:10px; box-shadow:0 12px 40px #0003; color:var(--color-text-primary); }
.ad-mapping-modal::backdrop { background:#0006; }
.ad-mapping-modal h2 { font-size:17px; margin:0 0 12px; }
#mapping-modal-context { white-space:pre-wrap; overflow-wrap:anywhere; font-size:12px; line-height:1.6; }
#mapping-modal-warning { font-size:12px; color:var(--color-text-secondary); }
.ad-mapping-modal-fields { display:grid; gap:12px; }
.ad-mapping-modal-field { display:grid; grid-template-columns:52px minmax(0,1fr) auto; gap:8px; align-items:center; font-size:12px; }
.ad-mapping-modal-field .form-control { min-width:0; height:34px; font-size:12px; }
.ad-mapping-modal-field > span:last-child { white-space:nowrap; }
.ad-mapping-modal-hint { font-size:12px; line-height:1.5; color:var(--color-text-muted); }
.ad-mapping-modal-actions { display:flex; gap:8px; justify-content:flex-end; }
@media (max-width:480px) {
    .ad-mapping-modal-field { grid-template-columns:48px minmax(0,1fr); }
    .ad-mapping-modal-field > span:last-child { grid-column:2; }
}

.ad-mapping-save-status { font-size:12px; color:var(--color-text-muted); margin:6px 0 0; }
.ad-mapping-suggestions { width:min(980px,calc(100vw - 32px)); }
.ad-mapping-suggestions-table { max-height:50vh; overflow:auto; margin:12px 0; }
.ad-mapping-suggestions table { width:100%; border-collapse:collapse; font-size:12px; }
.ad-mapping-suggestions th, .ad-mapping-suggestions td { padding:8px; text-align:left; border-bottom:1px solid var(--color-border,#ddd); white-space:nowrap; }
.ad-mapping-suggestions th { position:sticky; top:0; background:var(--color-background,#fff); }
