/*
 * ui.css — component styles for the includes/ui.php partial library.
 * (MAKEOVER_PLAN.md Phase 1.) TOKENS ONLY — zero literal colors permitted
 * in this file, ever. Loaded by BOTH tenant layout.php and master
 * master_layout.php after app.css.
 */

/* ── Page scaffolding ─────────────────────────────────────────────── */
.ui-page-header{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:var(--s3);margin-bottom:var(--s5);}
.ui-page-title{font-size:var(--fs-h1);font-weight:var(--fw-heavy);color:var(--text);margin:0;line-height:var(--lh-tight);}
.ui-page-sub{font-size:var(--fs-sm);color:var(--muted);margin:var(--s1) 0 0;}
.ui-page-actions{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap;}

/* ── Card ─────────────────────────────────────────────────────────── */
.ui-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-xs);}
.ui-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s3);padding:var(--s4) var(--s5);border-bottom:1px solid var(--border);}
.ui-card-title{font-size:var(--fs-h3);font-weight:var(--fw-bold);color:var(--text);}
.ui-card-sub{font-size:var(--fs-sm);color:var(--muted);margin-top:2px;}
.ui-card-body{padding:var(--s5);}
.ui-card-body.nopad{padding:0;}
.ui-card-foot{padding:var(--s3) var(--s5);border-top:1px solid var(--border);background:var(--surface-2);border-radius:0 0 var(--r-lg) var(--r-lg);}

/* ── Badges ───────────────────────────────────────────────────────── */
.ui-badge{display:inline-block;padding:3px 10px;border-radius:var(--r-xs);font-size:var(--fs-xs);font-weight:var(--fw-heavy);letter-spacing:.02em;text-transform:uppercase;line-height:1.6;}
.ui-badge-success{background:var(--success-soft);color:var(--success-text);}
.ui-badge-warning{background:var(--warning-soft);color:var(--warning-text);}
.ui-badge-danger{background:var(--danger-soft);color:var(--danger-text);}
.ui-badge-info{background:var(--info-soft);color:var(--info-text);}
.ui-badge-primary{background:var(--primary-soft);color:var(--primary);}

/* ── Stat tiles ───────────────────────────────────────────────────── */
.ui-stat{display:block;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s4) var(--s5);text-decoration:none;box-shadow:var(--shadow-xs);transition:box-shadow .15s,border-color .15s;}
a.ui-stat:hover{border-color:var(--border-strong);box-shadow:var(--shadow-sm);}
.ui-stat-label{font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}
.ui-stat-value{font-size:26px;font-weight:var(--fw-heavy);color:var(--text);margin-top:var(--s1);font-variant-numeric:tabular-nums;}
.ui-stat-delta{font-size:var(--fs-sm);font-weight:var(--fw-semibold);margin-top:var(--s1);}
.ui-stat-delta.up{color:var(--success-text);}
.ui-stat-delta.down{color:var(--danger-text);}
.ui-stat-delta.flat{color:var(--muted);}
.ui-stat-delta span{color:var(--muted);font-weight:var(--fw-normal);}

/* ── Score ring (the ONE canonical score display) ─────────────────── */
.ui-score-wrap{display:inline-flex;flex-direction:column;align-items:center;gap:var(--s1);}
.ui-score{--score-color:var(--info);border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--score-color) var(--score-deg),var(--surface-3) 0);}
.ui-score-low{--score-color:var(--danger);}
.ui-score-mid{--score-color:var(--warning);}
.ui-score-high{--score-color:var(--success);}
.ui-score-lg{width:84px;height:84px;}
.ui-score-sm{width:44px;height:44px;}
.ui-score-num{background:var(--surface);border-radius:50%;display:grid;place-items:center;font-weight:var(--fw-heavy);color:var(--text);font-variant-numeric:tabular-nums;}
.ui-score-lg .ui-score-num{width:66px;height:66px;font-size:22px;}
.ui-score-sm .ui-score-num{width:34px;height:34px;font-size:var(--fs-sm);}
.ui-score-label{font-size:var(--fs-xs);color:var(--muted);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.04em;}

/* ── Data table ───────────────────────────────────────────────────── */
.ui-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);}
.ui-table{width:100%;border-collapse:collapse;font-size:var(--fs-body);}
.ui-table th{position:sticky;top:0;background:var(--surface-2);color:var(--muted);font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.05em;text-align:left;padding:var(--s3) var(--s4);border-bottom:1px solid var(--border);white-space:nowrap;}
.ui-table td{padding:var(--s3) var(--s4);border-bottom:1px solid var(--border);color:var(--text);vertical-align:middle;}
.ui-table tbody tr:last-child td{border-bottom:0;}
.ui-table tbody tr:hover{background:var(--surface-2);}
.ui-table th.num,.ui-table td.num{text-align:right;font-variant-numeric:tabular-nums;}

/* ── Empty state ──────────────────────────────────────────────────── */
.ui-empty{text-align:center;padding:var(--s10) var(--s6);}
.ui-empty-icon{font-size:34px;color:var(--muted);margin-bottom:var(--s3);}
.ui-empty-title{font-size:var(--fs-h3);font-weight:var(--fw-bold);color:var(--text);}
.ui-empty-text{font-size:var(--fs-body);color:var(--muted);max-width:420px;margin:var(--s2) auto 0;line-height:var(--lh);}
.ui-empty-cta{margin-top:var(--s5);}

/* ── Forms ────────────────────────────────────────────────────────── */
.ui-form-row{margin-bottom:var(--s4);}
.ui-form-label{display:block;font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--text-2);margin-bottom:var(--s1);}
.ui-form-label .req{color:var(--danger);}
.ui-form-hint{font-size:var(--fs-xs);color:var(--muted);margin-top:var(--s1);}
.ui-form-error{font-size:var(--fs-xs);color:var(--danger-text);margin-top:var(--s1);font-weight:var(--fw-semibold);}
.ui-form-row.has-error input,.ui-form-row.has-error select,.ui-form-row.has-error textarea{border-color:var(--danger);}

/* ── Progress ─────────────────────────────────────────────────────── */
.ui-progress{height:8px;background:var(--surface-3);border-radius:var(--r-pill);overflow:hidden;}
.ui-progress-fill{height:100%;border-radius:var(--r-pill);transition:width .3s;}
.ui-progress-success{background:var(--success);}
.ui-progress-warning{background:var(--warning);}
.ui-progress-danger{background:var(--danger);}

/* ── Public shell (includes/public_layout.php) ────────────────────── */
body.pub{background:var(--bg);color:var(--text);font-size:var(--fs-body);line-height:var(--lh);margin:0;}
.pub-topbar{background:var(--primary);}
.pub-topbar-inner{max-width:var(--pub-width);margin:0 auto;padding:var(--s4) var(--s6);display:flex;align-items:center;justify-content:space-between;}
.pub-brand{color:var(--primary-contrast);font-size:var(--fs-h3);font-weight:var(--fw-heavy);text-decoration:none;}
.pub-back{color:var(--primary-contrast);opacity:.75;font-size:var(--fs-sm);text-decoration:none;}
.pub-back:hover{opacity:1;}
.pub-wrap{max-width:var(--pub-width);margin:var(--s10) auto 0;padding:0 var(--s6) var(--s10);}
.pub-wrap h1{font-size:30px;font-weight:var(--fw-heavy);color:var(--text);margin:0 0 var(--s2);}
.pub-wrap h2{font-size:var(--fs-h2);font-weight:var(--fw-bold);color:var(--text);margin:var(--s8) 0 var(--s3);padding-bottom:var(--s1);border-bottom:2px solid var(--border);}
.pub-wrap p{margin:0 0 var(--s4);color:var(--text-2);font-size:15px;line-height:var(--lh-relaxed);}
.pub-wrap ul{margin:0 0 var(--s4) var(--s5);padding:0;}
.pub-wrap li{color:var(--text-2);font-size:15px;margin-bottom:var(--s2);line-height:var(--lh-relaxed);}
.pub-wrap a{color:var(--primary);}
.pub-chip{display:inline-block;background:var(--primary-soft);color:var(--primary);border-radius:var(--r-pill);font-size:var(--fs-xs);font-weight:var(--fw-bold);padding:3px 12px;margin-bottom:var(--s4);}
.pub-meta{font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--s8);}
.pub-highlight{background:var(--primary-soft);border:1px solid var(--primary);border-radius:var(--r);padding:var(--s4) var(--s5);margin:var(--s4) 0;}
.pub-highlight p{margin:0;font-size:var(--fs-body);color:var(--primary);}
.pub-card-stage{min-height:calc(100vh - 80px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--s6);}
.pub-card-brand{color:var(--text);font-size:var(--fs-h2);font-weight:var(--fw-heavy);text-decoration:none;margin-bottom:var(--s5);}
.pub-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow);padding:var(--s8);width:100%;max-width:var(--pub-width);}
.pub-footer{text-align:center;font-size:var(--fs-xs);color:var(--muted);padding:var(--s5) var(--s6) var(--s8);}
.pub-footer a{color:var(--muted);}
.ui-card-padded{padding:var(--s6) var(--s6);margin-top:var(--s3);}
.pub-404-code{font-size:64px;font-weight:var(--fw-heavy);color:var(--primary);line-height:1;}
.pub-chip.danger{background:var(--danger-soft);color:var(--danger-text);}

/* ── Callouts (highlight boxes) ───────────────────────────────────── */
.ui-callout{border-radius:var(--r);padding:var(--s4) var(--s5);margin:var(--s4) 0;border:1px solid var(--border);}
.ui-callout p,.ui-callout li{margin:0;font-size:var(--fs-body);}
.ui-callout p+p{margin-top:var(--s2);}
.ui-callout-primary{background:var(--primary-soft);border-color:var(--primary);}
.ui-callout-primary p,.ui-callout-primary li{color:var(--primary);}
.ui-callout-success{background:var(--success-soft);border-color:var(--success);}
.ui-callout-success p{color:var(--success-text);}
.ui-callout-danger{background:var(--danger-soft);border-color:var(--danger);}
.ui-callout-danger p{color:var(--danger-text);}

/* ── Alerts (flash/status messages) ───────────────────────────────── */
.ui-alert{padding:var(--s3) var(--s4);border-radius:var(--r-sm);font-size:var(--fs-body);margin-bottom:var(--s4);border:1px solid var(--border);}
.ui-alert-success{background:var(--success-soft);color:var(--success-text);border-color:var(--success);}
.ui-alert-error{background:var(--danger-soft);color:var(--danger-text);border-color:var(--danger);}
.ui-alert-warning{background:var(--warning-soft);color:var(--warning-text);border-color:var(--warning);}

/* ── Public-shell form controls ───────────────────────────────────── */
body.pub label{display:block;font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--text-2);margin:var(--s4) 0 var(--s1);}
body.pub input[type=email],body.pub input[type=text],body.pub input[type=password],body.pub select,body.pub textarea{width:100%;padding:10px 13px;border:1.5px solid var(--border-strong);border-radius:var(--r-sm);font-size:var(--fs-body);outline:none;background:var(--surface-2);color:var(--text);box-sizing:border-box;}
body.pub input:focus,body.pub select:focus,body.pub textarea:focus{border-color:var(--primary);background:var(--surface);}
body.pub textarea{height:100px;resize:vertical;}
body.pub table.ui-table{margin:var(--s4) 0;}
body.pub code{background:var(--surface-3);padding:2px 6px;border-radius:var(--r-xs);font-size:var(--fs-sm);}
.pub-auth-title{margin:0 0 var(--s2);font-size:26px;font-weight:var(--fw-heavy);color:var(--text);}
.pub-auth-sub{color:var(--muted);margin:0 0 var(--s5);font-size:var(--fs-body);}
.pub-btn-block{width:100%;margin-top:var(--s4);border:0;border-radius:var(--r);background:var(--primary);color:var(--primary-contrast);font-weight:var(--fw-heavy);padding:13px;cursor:pointer;font-size:var(--fs-body);}
.pub-btn-block:hover{background:var(--primary-hover);}
.pub-auth-link{display:block;text-align:center;margin-top:var(--s4);color:var(--primary);font-weight:var(--fw-bold);text-decoration:none;font-size:var(--fs-sm);}
a.pub-btn-block{display:block;text-align:center;text-decoration:none;box-sizing:border-box;}
.pub-auth-center{text-align:center;}
.pub-auth-rules{margin:var(--s2) 0 var(--s4);color:var(--muted);font-size:var(--fs-sm);}
.pub-auth-shield{width:60px;height:60px;border-radius:var(--r-xl);background:var(--success);color:var(--primary-contrast);display:grid;place-items:center;margin:0 auto var(--s4);font-weight:var(--fw-heavy);font-size:22px;}
.pub-otp-input{font-size:24px;letter-spacing:8px;text-align:center;font-weight:var(--fw-bold);}
.pub-form-actions{display:flex;gap:var(--s3);align-items:center;margin-top:var(--s4);}
.pub-btn-inline{width:auto;margin-top:0;padding:13px 18px;}
.pub-link-inline{display:inline;margin-top:0;}

/* ── Key-value summary rows ───────────────────────────────────────── */
.ui-kv{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r);padding:var(--s4);margin:var(--s4) 0;}
.ui-kv-row{display:flex;justify-content:space-between;gap:var(--s4);padding:var(--s2) 0;border-bottom:1px solid var(--border);font-size:var(--fs-body);}
.ui-kv-row:last-child{border-bottom:0;}
.ui-kv-row span{color:var(--muted);}

/* ── Choice cards (platform/plan pickers, wizards) ────────────────── */
.ui-wizard{max-width:760px;width:100%;margin:0 auto;padding:var(--s8) var(--s4);}
.ui-wizard-head{text-align:center;margin-bottom:var(--s6);}
.ui-wizard-mark{width:44px;height:44px;border-radius:var(--r);background:var(--primary);color:var(--primary-contrast);font-weight:var(--fw-bold);display:inline-flex;align-items:center;justify-content:center;font-size:var(--fs-h2);margin-bottom:var(--s3);}
.ui-wizard-head h1{font-size:var(--fs-h1);font-weight:var(--fw-bold);color:var(--text);margin:0 0 var(--s2);}
.ui-wizard-head p{font-size:15px;color:var(--muted);max-width:520px;margin:0 auto;line-height:var(--lh);}
.ui-pick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s4);}
.ui-pick{background:var(--surface);border:2px solid var(--border);border-radius:var(--r-lg);padding:var(--s6);text-align:left;transition:border-color .15s,box-shadow .15s,transform .15s;position:relative;}
.ui-pick.available{cursor:pointer;}
.ui-pick.available:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-2px);}
.ui-pick.soon{opacity:.55;}
.ui-pick-ic{width:46px;height:46px;border-radius:var(--r);background:var(--primary-soft);color:var(--primary);font-weight:var(--fw-bold);font-size:var(--fs-h3);display:flex;align-items:center;justify-content:center;margin-bottom:var(--s3);}
.ui-pick.soon .ui-pick-ic{background:var(--surface-2);color:var(--muted);}
.ui-pick h3{font-size:17px;font-weight:var(--fw-bold);color:var(--text);margin:0 0 var(--s1);}
.ui-pick p{font-size:var(--fs-sm);color:var(--muted);line-height:1.55;min-height:52px;margin:0;}
.ui-pick-tag{position:absolute;top:var(--s3);right:var(--s3);font-size:10px;font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.05em;padding:3px 9px;border-radius:var(--r-pill);}
.ui-pick-tag.ok{background:var(--success-soft);color:var(--success-text);}
.ui-pick-tag.soon{background:var(--surface-2);color:var(--muted);}
.ui-pick button{margin-top:var(--s3);width:100%;padding:11px;border:none;border-radius:var(--r-sm);background:var(--primary);color:var(--primary-contrast);font-size:var(--fs-sm);font-weight:var(--fw-bold);cursor:pointer;}
.ui-pick button:hover{background:var(--primary-hover);}
.ui-wizard-foot{text-align:center;margin-top:var(--s6);font-size:var(--fs-xs);color:var(--muted);}
.ui-wizard-foot a{color:var(--muted);}

/* ── Dashboard quota bar + trend notes ────────────────────────────── */
.dash-quota{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s3) var(--s4);margin-bottom:var(--s5);}
.dash-quota-head{display:flex;justify-content:space-between;font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--text-2);margin-bottom:var(--s1);align-items:center;gap:var(--s2);}
.dash-quota-head a{font-size:var(--fs-xs);color:var(--primary);text-decoration:none;font-weight:var(--fw-semibold);}
.dash-quota-foot{font-size:var(--fs-xs);color:var(--muted);margin-top:var(--s1);}
.dash-quota-foot .q-danger,.dash-quota-foot .q-danger a{color:var(--danger-text);font-weight:var(--fw-bold);}
.dash-quota-foot .q-warning{color:var(--warning-text);}
.dash-trend-note{font-size:var(--fs-xs);color:var(--muted);margin-top:var(--s2);}
.dash-trend-note .trend-up{font-weight:var(--fw-bold);color:var(--success-text);}
.dash-trend-note .trend-down{font-weight:var(--fw-bold);color:var(--danger-text);}
.dash-trend-note a{color:var(--primary);font-weight:var(--fw-bold);}

/* ── Integrations hub (pages/integrations/*) ──────────────────────── */
.int-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s3);margin-bottom:var(--s5);}
.int-tile{display:block;background:var(--surface);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:var(--s4) var(--s5);text-decoration:none;transition:.15s;}
.int-tile:hover{border-color:var(--primary);box-shadow:var(--shadow-sm);}
.int-tile .it-name{font-size:var(--fs-body);font-weight:var(--fw-heavy);color:var(--text);}
.int-tile .it-desc{font-size:var(--fs-xs);color:var(--muted);margin-top:3px;line-height:1.4;}
.int-tile .it-badge{font-size:var(--fs-xs);font-weight:var(--fw-bold);padding:2px 8px;border-radius:var(--r-xs);margin-top:var(--s2);display:inline-block;}
.gi-card{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:var(--s5) var(--s6);margin-bottom:var(--s4);}
.gi-card h3{font-size:15px;font-weight:var(--fw-heavy);margin:0 0 var(--s1);}
.gi-card .sub{font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--s4);}
.status-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;border-radius:var(--r-pill);font-size:var(--fs-sm);font-weight:var(--fw-bold);}
.st-on{background:var(--success-soft);color:var(--success-text);}
.st-off{background:var(--surface-2);color:var(--muted);}
.st-warn{background:var(--danger-soft);color:var(--danger-text);}
.gi-btn{padding:11px 20px;border:none;border-radius:var(--r-sm);font-size:var(--fs-sm);font-weight:var(--fw-bold);cursor:pointer;text-decoration:none;display:inline-block;}
.gi-google{background:var(--google-blue);color:var(--dark-text);}
.gi-google:hover{background:var(--google-blue-hover);}
.gi-grey{background:var(--surface-2);color:var(--text-2);border:1px solid var(--border);}
.gi-red{background:var(--danger-soft);color:var(--danger);border:1px solid var(--danger);}
.gi-green{background:var(--success);color:var(--dark-text);}
.gi-row{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding:var(--s2) 0;border-bottom:1px solid var(--surface-2);font-size:var(--fs-sm);}
.gi-row:last-child{border-bottom:none;}
select.gi-sel{padding:8px 12px;border:1.5px solid var(--border-strong);border-radius:var(--r-sm);font-size:var(--fs-sm);min-width:280px;}
.gi-help{background:var(--info-soft);border:1px solid var(--border);color:var(--info-text);border-radius:var(--r-sm);padding:var(--s3) var(--s4);font-size:var(--fs-sm);line-height:var(--lh);margin-bottom:var(--s4);}
table.logs{width:100%;border-collapse:collapse;}
table.logs th,table.logs td{padding:var(--s2) var(--s3);border-bottom:1px solid var(--surface-2);font-size:var(--fs-xs);text-align:left;}
table.logs th{color:var(--muted);text-transform:uppercase;font-size:10px;letter-spacing:.05em;}
.gi-field{margin-bottom:var(--s4);}
.gi-field label{display:block;font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--text-2);margin-bottom:var(--s1);}
.gi-field input,.gi-field select{width:100%;padding:11px 13px;border:1.5px solid var(--border-strong);border-radius:var(--r-sm);font-size:var(--fs-sm);}
.gi-hint{font-size:var(--fs-xs);color:var(--muted);margin:5px 0 0;}
.gi-2col{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);}
@media (max-width:640px){.gi-2col{grid-template-columns:1fr;}}

/* ── Settings area (includes/settings_nav.php) ────────────────────── */
.settings-area{display:grid;grid-template-columns:200px 1fr;gap:var(--s6);align-items:start;}
.settings-nav{position:sticky;top:var(--s5);display:flex;flex-direction:column;gap:var(--s4);}
.settings-nav-group{display:flex;flex-direction:column;gap:1px;}
.settings-nav-heading{font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;padding:0 var(--s3);margin-bottom:var(--s1);}
.settings-nav-link{padding:8px var(--s3);border-radius:var(--r-sm);font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--text-2);text-decoration:none;transition:background .12s,color .12s;}
.settings-nav-link:hover{background:var(--surface-2);color:var(--text);}
.settings-nav-link.active{background:var(--primary-soft);color:var(--primary);}
.settings-area-content{min-width:0;}
@media (max-width:900px){.settings-area{grid-template-columns:1fr;}.settings-nav{position:static;flex-direction:row;flex-wrap:wrap;}.settings-nav-group{flex-direction:row;flex-wrap:wrap;}}

/* ── Product SEO audit (pages/agent/product_audit.php) + small reusable utilities ── */
.ui-hidden{display:none;}
.ui-muted-note{font-size:var(--fs-xs);color:var(--muted);margin:-8px 0 var(--s4);}
.ui-mt-0{margin-top:0;}
.ui-mb-5{margin-bottom:var(--s5);}
.ui-mb-4{margin-bottom:var(--s4);}
.ui-text-danger{color:var(--danger-text);}
.ui-text-muted{color:var(--muted);}
.ui-text-muted-sm{color:var(--muted);font-size:var(--fs-xs);}
.ui-text-italic-muted{color:var(--muted);font-style:italic;}
.ui-text-warning{color:var(--warning-text);}
.pa-product-link{color:var(--text);font-weight:var(--fw-semibold);text-decoration:none;}
.pa-sku{font-size:var(--fs-xs);color:var(--muted);}
.pma-image-row{display:flex;gap:var(--s4);align-items:flex-start;padding:var(--s3) 0;border-bottom:1px solid var(--border);}
.pma-image-row:last-child{border-bottom:0;}
.pma-image-thumb{width:64px;height:64px;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--border);flex-shrink:0;background:var(--surface-2);}
.pma-image-field{flex:1;min-width:0;}
.ui-filter-bar{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;}
.ui-filter-bar select{padding:8px 12px;border:1.5px solid var(--border-strong);border-radius:var(--r-sm);font-size:var(--fs-sm);background:var(--surface-2);color:var(--text);min-width:180px;}
.ui-filter-clear{font-size:var(--fs-sm);color:var(--muted);text-decoration:underline;}
.ui-mono-input{font-family:monospace;}

/* ── Grid helpers (stat rows, card grids) ─────────────────────────── */
.ui-grid{display:grid;gap:var(--s4);}
.ui-grid-2{grid-template-columns:repeat(2,1fr);}
.ui-grid-3{grid-template-columns:repeat(3,1fr);}
.ui-grid-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:1100px){.ui-grid-4{grid-template-columns:repeat(2,1fr);}.ui-grid-3{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.ui-grid-2,.ui-grid-3,.ui-grid-4{grid-template-columns:1fr;}}

/* ── Blog editor (pages/content/generate_blog.php + view/edit siblings) ── */
.gen-layout{display:grid;grid-template-columns:380px 1fr;gap:20px;align-items:start;}
.gen-panel{background:var(--surface);border:1.5px solid var(--border);border-radius:14px;overflow:hidden;}
.gen-panel-head{padding:16px 20px;border-bottom:1px solid var(--surface-2);background:var(--surface-2);}
.gen-panel-head h3{font-size:14px;font-weight:700;color:var(--text);margin:0;}
.gen-panel-head p{font-size:12px;color:var(--muted);margin:3px 0 0;}
.gen-panel-body{padding:20px;}
.form-group{margin-bottom:14px;}
.form-group label{display:block;font-size:11px;font-weight:700;color:var(--text-2);margin-bottom:5px;text-transform:uppercase;letter-spacing:.04em;}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:9px 13px;border:1.5px solid var(--border-strong);border-radius:9px;font-size:13px;color:var(--text);background:var(--surface-2);}
.form-group input:focus,.form-group select:focus{border-color:var(--primary);background:var(--surface);outline:none;}
.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--surface-2);}
.toggle-row:last-child{border-bottom:none;}
.toggle-row label{font-size:13px;color:var(--text-2);font-weight:500;cursor:pointer;}
.toggle-switch{position:relative;display:inline-block;width:38px;height:22px;}
.toggle-switch input{opacity:0;width:0;height:0;}
.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:var(--border-strong);border-radius:22px;transition:.3s;}
.slider:before{position:absolute;content:"";height:16px;width:16px;left:3px;bottom:3px;background:var(--surface);border-radius:50%;transition:.3s;}
input:checked + .slider{background:var(--primary);}
input:checked + .slider:before{transform:translateX(16px);}
.btn-generate{width:100%;padding:13px;background:var(--primary);color:var(--primary-contrast);border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;margin-top:4px;}
.btn-generate:hover{opacity:.9;}
.btn-generate:disabled{opacity:.5;cursor:not-allowed;}
.stat-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px;}
.stat-chip{background:var(--surface-2);border-radius:7px;padding:8px 14px;font-size:12px;color:var(--text-2);}
.stat-chip strong{color:var(--primary);font-size:15px;display:block;}
.action-bar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px;padding:14px 18px;background:var(--surface-2);border-radius:10px;border:1px solid var(--surface-2);}
.btn-save{padding:10px 22px;background:var(--primary);color:var(--primary-contrast);border:none;border-radius:8px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-save:hover{background:var(--primary);}
.btn-dl{padding:10px 18px;background:var(--surface);color:var(--text-2);border:1.5px solid var(--border);border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;}
.btn-dl:hover{background:var(--surface-2);}
.blog-preview{background:var(--surface);border:1.5px solid var(--border);border-radius:12px;padding:28px 36px;line-height:1.8;font-size:15px;color:var(--text-2);}
.blog-preview h1{font-size:28px;font-weight:800;line-height:1.3;margin:0 0 20px;color:var(--text);}
.blog-preview h2{font-size:20px;font-weight:700;margin:28px 0 12px;color:var(--text);}
.blog-preview h3{font-size:16px;font-weight:700;margin:20px 0 8px;color:var(--text-2);}
.blog-preview p{margin:0 0 16px;}
.blog-preview ul,.blog-preview ol{margin:0 0 16px;padding-left:24px;}
.blog-preview li{margin-bottom:6px;}
.blog-preview table{width:100%;border-collapse:collapse;margin:20px 0;font-size:13px;}
.blog-preview th{background:var(--surface-2);padding:10px 14px;font-weight:700;border:1px solid var(--border);text-align:left;}
.blog-preview td{padding:9px 14px;border:1px solid var(--surface-2);}
.blog-preview tr:nth-child(even) td{background:var(--surface-2);}
.blog-preview blockquote{border-left:4px solid var(--primary);margin:20px 0;padding:12px 18px;background:var(--primary-soft);border-radius:0 8px 8px 0;font-style:italic;color:var(--primary);}
.blog-preview .seo-meta{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:12px 16px;margin-bottom:24px;font-size:12px;color:var(--muted);}
.schema-preview{background:var(--dark-bg);color:var(--dark-text);border-radius:10px;padding:16px;font-size:11px;font-family:monospace;overflow-x:auto;margin-top:12px;max-height:200px;overflow-y:auto;}
.cp-badge{display:inline-flex;align-items:center;gap:5px;background:var(--info-soft);color:var(--primary);padding:4px 10px;border-radius:6px;font-size:11px;font-weight:700;margin-bottom:12px;}
.brief-section{background:var(--surface-2);border:1px solid var(--surface-2);border-radius:9px;padding:12px 14px;margin-bottom:10px;font-size:12px;}
.brief-section strong{display:block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:6px;}
/* ── Content automation (pages/content/automation_ai.php) ── */
.auto-tabs{display:flex;gap:0;border-bottom:2px solid var(--border);margin-bottom:18px;}
.auto-tab{padding:10px 20px;border:none;background:none;cursor:pointer;font-size:13px;font-weight:600;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-2px;text-decoration:none;display:inline-block;}
.auto-tab:hover{color:var(--text-2);}
.auto-tab.active{color:var(--primary);border-bottom-color:var(--primary);}
.opt-badge{display:inline-block;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:700;}
.opt-badge.good{background:var(--success-soft);color:var(--success-text);}
.opt-badge.warn{background:var(--warning-soft);color:var(--warning-text);}
.opt-badge.bad{background:var(--danger-soft);color:var(--danger-text);}
.gap-list{list-style:none;padding:0;margin:0;}
.gap-list li{padding:6px 0 6px 20px;position:relative;font-size:13px;border-bottom:1px solid var(--surface-2);}
.gap-list li:before{content:"";position:absolute;left:2px;top:.65em;width:6px;height:6px;border-radius:50%;background:var(--primary);}
.update-confirm-box{background:var(--warning-soft);border:1.5px solid var(--warning);border-radius:10px;padding:16px 18px;margin-top:14px;}