/* ============================================================
   NinjaWeb Smart Media Optimizer — Admin UI
   Light theme, NinjaWeb brand, clean WP-compatible layout
   ============================================================ */

.ninjsmme-wrap {
    --nw-bg:      #f4f4f4;
    --nw-surface: #ffffff;
    --nw-surface2:#f9f9f9;
    --nw-border:  #e2e2e2;
    --nw-border2: #cccccc;
    --nw-text:    #111111;
    --nw-text2:   #444444;
    --nw-muted:   #666666;
    --nw-yellow:  #ffd700;
    --nw-yellow2: #f5a623;
    --nw-yellow3: #d4960a;
    --nw-green:   #16a34a;
    --nw-red:     #dc2626;
}

/* Reset WP interference */
body.wp-admin.upload-php .ninjsmme-wrap,
.ninjsmme-wrap { margin:0 !important; padding:0 !important; max-width:none; }
.ninjsmme-light-dashboard * { box-sizing:border-box; }

/* Shell — absorb WP's 20px left padding so content is full width */
.ninjsmme-dashboard-shell {
    background: var(--nw-bg);
    min-height: 100vh;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
    color: var(--nw-text);
    font-size: 15px;
    margin-left: -20px;
    padding-left: 20px;
}

/* ── HEADER ─────────────────────────────────────────── */
.ninjsmme-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 0 20px;
    padding: 14px 20px;
    background: #1d2327;
    border-bottom: 3px solid var(--nw-yellow);
    width: calc(100% - 40px);
    box-sizing: border-box;
}

.ninjsmme-hero-brand { display:flex; align-items:center; gap:14px; }

.ninjsmme-hero-logo {
    width: 150px;
    max-height: 58px;
    object-fit: contain;
    flex: 0 0 auto;
}

.ninjsmme-hero h1 {
    margin: 0 0 3px;
    font-size: 19px;
    font-weight: 800;
    color: #f0f0f1;
    letter-spacing: -0.01em;
}

.ninjsmme-hero p { margin:0; color:#c3c3c3; font-size:13px; }

.ninjsmme-hero-actions { display:flex; align-items:center; gap:10px; }

.ninjsmme-help-card {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border: 1px solid #3c434a;
    border-radius: 6px;
    background: #2c3338;
    color: #c3c3c3;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.ninjsmme-help-card:hover { color: var(--nw-yellow); border-color: var(--nw-yellow); }

/* ── SECTIONS ───────────────────────────────────────── */
.ninjsmme-section { padding: 16px 20px 16px 20px; }

/* ── STATS ──────────────────────────────────────────── */
.ninjsmme-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.ninjsmme-stat-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: var(--nw-surface);
    border: 1px solid var(--nw-border);
    border-top: 3px solid var(--nw-yellow);
    border-radius: 8px;
}

.ninjsmme-stat-icon {
    display: grid;
    place-items: center;
    width: 38px; height: 38px;
    border-radius: 8px;
    font-size: 17px;
    flex: 0 0 auto;
}
.ninjsmme-stat-icon.is-purple { background:#f3f0ff; }
.ninjsmme-stat-icon.is-green  { background:#f0fdf4; }
.ninjsmme-stat-icon.is-blue   { background:#fffbeb; }
.ninjsmme-stat-icon.is-orange { background:#fff7ed; }
.ninjsmme-stat-icon.is-pink   { background:#fff1f2; }

.ninjsmme-stat-card span:not(.ninjsmme-stat-icon) {
    display: block;
    color: var(--nw-muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 4px;
}
.ninjsmme-stat-card strong {
    display: block;
    color: var(--nw-text);
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.02em;
}
.ninjsmme-stat-card small { display:block; color:var(--nw-muted); font-size:11px; margin-top:3px; }

/* ── TWO COL ─────────────────────────────────────────── */
.ninjsmme-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

/* ── PANELS ──────────────────────────────────────────── */
.ninjsmme-panel {
    padding: 20px;
    background: var(--nw-surface);
    border: 1px solid var(--nw-border);
    border-radius: 8px;
}

.ninjsmme-panel-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
}
.ninjsmme-panel-title-row h2 { margin:0 0 3px; color:var(--nw-text); font-size:15px; font-weight:800; }
.ninjsmme-panel-title-row p  { margin:0; color:var(--nw-muted); font-size:13px; }

/* ── SETTINGS FORM ───────────────────────────────────── */
.ninjsmme-settings-primary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    align-items: start;
}

.ninjsmme-field { min-width:0; }

.ninjsmme-field label {
    display: block;
    margin-bottom: 6px;
    color: var(--nw-text2);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.ninjsmme-field input[type="text"],
.ninjsmme-field input[type="number"],
.ninjsmme-field input[type="search"],
.ninjsmme-field select,
.ninjsmme-filter-field input,
.ninjsmme-filter-field select {
    width: 100%;
    min-height: 40px;
    max-width: none;
    padding: 0 12px;
    border: 1px solid var(--nw-border2) !important;
    border-radius: 6px !important;
    background: #fafafa !important;
    color: var(--nw-text) !important;
    font-size: 14px;
    box-shadow: none !important;
}

.ninjsmme-field input:focus,
.ninjsmme-field select:focus,
.ninjsmme-filter-field input:focus,
.ninjsmme-filter-field select:focus {
    border-color: var(--nw-yellow3) !important;
    box-shadow: 0 0 0 3px rgba(212,150,10,.15) !important;
    outline: none !important;
    background: #fff !important;
}

.ninjsmme-field p { margin-top:6px; font-size:12px; color:var(--nw-muted); }
.ninjsmme-field.is-disabled { opacity:.45; pointer-events:none; }

.ninjsmme-input-unit { display:grid; grid-template-columns:1fr 44px; gap:6px; }
.ninjsmme-input-unit span {
    display: grid; place-items: center;
    min-height: 40px;
    border: 1px solid var(--nw-border2);
    border-radius: 6px;
    background: #f0f0f0;
    color: var(--nw-text2);
    font-weight: 700; font-size: 13px;
}

.ninjsmme-quality-row { display:grid; grid-template-columns:1fr 64px; gap:10px; align-items:center; }
.ninjsmme-quality-row input[type="range"] { width:100%; accent-color:var(--nw-yellow3); }

.ninjsmme-field-description {
    margin-top: 8px;
    padding: 8px 12px;
    background: #fffbeb;
    border-left: 3px solid var(--nw-yellow);
    border-radius: 0 6px 6px 0;
    color: #92400e;
    font-size: 13px;
    line-height: 1.5;
}

.ninjsmme-advanced-details { margin-top:14px; border-top:1px solid var(--nw-border); padding-top:14px; }
.ninjsmme-advanced-details summary {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border: 1px solid var(--nw-border2);
    border-radius: 6px;
    background: var(--nw-surface2);
    color: var(--nw-text2);
    font-size: 13px; font-weight: 700;
    cursor: pointer;
}
.ninjsmme-advanced-details summary:hover { border-color:var(--nw-yellow3); color:var(--nw-text); }

.ninjsmme-advanced-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }

.ninjsmme-check-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--nw-border);
}
.ninjsmme-check-grid label, .ninjsmme-inline-check {
    display:flex; gap:7px; align-items:center;
    color:var(--nw-text2); font-size:13px; font-weight:600;
}

.ninjsmme-save-top {
    min-height: 40px !important;
    padding: 0 20px !important;
    border-radius: 6px !important;
    background: var(--nw-yellow) !important;
    border-color: var(--nw-yellow3) !important;
    color: #111 !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    white-space: nowrap;
}
.ninjsmme-save-top:hover { background:var(--nw-yellow2) !important; }

/* ── QUICK ACTIONS ───────────────────────────────────── */
.ninjsmme-quick-actions { display:flex; flex-direction:column; gap:8px; }

.ninjsmme-command {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 14px;
    border: 1px solid var(--nw-border);
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    background: var(--nw-surface2);
    width: 100%;
    transition: border-color .15s, background .15s;
}
.ninjsmme-command:hover { border-color:var(--nw-yellow3); background:#fffbeb; }
.ninjsmme-command:disabled { opacity:.4; cursor:not-allowed; }
.ninjsmme-command strong { display:block; font-size:13px; font-weight:800; color:var(--nw-text); }
.ninjsmme-command .cmd-sub { font-size:12px; color:var(--nw-muted); margin-top:2px; display:block; }
.ninjsmme-command .cmd-count {
    font-size:12px; font-weight:800;
    padding:3px 10px; border-radius:20px;
    white-space:nowrap; flex:0 0 auto;
    background:var(--nw-yellow); color:#111;
}
.ninjsmme-command.is-green .cmd-count { background:#dcfce7; color:#15803d; }
.ninjsmme-command.is-orange .cmd-count { background:#ffedd5; color:#c2410c; }
.ninjsmme-command.is-red .cmd-count { background:#fee2e2; color:#b91c1c; }

/* ── RESUME BANNER ───────────────────────────────────── */
.ninjsmme-resume-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
    padding: 12px 14px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
}
.ninjsmme-resume-banner-text strong { display:block; font-size:13px; font-weight:800; color:#92400e; }
.ninjsmme-resume-banner-text small  { font-size:12px; color:#b45309; }
.ninjsmme-resume-queue-btn {
    padding: 7px 16px;
    background: var(--nw-yellow);
    border: none; border-radius: 6px;
    font-size: 13px; font-weight: 800;
    color: #111; cursor: pointer; white-space: nowrap;
}
.ninjsmme-resume-queue-btn:hover { background:var(--nw-yellow2); }

/* ── ENGINE PANEL ────────────────────────────────────── */
.ninjsmme-engine-panel { background:#1d2327; border-color:#2c3338; }
.ninjsmme-engine-title-row { align-items:center; margin-bottom:14px; }
.ninjsmme-engine-title-row h2 { color:var(--nw-yellow); font-size:15px; font-weight:800; }
.ninjsmme-engine-title-row p  { color:#c3c3c3; font-size:13px; }

.ninjsmme-clear-log-btn {
    min-height:36px !important;
    border-radius:6px !important;
    padding:0 14px !important;
    color:#c3c3c3 !important;
    background:#2c3338 !important;
    border-color:#3c434a !important;
    font-size:13px !important; font-weight:700 !important;
}
.ninjsmme-clear-log-btn:hover { color:#fff !important; border-color:var(--nw-yellow) !important; }

.ninjsmme-engine-grid {
    display: grid;
    grid-template-columns: minmax(320px,1fr) minmax(280px,.9fr);
    align-items: start;
    gap: 14px;
}

.ninjsmme-engine-progress-card,
.ninjsmme-log-card {
    padding: 16px;
    border: 1px solid #3c434a;
    border-radius: 8px;
    background: #2c3338;
}

.ninjsmme-progress-head,
.ninjsmme-log-head,
.ninjsmme-table-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.ninjsmme-progress-head strong { color:#f0f0f1; font-size:14px; font-weight:700; }
.ninjsmme-log-head strong { color:#f0f0f1; font-size:14px; font-weight:700; }
.ninjsmme-log-head a { color:var(--nw-yellow); font-weight:700; font-size:13px; text-decoration:none; }
.ninjsmme-log-head a:hover { color:var(--nw-yellow2); }

#ninjsmme-progress-percent { color:var(--nw-yellow); font-size:20px; font-weight:800; }

.ninjsmme-progress-track { height:7px; overflow:hidden; border-radius:99px; background:#1d2327; }
.ninjsmme-progress-fill {
    width:0; height:100%; border-radius:inherit;
    background:linear-gradient(90deg,var(--nw-yellow),var(--nw-yellow2));
    transition:width .3s ease;
}

.ninjsmme-current-job { margin-top:10px; color:#c3c3c3; font-size:13px; }
.ninjsmme-current-job strong { color:#f0f0f1; }

.ninjsmme-engine-metrics {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 8px;
    margin-top: 12px;
}
.ninjsmme-engine-metrics div {
    padding:10px; border:1px solid #3c434a;
    border-radius:6px; background:#1d2327; text-align:center;
}
.ninjsmme-engine-metrics span { display:block; margin-bottom:4px; color:#c3c3c3; font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.ninjsmme-engine-metrics strong { color:#fff; font-size:19px; font-weight:800; }

.ninjsmme-control-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }

.ninjsmme-control-row .button {
    min-height:34px !important;
    border-radius:6px !important;
    color:#c3c3c3 !important;
    background:#2c3338 !important;
    border-color:#3c434a !important;
    font-size:13px !important; font-weight:700 !important;
}
.ninjsmme-control-row .button:hover { color:#fff !important; border-color:var(--nw-yellow) !important; }
#ninjsmme-pause-engine:not([disabled])  { color:var(--nw-yellow) !important; border-color:var(--nw-yellow) !important; }
#ninjsmme-stop-engine:not([disabled])   { color:#f87171 !important; border-color:#f87171 !important; }
#ninjsmme-resume-engine:not([disabled]) { color:#4ade80 !important; border-color:#4ade80 !important; }

.ninjsmme-live-log {
    height:200px !important;
    max-height:200px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    padding:10px 12px;
    border:1px solid #1d2327;
    border-radius:6px;
    background:#0d1117;
    color:#666;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size:12px; line-height:1.7;
}

.ninjsmme-log-line { padding:0; }
.ninjsmme-log-line.is-success { color:#4ade80; }
.ninjsmme-log-line.is-error   { color:#f87171; }
.ninjsmme-log-line.is-warning { color:var(--nw-yellow2); }
.ninjsmme-log-line.is-working { color:var(--nw-yellow); }
.ninjsmme-log-line.is-muted   { color:#444; }

/* ── ACTION MESSAGES ─────────────────────────────────── */
.ninjsmme-action-message { margin-top:8px; font-size:12px; line-height:1.4; }
.ninjsmme-action-message.is-working { color:var(--nw-muted); }
.ninjsmme-action-message.is-success { color:var(--nw-green); }
.ninjsmme-action-message.is-error   { color:var(--nw-red); }

/* ── FILTER BAR ──────────────────────────────────────── */
.ninjsmme-filter-panel { margin-bottom:12px; }

.ninjsmme-filters {
    display: grid;
    grid-template-columns: minmax(180px,1.5fr) repeat(3,minmax(120px,.8fr)) auto auto auto;
    gap: 10px;
    align-items: end;
}
.ninjsmme-filters .button {
    min-height:40px !important;
    border-radius:6px !important;
    display:inline-flex; align-items:center; justify-content:center;
    font-size:13px !important; font-weight:700 !important;
}
.ninjsmme-filters .button-primary {
    background:var(--nw-yellow) !important;
    border-color:var(--nw-yellow3) !important;
    color:#111 !important;
}
.ninjsmme-inline-check { min-height:40px; white-space:nowrap; font-size:13px; color:var(--nw-text2); }

/* ── TABLE ───────────────────────────────────────────── */
.ninjsmme-table-header h2 { margin:0 0 2px; color:var(--nw-text); font-size:15px; font-weight:800; }
.ninjsmme-table-header p  { margin:0; color:var(--nw-muted); font-size:13px; }
.ninjsmme-table-actions   { display:flex; gap:8px; align-items:center; }

.ninjsmme-table-actions .button {
    min-height:36px !important;
    border-radius:6px !important;
    font-size:13px !important; font-weight:700 !important;
}
.ninjsmme-table-actions .button-primary {
    background:var(--nw-yellow) !important;
    border-color:var(--nw-yellow3) !important;
    color:#111 !important;
}
.ninjsmme-rescan-all-btn {
    color:var(--nw-text2) !important;
    background:var(--nw-surface2) !important;
    border-color:var(--nw-border2) !important;
}

.ninjsmme-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--nw-border);
    border-radius: 8px;
    margin-top: 14px;
}

.ninjsmme-table {
    border:0 !important;
    background:var(--nw-surface) !important;
    table-layout:fixed;
    width:100%;
}

.ninjsmme-table thead th,
table.ninjsmme-table.widefat thead th {
    background:#f5f5f5 !important;
    color:#555 !important;
    font-size:11px !important; font-weight:800 !important;
    text-transform:uppercase !important; letter-spacing:.07em !important;
    border-bottom:2px solid var(--nw-yellow) !important;
    padding:12px 10px !important;
}

.ninjsmme-table td,
.ninjsmme-table th,
.ninjsmme-table tbody tr td,
.ninjsmme-table tbody tr th {
    vertical-align:middle;
    padding-top:12px !important; padding-bottom:12px !important;
    border-color:var(--nw-border) !important;
    background:var(--nw-surface) !important;
    color:var(--nw-text) !important;
    font-size:14px !important;
    overflow-wrap:anywhere;
}

.ninjsmme-table.striped tr:nth-child(odd) td,
.ninjsmme-table.striped tr:nth-child(odd) th,
table.ninjsmme-table.widefat.striped tr:nth-child(odd) td,
table.ninjsmme-table.widefat.striped tr:nth-child(odd) th { background:#fafafa !important; }
.ninjsmme-table tbody tr:hover td,
.ninjsmme-table tbody tr:hover th { background:#fffbeb !important; }

.ninjsmme-table th:nth-child(1),.ninjsmme-table td:nth-child(1){ width:36px; }
.ninjsmme-table th:nth-child(2),.ninjsmme-table td:nth-child(2){ width:74px; }
.ninjsmme-table th:nth-child(3),.ninjsmme-table td:nth-child(3){ width:210px; }
.ninjsmme-table th:nth-child(4),.ninjsmme-table td:nth-child(4){ width:110px; }
.ninjsmme-table th:nth-child(5),.ninjsmme-table td:nth-child(5){ width:115px; }
.ninjsmme-table th:nth-child(6),.ninjsmme-table td:nth-child(6){ width:175px; }
.ninjsmme-table th:nth-child(7),.ninjsmme-table td:nth-child(7){ width:125px; }
.ninjsmme-table th:nth-child(8),.ninjsmme-table td:nth-child(8){ width:155px; }

.ninjsmme-thumb {
    width:56px; height:44px;
    object-fit:cover;
    border:1px solid var(--nw-border);
    border-radius:6px;
    background:#f5f5f5;
}

.ninjsmme-file-name  { display:block; color:var(--nw-text) !important; font-size:13px !important; font-weight:700; line-height:1.35; word-break:break-word; }
.ninjsmme-file-date  { margin-top:3px; color:var(--nw-muted) !important; font-size:12px !important; }
.ninjsmme-small-note { color:var(--nw-green); font-size:12px; font-weight:700; margin-top:2px; }
.ninjsmme-no-thumb   { color:var(--nw-muted); font-size:12px; }
.ninjsmme-row-links  { margin-top:4px; font-size:12px; }
.ninjsmme-row-links a{ color:var(--nw-yellow3); font-weight:600; text-decoration:none; }
.ninjsmme-row-links a:hover { color:var(--nw-yellow2); }

/* ── USAGE PILLS ─────────────────────────────────────── */
.ninjsmme-usage-wrap  { min-width:130px; display:flex; flex-direction:column; gap:4px; }
.ninjsmme-usage-list  { display:flex; flex-direction:column; gap:4px; }

.ninjsmme-usage-pill {
    display: flex;
    flex-direction: column;
    padding: 5px 8px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-left: 3px solid var(--nw-yellow3);
    border-radius: 5px;
    text-decoration: none;
    transition: background .15s;
}
.ninjsmme-usage-pill:hover { background:#fef9c3; }
.ninjsmme-usage-pill-type  { font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:#92400e; line-height:1; margin-bottom:2px; }
.ninjsmme-usage-pill-title { font-size:12px; font-weight:600; color:#1a1a1a; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ninjsmme-usage-none  { font-size:12px; color:var(--nw-muted); font-style:italic; }
.ninjsmme-rescan-link { font-size:12px; color:var(--nw-muted); text-decoration:none; font-weight:600; margin-top:2px; }
.ninjsmme-rescan-link:hover { color:var(--nw-yellow3); }

.ninjsmme-webp-chip {
    display:inline-flex; align-items:center;
    margin-top:4px; padding:2px 8px;
    border-radius:20px;
    background:var(--nw-yellow); color:#111;
    font-size:10px; font-weight:800;
}

/* ── STATUS BADGES ───────────────────────────────────── */
.ninjsmme-status-badge {
    display:inline-flex; align-items:center; justify-content:center;
    padding:4px 12px; border-radius:20px;
    font-size:11px; font-weight:800;
    white-space:nowrap; border:1px solid;
}
.ninjsmme-status-badge.is-optimized { color:#15803d; background:#dcfce7; border-color:#86efac; }
.ninjsmme-status-badge.is-pending   { color:#92400e; background:#fffbeb; border-color:#fde68a; }
.ninjsmme-status-badge.is-no-gain   { color:#555;    background:#f5f5f5; border-color:#e0e0e0; }
.ninjsmme-status-badge.is-failed    { color:#b91c1c; background:#fee2e2; border-color:#fca5a5; }

/* ── ACTION BUTTONS ──────────────────────────────────── */
.ninjsmme-action-buttons { display:flex; flex-wrap:wrap; gap:5px; }

.ninjsmme-action-buttons .button-small,
.ninjsmme-table .button-small {
    min-height:30px !important;
    padding:0 12px !important;
    border-radius:20px !important;
    font-size:12px !important; font-weight:800 !important;
    background:#fff !important;
}
.ninjsmme-optimize-button { color:#92400e !important; border-color:var(--nw-yellow) !important; }
.ninjsmme-optimize-button:hover { background:#fffbeb !important; }
.ninjsmme-rollback-button { color:var(--nw-red) !important; border-color:#fca5a5 !important; }
.ninjsmme-rollback-button:hover { background:#fee2e2 !important; }

/* ── FOOTER ──────────────────────────────────────────── */
.ninjsmme-footer-note { padding:14px 20px; color:var(--nw-muted); font-size:12px; border-top:1px solid var(--nw-border); }
.ninjsmme-footer-note a { color:var(--nw-yellow3); text-decoration:none; font-weight:700; }
.ninjsmme-engine-state.screen-reader-text { position:absolute !important; }

/* ── PAGINATION ──────────────────────────────────────── */
.ninjsmme-wrap .tablenav-pages .page-numbers {
    display:inline-flex; align-items:center; justify-content:center;
    min-width:30px; height:30px; margin-left:3px;
    border:1px solid var(--nw-border2); border-radius:6px;
    background:var(--nw-surface); color:var(--nw-text2);
    text-decoration:none; font-size:13px;
}
.ninjsmme-wrap .tablenav-pages .page-numbers.current {
    background:var(--nw-yellow); color:#111;
    border-color:var(--nw-yellow3); font-weight:800;
}

/* ── LOG MODAL ───────────────────────────────────────── */
.ninjsmme-log-modal { display:none; position:fixed; inset:0; z-index:100000; }
.ninjsmme-log-modal.is-open { display:block; }
.ninjsmme-log-modal-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.75); }
.ninjsmme-log-modal-dialog {
    position:absolute; inset:48px;
    display:flex; flex-direction:column;
    padding:20px; border-radius:10px;
    background:#111; border:1px solid #333;
}
.ninjsmme-log-modal-head {
    display:flex; align-items:center;
    justify-content:space-between; gap:14px; margin-bottom:14px;
}
.ninjsmme-log-modal-head h2 { margin:0; color:#fff; font-size:18px; font-weight:800; }
.ninjsmme-full-log-content {
    flex:1; overflow:auto; padding:16px;
    border:1px solid #222; border-radius:8px;
    background:#050505; color:#555;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size:12px; line-height:1.75; white-space:pre-wrap;
}
.ninjsmme-full-log-content .ninjsmme-log-line.is-success { color:#4ade80; }
.ninjsmme-full-log-content .ninjsmme-log-line.is-error   { color:#f87171; }
.ninjsmme-full-log-content .ninjsmme-log-line.is-warning { color:var(--nw-yellow2); }
.ninjsmme-full-log-content .ninjsmme-log-line.is-working { color:var(--nw-yellow); }

/* ── RESPONSIVE ──────────────────────────────────────── */
@media (max-width:1440px) {
    .ninjsmme-filters { grid-template-columns:repeat(4,minmax(120px,1fr)); }
}
@media (max-width:1100px) {
    .ninjsmme-two-col { grid-template-columns:1fr; }
    .ninjsmme-engine-grid { grid-template-columns:1fr; }
    .ninjsmme-advanced-grid { grid-template-columns:1fr 1fr; }
    .ninjsmme-check-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:782px) {
    .ninjsmme-hero { flex-direction:column; align-items:flex-start; }
    .ninjsmme-stats-grid { grid-template-columns:1fr 1fr; }
    .ninjsmme-settings-primary { grid-template-columns:1fr; }
    .ninjsmme-filters { grid-template-columns:1fr; }
    .ninjsmme-log-modal-dialog { inset:10px; }
    .ninjsmme-hero-logo { width:120px; }
}


/* Alignment-only patch: keep the dark top bar aligned with the light content grid. */
@media (max-width: 782px) {
    .ninjsmme-hero {
        margin-left: 12px;
        margin-right: 12px;
        width: calc(100% - 24px);
    }
}

/* =========================
   UI POLISH - FINAL
   Readability, resume button and logo sizing only.
========================= */

.ninjsmme-wrap,
.ninjsmme-wrap p,
.ninjsmme-wrap span,
.ninjsmme-wrap label,
.ninjsmme-wrap small,
.ninjsmme-wrap td,
.ninjsmme-wrap th,
.ninjsmme-wrap input,
.ninjsmme-wrap select,
.ninjsmme-wrap textarea,
.ninjsmme-wrap button {
    font-size: 13px !important;
}

.ninjsmme-wrap h1 { font-size: 30px !important; }
.ninjsmme-wrap h2 { font-size: 20px !important; }
.ninjsmme-wrap h3 { font-size: 16px !important; }
.ninjsmme-stat-card strong,
.ninjsmme-stat-value,
.ninjsmme-engine-value {
    font-size: 22px !important;
    font-weight: 800 !important;
}

.ninjsmme-hero-logo {
    width: 200px !important;
    max-width: 200px !important;
    max-height: 90px !important;
    object-fit: contain !important;
}

#ninjsmme-resume-engine:not([disabled]),
.ninjsmme-resume-queue-btn {
    background: #2271b1 !important;
    border-color: #1e5f96 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

#ninjsmme-resume-engine:not([disabled]):hover,
.ninjsmme-resume-queue-btn:hover {
    background: #135e96 !important;
    border-color: #135e96 !important;
    color: #ffffff !important;
}

#ninjsmme-resume-engine[disabled] {
    opacity: .65 !important;
}

@media (max-width: 782px) {
    .ninjsmme-hero-logo {
        width: 160px !important;
        max-width: 160px !important;
        max-height: 76px !important;
    }
}

/* Smart used-images action */
.ninjsmme-command.is-primary {
    border-color: #facc15;
    background: #fffbeb;
}
.ninjsmme-command.is-primary:hover {
    border-color: #eab308;
    background: #fef3c7;
}
.ninjsmme-command.is-blue .cmd-count {
    background: #dbeafe;
    color: #1d4ed8;
}
