/* ── AICOM - AI Commander Admin Styles ──────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&family=JetBrains+Mono:wght@400;500&family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,700;1,9..144,400;1,9..144,500&display=swap');

/* ── Design tokens ─────────────────────────────────────────────────────── */
:root {
    /* Accent — orange (aicom brand) */
    --aicom-primary:      #e85d2c;
    --aicom-primary-dk:   #c44a20;
    --aicom-primary-lt:   #f1e8d6;

    /* Brand surfaces */
    --aicom-ink:          #16181d;
    --aicom-warm:         #f1ede4;

    /* Text hierarchy */
    --aicom-text:         #16181d;
    --aicom-text-md:      #3a3d44;
    --aicom-text-sm:      #6b6f78;
    --aicom-text-xs:      #585a5e;

    /* Surfaces */
    --aicom-border:       #e6e3dc;
    --aicom-border-light: #f3f0e9;
    --aicom-surface:      #ffffff;
    --aicom-bg:           #f1ede4;

    /* Elevation */
    --aicom-shadow:       0 1px 3px rgba(22,24,29,.06), 0 1px 2px rgba(22,24,29,.04);
    --aicom-shadow-md:    0 8px 24px rgba(22,24,29,.10), 0 2px 8px rgba(22,24,29,.04);

    /* Radii */
    --aicom-radius:       10px;
    --aicom-radius-sm:    6px;

    /* Sidebar */
    --nav-bg:             #ffffff;
    --nav-border:         var(--aicom-border);
    --nav-text:           var(--aicom-text-md);
    --nav-active-bg:      var(--aicom-primary-lt);
    --nav-active-text:    var(--aicom-primary-dk);
    --nav-hover-bg:       var(--aicom-bg);
}

/* ── Font application ───────────────────────────────────────────────────── */
.aicom-wrap {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    -webkit-font-smoothing: antialiased;
}
.aicom-wrap * { box-sizing: border-box; }
.aicom-wrap h1,
.aicom-wrap h2,
.aicom-wrap h3,
.aicom-wrap h4 {
    font-family: 'Plus Jakarta Sans', sans-serif;
}
.aicom-wrap code,
.aicom-wrap pre,
.aicom-wrap .aicom-key-prefix,
.aicom-wrap .aicom-tree-scope-code,
.aicom-wrap .aicom-copy-input,
.aicom-wrap .aicom-endpoint-value,
.aicom-wrap .aicom-info-value,
.aicom-wrap .aicom-sidenav-version {
    font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;
}

/* ── Two-column layout ──────────────────────────────────────────────────── */
.aicom-layout {
    display: flex;
    gap: 0;
    background: var(--aicom-surface);
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius);
    box-shadow: var(--aicom-shadow);
    overflow: hidden;
    min-height: 640px;
}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.aicom-sidenav {
    width: 200px;
    flex-shrink: 0;
    background: var(--nav-bg);
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--nav-border);
}

/* Logo */
.aicom-sidenav-logo {
    display: flex;
    align-items: center;
    padding: 16px 18px 14px;
    border-bottom: 1px solid var(--nav-border);
    flex-shrink: 0;
}
.aicom-sidenav-logo-img {
    height: 36px;
    width: auto;
    display: block;
}
.aicom-sidenav-logo .dashicons {
    color: var(--aicom-primary);
    font-size: 18px;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

/* Nav list */
.aicom-sidenav-menu {
    list-style: none;
    margin: 10px 0 0;
    padding: 0 10px;
    flex: 1;
}
.aicom-sidenav-menu li { margin: 0; }
.aicom-sidenav-menu li a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    color: var(--nav-text);
    text-decoration: none;
    font-size: 0.84em;
    font-weight: 500;
    border-radius: 6px;
    margin-bottom: 1px;
    transition: background 0.12s, color 0.12s;
}
.aicom-sidenav-menu li a:hover {
    background: var(--nav-hover-bg);
    color: var(--aicom-text);
}
.aicom-sidenav-menu li.is-active a {
    background: var(--nav-active-bg);
    color: var(--nav-active-text);
    font-weight: 600;
}
.aicom-sidenav-menu .dashicons {
    font-size: 15px;
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    opacity: 0.6;
    transition: opacity 0.12s;
}
.aicom-sidenav-menu li a:hover .dashicons { opacity: 0.85; }
.aicom-sidenav-menu li.is-active .dashicons {
    opacity: 1;
    color: var(--aicom-primary-dk);
}

/* Version footer */
.aicom-sidenav-footer {
    padding: 12px 16px;
    border-top: 1px solid var(--nav-border);
    flex-shrink: 0;
}
.aicom-sidenav-version {
    font-size: 0.7em;
    color: var(--aicom-text-xs);
    letter-spacing: 0.3px;
}

/* ── Content area ───────────────────────────────────────────────────────── */
.aicom-page-content {
    flex: 1;
    min-width: 0;
    padding: 28px 28px 36px;
    background: var(--aicom-bg);
}

/* ── Page header ────────────────────────────────────────────────────────── */
.aicom-page-header { margin-bottom: 24px; }
.aicom-page-header h1 {
    font-size: 1.45em;
    font-weight: 800;
    color: var(--aicom-text);
    margin: 0 0 5px;
    letter-spacing: -0.6px;
    line-height: 1.2;
}
.aicom-page-header .aicom-page-desc {
    color: var(--aicom-text-sm);
    margin: 0;
    font-size: 0.875em;
    line-height: 1.6;
}
.aicom-count {
    font-size: 0.56em;
    color: var(--aicom-text-xs);
    font-weight: 400;
    letter-spacing: 0;
}

/* ── Cards ──────────────────────────────────────────────────────────────── */
.aicom-card {
    background: var(--aicom-surface);
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius);
    box-shadow: var(--aicom-shadow);
    margin-bottom: 16px;
    overflow: hidden;
}
.aicom-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    border-bottom: 1px solid var(--aicom-border);
    background: var(--aicom-surface);
}
.aicom-card-head h2,
.aicom-card-head .aicom-card-title {
    font-size: 0.71em;
    font-weight: 700;
    color: var(--aicom-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.9px;
    margin: 0;
}
.aicom-card-body { padding: 20px; }

/* ── Collapsible card ───────────────────────────────────────────────────── */
.aicom-card-collapsible .aicom-card-head { cursor: pointer; user-select: none; }
.aicom-card-collapsible .aicom-card-head:hover { background: var(--aicom-bg); }
.aicom-card-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.aicom-card-chevron { font-size: 0.58em; color: var(--aicom-text-xs); transition: transform 0.2s; }
.aicom-card-collapsible.is-collapsed .aicom-card-chevron { transform: rotate(-90deg); }
.aicom-card-collapsible.is-collapsed .aicom-card-body { display: none; }

/* ── Dashboard grid ─────────────────────────────────────────────────────── */
.aicom-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

/* ── Badges ─────────────────────────────────────────────────────────────── */
.aicom-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 11px;
    border-radius: 5px;
    font-weight: 700;
    font-size: 0.77em;
    letter-spacing: 0.2px;
}
.aicom-badge-success { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
.aicom-badge-warning { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.aicom-badge-danger  { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }

/* ── Status pills ───────────────────────────────────────────────────────── */
.aicom-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 5px;
    font-size: 0.76em;
    font-weight: 600;
    letter-spacing: 0.15px;
}
.aicom-status::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    flex-shrink: 0;
}
.aicom-status-active    { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
.aicom-status-active::before { background: #22c55e; }
.aicom-status-suspended { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.aicom-status-suspended::before { background: #f59e0b; }
.aicom-status-revoked   { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.aicom-status-revoked::before { background: #ef4444; }
.aicom-status-expired   { background: #fff3cd; color: #856404; border: 1px solid #fde68a; }
.aicom-status-expired::before { background: #f59e0b; }
.aicom-status-archived  { background: #f3f4f6; color: #6b7280; border: 1px solid #d1d5db; font-style: italic; }
.aicom-status-archived::before { background: #9ca3af; }
.aicom-status-warning   { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.aicom-status-warning::before { background: #f59e0b; }

.aicom-ip-lock-badge {
    display: inline-block;
    font-size: 0.7em;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 999px;
    margin-top: 4px;
    cursor: default;
}
.aicom-ip-lock-badge.is-bound   { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
.aicom-ip-lock-badge.is-waiting { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }

/* ── Edit key: scope diff preview ──────────────────────────────────────── */
#aicom-scope-diff { margin-top: 8px; font-size: 0.82em; font-family: 'JetBrains Mono', monospace; }
.aicom-diff-added   { color: #15803d; }
.aicom-diff-removed { color: #dc2626; }

/* ── Info rows (dashboard status card) ─────────────────────────────────── */
.aicom-info-rows { display: flex; flex-direction: column; gap: 10px; }
.aicom-info-row  { display: flex; justify-content: space-between; align-items: center; font-size: 0.85em; }
.aicom-info-label { color: var(--aicom-text-sm); font-weight: 500; }
.aicom-info-value {
    font-weight: 500;
    color: var(--aicom-text-md);
    font-size: 0.86em;
    background: var(--aicom-bg);
    padding: 2px 8px;
    border-radius: 4px;
    border: 1px solid var(--aicom-border);
    letter-spacing: -0.2px;
}

/* ── Stats grid ─────────────────────────────────────────────────────────── */
.aicom-stats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 4px;
}
.aicom-stat {
    text-align: center;
    padding: 16px 12px;
    background: var(--aicom-bg);
    border-radius: var(--aicom-radius-sm);
    border: 1px solid var(--aicom-border-light);
}
.aicom-stat-number {
    display: block;
    font-size: 2.3em;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -2px;
}
.aicom-stat-label {
    display: block;
    font-size: 0.72em;
    color: var(--aicom-text-xs);
    margin-top: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 600;
}
.aicom-success { color: #16a34a; }
.aicom-error   { color: #dc2626; }
.aicom-warning { color: #d97706; }

/* ── Module pills (dashboard active modules) ────────────────────────────── */
.aicom-modules-row { display: flex; flex-wrap: wrap; gap: 6px; }
.aicom-module-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 5px;
    font-size: 0.79em;
    font-weight: 600;
}
.aicom-module-active   { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
.aicom-module-inactive { background: var(--aicom-border-light); color: var(--aicom-text-xs); border: 1px solid var(--aicom-border); }
.aicom-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.aicom-module-active .aicom-dot   { background: #22c55e; }
.aicom-module-inactive .aicom-dot { background: #cbd5e1; }

/* ── Modules grid (modules page) ────────────────────────────────────────── */
.aicom-modules-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    margin-bottom: 0;
}
.aicom-module-card {
    background: var(--aicom-surface);
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius-sm);
    padding: 16px;
    transition: box-shadow 0.15s;
}
.aicom-module-card:hover { box-shadow: var(--aicom-shadow-md); }
.aicom-module-card-active  { border-left: 3px solid #22c55e; }
.aicom-module-card-inactive { border-left: 3px solid #cbd5e1; opacity: 0.7; }
.aicom-module-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.aicom-module-header h3 {
    margin: 0;
    font-size: 0.88em;
    font-weight: 700;
    flex: 1;
    color: var(--aicom-text);
    letter-spacing: -0.1px;
}
.aicom-module-status-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.aicom-dot-active   { background: #22c55e; }
.aicom-dot-inactive { background: #94a3b8; }
.aicom-module-desc  { font-size: 0.8em; color: var(--aicom-text-sm); margin: 0 0 10px; line-height: 1.55; }
.aicom-module-meta  { display: flex; justify-content: space-between; font-size: 0.75em; color: var(--aicom-text-xs); align-items: center; }
.aicom-module-tools { font-weight: 700; color: var(--aicom-text-sm); }
.aicom-module-requires { font-size: 0.9em; }

/* ── Tool class badges ──────────────────────────────────────────────────── */
.aicom-class-badge {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 4px;
    font-size: 0.73em;
    font-weight: 700;
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: -0.2px;
}
.aicom-class-public          { background: #eff6ff; color: #3b82f6; border: 1px solid #bfdbfe; }
.aicom-class-discovery       { background: #f0f9ff; color: #0284c7; border: 1px solid #bae6fd; }
.aicom-class-read            { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }
.aicom-class-write           { background: #fffbeb; color: #d97706; border: 1px solid #fde68a; }
.aicom-class-destructive     { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }
.aicom-class-admin_sensitive { background: #faf5ff; color: #9333ea; border: 1px solid #e9d5ff; }

/* ── Copy row ───────────────────────────────────────────────────────────── */
.aicom-copy-row { display: flex; gap: 8px; margin-bottom: 12px; align-items: center; }
.aicom-copy-row input {
    flex: 1;
    font-size: 0.84em;
    letter-spacing: -0.3px;
}

/* ── Card header link ───────────────────────────────────────────────────── */
.aicom-card-link {
    font-size: 0.78em;
    color: var(--aicom-primary);
    text-decoration: none;
    font-weight: 500;
}
.aicom-card-link:hover { text-decoration: underline; }

/* ── Endpoint rows (Connection Info tab) ────────────────────────────────── */
.aicom-endpoint-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px solid var(--aicom-border-light);
}
.aicom-endpoint-item:last-child { border-bottom: none; padding-bottom: 0; }
.aicom-endpoint-label {
    font-size: 0.72em;
    font-weight: 700;
    color: var(--aicom-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    min-width: 130px;
    flex-shrink: 0;
}
.aicom-endpoint-value {
    flex: 1;
    font-size: 0.81em;
    background: var(--aicom-bg);
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius-sm);
    padding: 7px 12px;
    color: var(--aicom-text-md);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: -0.2px;
}

/* ── Dashboard endpoint block (full-width, 3-col) ───────────────────────── */
.aicom-endpoint-row {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: stretch;
}
.aicom-endpoint-col {
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.aicom-endpoint-divider {
    width: 1px;
    background: var(--aicom-border-light);
    flex-shrink: 0;
}
.aicom-endpoint-url-row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.aicom-endpoint-url {
    flex: 1;
    font-size: 0.82em;
    color: var(--aicom-text-md);
    background: var(--aicom-bg);
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius-sm);
    padding: 6px 10px;
    letter-spacing: -0.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    min-width: 0;
    font-family: 'JetBrains Mono', 'SF Mono', monospace;
}

/* ── Form layout ────────────────────────────────────────────────────────── */
.aicom-form { display: flex; flex-direction: column; }
.aicom-field-row {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 20px;
    padding: 20px 0;
    border-bottom: 1px solid var(--aicom-border-light);
    align-items: start;
}
.aicom-field-row:last-child { border-bottom: none; padding-bottom: 0; }
.aicom-field-row:first-child { padding-top: 0; }
.aicom-field-label {
    font-size: 0.83em;
    font-weight: 700;
    color: var(--aicom-text-md);
    padding-top: 6px;
    line-height: 1.4;
}
.aicom-field-label small {
    display: block;
    font-weight: 400;
    color: var(--aicom-text-xs);
    margin-top: 2px;
    font-size: 0.88em;
}
.aicom-field-control { min-width: 0; }
.aicom-field-desc { font-size: 0.77em; color: var(--aicom-text-xs); margin: 6px 0 0; line-height: 1.55; }

.aicom-toggle-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 0.87em;
    color: var(--aicom-text-md);
    font-weight: 500;
}

/* ── Resource Restrictions collapsible ─────────────────────────────────── */
.aicom-res-section {
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius-sm);
    overflow: hidden;
    margin: 12px 0;
}
.aicom-res-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
    user-select: none;
    background: var(--aicom-surface);
    transition: background 0.15s;
}
.aicom-res-header:hover { background: var(--aicom-bg); }
.aicom-res-icon { font-size: 0.85em; opacity: 0.65; }
.aicom-res-title { font-size: 0.83em; font-weight: 700; color: var(--aicom-text-md); }
.aicom-res-badge {
    font-size: 0.68em; font-weight: 700;
    background: var(--aicom-primary-lt); color: var(--aicom-primary);
    padding: 1px 8px; border-radius: 20px;
}
.aicom-res-chevron {
    margin-left: auto; font-size: 0.55em; color: var(--aicom-text-xs);
    transition: transform 0.2s;
}
.aicom-res-section.is-open .aicom-res-chevron { transform: rotate(90deg); }
.aicom-res-body { display: none; border-top: 1px solid var(--aicom-border); }
.aicom-res-section.is-open .aicom-res-body { display: block; }
.aicom-res-intro {
    padding: 9px 14px;
    font-size: 0.79em; color: var(--aicom-text-sm); line-height: 1.55;
    background: var(--aicom-bg); border-bottom: 1px solid var(--aicom-border-light);
}
.aicom-res-grid { display: grid; grid-template-columns: 1fr 1fr; }
.aicom-res-field {
    padding: 12px 14px;
    border-right: 1px solid var(--aicom-border-light);
    border-bottom: 1px solid var(--aicom-border-light);
    border-left: 3px solid transparent;
    transition: border-left-color 0.15s, background 0.15s;
}
.aicom-res-field:nth-child(2n) { border-right: none; }
.aicom-res-field.is-full { grid-column: 1 / -1; border-right: none; }
.aicom-res-field:last-child,
.aicom-res-field.is-full:last-child { border-bottom: none; }
.aicom-res-field.has-value { border-left-color: #16a34a; background: #f0fdf4; }
.aicom-res-field.is-warn-empty { border-left-color: #d97706; background: #fffbeb; }
.aicom-res-label {
    display: flex; align-items: center; gap: 7px;
    font-size: 0.77em; font-weight: 700;
    color: var(--aicom-text-md); margin-bottom: 5px;
}
.aicom-res-status {
    font-size: 0.85em; font-weight: 600;
    padding: 1px 7px; border-radius: 3px;
    margin-left: auto;
}
.aicom-res-status.is-set     { background: #dcfce7; color: #15803d; }
.aicom-res-status.is-unset   { background: #f3f4f6; color: #9ca3af; }
.aicom-res-status.is-blocked { background: #fef3c7; color: #b45309; }
.aicom-res-field textarea {
    width: 100%; font-family: monospace; font-size: 0.82em;
    box-sizing: border-box; resize: vertical;
    border: 1px solid var(--aicom-border); border-radius: 3px;
    padding: 5px 7px; background: #fff; color: var(--aicom-text);
    line-height: 1.4;
}
.aicom-res-field textarea:focus {
    border-color: var(--aicom-primary); outline: none;
    box-shadow: 0 0 0 2px var(--aicom-primary-lt);
}
.aicom-res-hint { font-size: 0.71em; color: var(--aicom-text-xs); margin: 4px 0 0; line-height: 1.4; }
.aicom-res-hint.is-warn { color: #b91c1c; font-weight: 600; }

/* ── Form footer ─────────────────────────────────────────────────────────── */
.aicom-form-footer {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 20px;
    margin-top: 4px;
    border-top: 1px solid var(--aicom-border-light);
}

/* ── Filters ────────────────────────────────────────────────────────────── */
.aicom-filters { margin-bottom: 16px; }
.aicom-filter-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.aicom-filter-row select,
.aicom-filter-row input[type="text"] { max-width: 180px; }
.aicom-filter-row input[type="datetime-local"] { font-size: 0.84em; }

/* ── Keys / data table ──────────────────────────────────────────────────── */
.aicom-keys-table { width: 100%; border-collapse: collapse; font-size: 0.875em; }
.aicom-keys-table thead tr { border-bottom: 1px solid var(--aicom-border); }
.aicom-keys-table th {
    text-align: left;
    padding: 10px 14px;
    font-size: 0.7em;
    font-weight: 700;
    color: var(--aicom-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.65px;
    white-space: nowrap;
    background: var(--aicom-bg);
}
.aicom-keys-table td {
    padding: 11px 14px;
    vertical-align: middle;
    border-bottom: 1px solid var(--aicom-border-light);
    color: var(--aicom-text-md);
}
.aicom-keys-table tbody tr:last-child td { border-bottom: none; }
.aicom-keys-table tbody tr:hover td { background: #fafbfc; }

/* Logs table */
.aicom-logs-table td { vertical-align: middle; }
.aicom-logs-table code { font-size: 0.78em; }

.aicom-key-label  { font-weight: 700; color: var(--aicom-text); }
.aicom-key-prefix {
    font-size: 0.8em;
    color: var(--aicom-text-sm);
    background: var(--aicom-bg);
    border: 1px solid var(--aicom-border);
    padding: 2px 7px;
    border-radius: 4px;
    letter-spacing: -0.2px;
}
.aicom-key-scopes summary { cursor: pointer; color: var(--aicom-text-sm); font-size: 0.85em; }
.aicom-key-scopes code { font-size: 0.77em; display: block; margin-top: 3px; color: var(--aicom-text-xs); }
.aicom-key-date { font-size: 0.79em; color: var(--aicom-text-xs); white-space: nowrap; }
.aicom-key-actions { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.aicom-key-actions .button-small { font-size: 0.78em; padding: 2px 8px; }

/* Policy matrix */
.aicom-cell-yes { color: #22c55e; font-weight: 700; text-align: center; font-size: 1.05em; }
.aicom-cell-no  { color: #ef4444; font-weight: 700; text-align: center; font-size: 1.05em; }

/* ── Tab bar ────────────────────────────────────────────────────────────── */
.aicom-tab-bar {
    display: flex;
    border-bottom: 1px solid var(--aicom-border);
    margin-bottom: 20px;
    gap: 0;
}
a.aicom-tab-btn { text-decoration: none; }
.aicom-tab-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 11px 18px;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    cursor: pointer;
    font-size: 0.85em;
    font-weight: 500;
    color: var(--aicom-text-sm);
    font-family: 'Plus Jakarta Sans', sans-serif;
    transition: color 0.12s, border-color 0.12s;
    white-space: nowrap;
}
.aicom-tab-btn:hover { color: var(--aicom-text); }
.aicom-tab-btn.is-active {
    color: var(--aicom-primary);
    border-bottom-color: var(--aicom-primary);
    font-weight: 700;
}
.aicom-tab-badge {
    display: inline-block;
    background: var(--aicom-border-light);
    color: var(--aicom-text-xs);
    border-radius: 20px;
    padding: 1px 8px;
    font-size: 0.78em;
    font-weight: 700;
    line-height: 1.6;
    border: 1px solid var(--aicom-border);
}
.aicom-tab-btn.is-active .aicom-tab-badge {
    background: var(--aicom-primary-lt);
    color: var(--aicom-primary-dk);
    border-color: #f4b896;
}
.aicom-tab-panel { display: none; }
.aicom-tab-panel.is-active { display: block; }

/* ── Preset Cards ───────────────────────────────────────────────────────── */
.aicom-preset-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
    gap: 10px;
    margin-bottom: 4px;
}
.aicom-preset-card {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 14px 14px 12px;
    border: 1.5px solid var(--aicom-border);
    border-radius: var(--aicom-radius-sm);
    background: var(--aicom-surface);
    cursor: pointer;
    text-align: left;
    transition: border-color 0.12s, box-shadow 0.12s, background 0.12s;
    font-family: 'Plus Jakarta Sans', sans-serif;
    position: relative;
}
.aicom-preset-card:hover {
    border-color: #f4b896;
    box-shadow: 0 0 0 3px rgba(232,93,44,.07);
}
.aicom-preset-card.is-active {
    border-color: var(--aicom-primary);
    background: var(--aicom-primary-lt);
    box-shadow: 0 0 0 3px rgba(232,93,44,.12);
}
.aicom-preset-name  { font-weight: 700; font-size: 0.85em; color: var(--aicom-text); line-height: 1.3; }
.aicom-preset-desc  { font-size: 0.75em; color: var(--aicom-text-sm); line-height: 1.3; }
.aicom-preset-count { font-size: 0.72em; color: var(--aicom-text-xs); margin-top: auto; padding-top: 4px; }
.aicom-preset-custom { border-style: dashed; }
.aicom-preset-custom.is-active { border-style: solid; }
.aicom-preset-risk-low      { border-top: 3px solid #22c55e; }
.aicom-preset-risk-med      { border-top: 3px solid var(--aicom-primary); }
.aicom-preset-risk-high     { border-top: 3px solid #f59e0b; }
.aicom-preset-risk-critical { border-top: 3px solid #ef4444; }
.aicom-preset-user          { border-top: 3px solid #a855f7; }

/* When .aicom-preset-card is a <button> (dashboard quick-gen), reset browser chrome */
button.aicom-preset-card {
    font: inherit;
    color: inherit;
    appearance: none;
    -webkit-appearance: none;
}

/* ── Pagination — Activity logs ──────────────────────────────────────── */
.aicom-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 16px 18px;
    border-top: 1px solid var(--aicom-border-light);
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 0.92em;
}
.aicom-pagination-step {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    color: var(--aicom-text-md);
    text-decoration: none;
    border-radius: 5px;
    transition: background .12s, color .12s;
}
.aicom-pagination-step:hover {
    background: var(--aicom-bg);
    color: var(--aicom-ink);
}
.aicom-pagination-step.is-disabled {
    color: var(--aicom-text-xs);
    cursor: not-allowed;
    opacity: .6;
}
.aicom-pagination-pages {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin: 0 6px;
}
.aicom-pagination-num {
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--aicom-text-md);
    text-decoration: none;
    border-radius: 5px;
    font-variant-numeric: tabular-nums;
    transition: background .12s, color .12s;
}
.aicom-pagination-num:hover {
    background: var(--aicom-bg);
    color: var(--aicom-ink);
}
.aicom-pagination-num.is-current {
    background: var(--aicom-ink);
    color: #fff;
    font-weight: 600;
    cursor: default;
}
.aicom-pagination-gap {
    width: 22px;
    text-align: center;
    color: var(--aicom-text-xs);
    user-select: none;
}

/* ── Capabilities — use-case groups ──────────────────────────────────── */
.aicom-cap-group { margin-bottom: 16px; }
.aicom-cap-group .aicom-card-head {
    align-items: flex-start;
    gap: 16px;
}
.aicom-cap-group-lede {
    margin: 4px 0 0;
    font-size: 0.88em;
    color: var(--aicom-text-md);
    font-style: italic;
    line-height: 1.5;
    max-width: 56ch;
}

/* ── Key modal — test connection ─────────────────────────────────────── */
.aicom-keymodal-test {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
    flex-wrap: wrap;
}
.aicom-keymodal-test-btn {
    border-radius: 6px;
}
.aicom-keymodal-test-result {
    font-size: 0.88em;
    line-height: 1.4;
    flex: 1;
    min-width: 0;
}
.aicom-keymodal-test-result.is-ok    { color: #15803d; }
.aicom-keymodal-test-result.is-warn  { color: #92400e; }
.aicom-keymodal-test-result.is-err   { color: #b91c1c; }
.aicom-keymodal-test-result.is-testing { color: var(--aicom-text-sm); font-style: italic; }

/* ── Generate Key — scope-tree-from-preset hint ──────────────────────── */
.aicom-scope-hint {
    margin: 0 0 10px;
    padding: 8px 12px;
    font-size: 0.84em;
    color: var(--aicom-text-md);
    background: var(--aicom-bg);
    border-left: 3px solid var(--aicom-primary);
    border-radius: 3px;
}

/* ── Post-onboarding success banner ──────────────────────────────────── */
.aicom-onboarding-banner {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 18px;
    margin: 0 0 18px;
    background: linear-gradient(90deg, rgba(34, 197, 94, .12) 0%, var(--aicom-bg) 60%);
    border: 1px solid #bbf7d0;
    border-left: 4px solid #15803d;
    border-radius: 8px;
    animation: aicomBannerIn .35s ease-out;
}
@keyframes aicomBannerIn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: none; }
}
.aicom-onboarding-banner-mark {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #15803d;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
    font-size: 14px;
}
.aicom-onboarding-banner-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
    font-size: 0.93em;
    line-height: 1.5;
    color: var(--aicom-text-md);
}
.aicom-onboarding-banner-text strong {
    color: var(--aicom-ink);
    font-weight: 700;
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 24;
    font-size: 1.08em;
}
.aicom-onboarding-banner-close {
    background: none;
    border: none;
    color: var(--aicom-text-sm);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    padding: 2px 6px;
    flex-shrink: 0;
}
.aicom-onboarding-banner-close:hover { color: var(--aicom-ink); }

/* ── Dashboard: Quick API key generation ─────────────────────────────── */
.aicom-quick-keys { margin-bottom: 16px; }
.aicom-quick-keys-lede {
    margin: 0 0 14px;
    font-size: 0.9em;
    color: var(--aicom-text-md);
    line-height: 1.5;
}
.aicom-quick-keys-form .aicom-preset-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 0;
}
@media (max-width: 1024px) {
    .aicom-quick-keys-form .aicom-preset-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .aicom-quick-keys-form .aicom-preset-grid { grid-template-columns: 1fr; }
}

/* ── Task-oriented cards (Hub-style, adapted for local single-site) ─── */
.aicom-task-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 14px;
}
@media (max-width: 1100px) {
    .aicom-task-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .aicom-task-grid { grid-template-columns: 1fr; }
}
.aicom-task-card {
    appearance: none;
    -webkit-appearance: none;
    background: var(--aicom-surface);
    border: 1px solid var(--aicom-border);
    border-radius: 10px;
    padding: 20px 22px 18px;
    text-align: left;
    cursor: pointer;
    font: inherit;
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: border-color .14s, box-shadow .14s, transform .14s, background .14s;
    position: relative;
}
.aicom-task-card:hover {
    border-color: var(--aicom-primary-lt);
    box-shadow: 0 6px 20px rgba(22, 24, 29, .06);
    transform: translateY(-2px);
}
.aicom-task-card:hover .aicom-task-cta {
    color: var(--aicom-primary);
}
.aicom-task-icon {
    color: var(--aicom-primary);
    margin-bottom: 6px;
    display: inline-flex;
}
.aicom-task-name {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 24;
    font-weight: 500;
    font-size: 1.05em;
    color: var(--aicom-ink);
    line-height: 1.25;
}
.aicom-task-desc {
    font-size: 0.88em;
    line-height: 1.55;
    color: var(--aicom-text-md);
    flex: 1;
}
.aicom-task-meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72em;
    color: var(--aicom-text-sm);
    letter-spacing: 0.02em;
    margin-top: 6px;
}
.aicom-task-meta-tag {
    background: var(--aicom-primary-lt);
    color: var(--aicom-primary-dk);
    padding: 1px 6px;
    border-radius: 3px;
    font-weight: 600;
}
.aicom-task-cta {
    color: var(--aicom-primary-dk);
    font-size: 0.85em;
    margin-top: 8px;
    font-style: italic;
    font-family: 'Fraunces', serif;
    transition: color .15s;
}
.aicom-task-footer {
    margin: 6px 0 0;
    font-size: 0.88em;
    color: var(--aicom-text-sm);
}
.aicom-task-footer a {
    color: var(--aicom-primary-dk);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.aicom-task-footer a:hover { color: var(--aicom-primary); }

/* ── Confirm modal (Quick key generation) ────────────────────────────── */
.aicom-confirm-overlay {
    position: fixed;
    inset: 0;
    z-index: 999999;
    background: rgba(22, 24, 29, .55);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
}
.aicom-confirm-overlay[hidden] { display: none; }
.aicom-confirm-modal {
    background: var(--aicom-surface);
    border-radius: 12px;
    box-shadow: 0 24px 64px rgba(22, 24, 29, .25);
    width: 100%;
    max-width: 520px;
    margin: 20px;
    padding: 28px 28px 24px;
    position: relative;
    font-family: 'Plus Jakarta Sans', sans-serif;
    animation: aicomConfirmIn .18s ease-out;
}
@keyframes aicomConfirmIn {
    from { opacity: 0; transform: translateY(8px) scale(.98); }
    to   { opacity: 1; transform: none; }
}
.aicom-confirm-close {
    position: absolute;
    top: 12px;
    right: 14px;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--aicom-text-sm);
    font-size: 22px;
    line-height: 1;
    padding: 4px 8px;
    border-radius: 4px;
    transition: background .15s, color .15s;
}
.aicom-confirm-close:hover { background: var(--aicom-bg); color: var(--aicom-ink); }
.aicom-confirm-modal h3 {
    margin: 0 0 16px;
    font-size: 1.15em;
    font-weight: 700;
    color: var(--aicom-ink);
    line-height: 1.3;
}
.aicom-confirm-sub {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 18px;
    padding: 10px 12px;
    background: var(--aicom-bg);
    border-radius: 6px;
    font-size: 0.92em;
}
.aicom-confirm-sub-label {
    font-size: 0.7em;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--aicom-text-sm);
    font-family: 'JetBrains Mono', monospace;
}
.aicom-confirm-sub strong { color: var(--aicom-ink); font-weight: 700; }
.aicom-confirm-scopes-label {
    font-size: 0.7em;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--aicom-text-sm);
    font-family: 'JetBrains Mono', monospace;
    margin: 0 0 8px;
}
.aicom-confirm-scopes {
    list-style: none;
    margin: 0 0 22px;
    padding: 0;
    max-height: 240px;
    overflow-y: auto;
    border: 1px solid var(--aicom-border);
    border-radius: 6px;
}
.aicom-confirm-scopes li {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 10px;
    align-items: center;
    padding: 10px 14px;
    border-bottom: 1px solid var(--aicom-border-light);
    font-size: 0.88em;
}
.aicom-confirm-scopes li:last-child { border-bottom: none; }
.aicom-confirm-scope-label { color: var(--aicom-text); }
.aicom-confirm-scope-slug code {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.84em;
    color: var(--aicom-text-sm);
    background: var(--aicom-bg);
    padding: 2px 6px;
    border-radius: 3px;
}
.aicom-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

/* Key modal — reuses .aicom-confirm-* base classes, adds field-specific styles */
.aicom-keymodal { max-width: 720px; }
.aicom-keymodal h3 {
    margin: 0 0 22px;
    font-size: 1.3em;
    font-weight: 700;
    color: var(--aicom-ink);
}
.aicom-keymodal-status {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 18px;
    flex-wrap: wrap;
}
.aicom-keymodal-status-badge {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #15803d;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 0.72em;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.aicom-keymodal-status-note {
    color: #dc2626;
    font-size: 0.82em;
    font-weight: 600;
}
.aicom-keymodal-field { margin-bottom: 24px; }
.aicom-keymodal-field:last-of-type { margin-bottom: 28px; }

/* Larger, friendlier section subtitles inside the key modal */
.aicom-keymodal .aicom-confirm-scopes-label {
    font-size: 0.88em;
    letter-spacing: .1em;
    color: var(--aicom-ink);
    margin-bottom: 6px;
    display: block;
}

.aicom-keymodal-desc {
    margin: 4px 0 10px;
    font-size: 0.93em;
    color: var(--aicom-text-md);
    line-height: 1.55;
}
.aicom-keymodal-row {
    display: flex;
    gap: 8px;
    align-items: stretch;
    margin-top: 6px;
}
.aicom-keymodal-input {
    flex: 1;
    min-width: 0;
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    padding: 10px 14px;
    border: 1.5px solid var(--aicom-border);
    border-radius: 6px;
    background: var(--aicom-bg);
    color: var(--aicom-ink);
}
.aicom-keymodal-input:focus {
    outline: none;
    border-color: var(--aicom-primary);
    box-shadow: 0 0 0 3px rgba(232, 93, 44, .12);
}

/* Terminal-style box for the agent prompt */
.aicom-keymodal-terminal-wrap {
    position: relative;
    margin: 6px 0 10px;
}
.aicom-keymodal-terminal {
    background: var(--aicom-ink);
    color: #f5f1e8;
    font-family: 'JetBrains Mono', 'SF Mono', monospace;
    font-size: 12.5px;
    line-height: 1.65;
    padding: 18px 56px 18px 20px; /* extra right padding for the icon */
    border-radius: 8px;
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 240px;
    overflow-y: auto;
    user-select: all;
    border: 1px solid #2a2d33;
}
.aicom-keymodal-terminal-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(245, 241, 232, .08);
    border: 1px solid rgba(245, 241, 232, .2);
    border-radius: 5px;
    color: rgba(245, 241, 232, .75);
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s, transform .15s;
    padding: 0;
}
.aicom-keymodal-terminal-icon:hover {
    background: rgba(232, 93, 44, .85);
    color: #fff;
    border-color: var(--aicom-primary);
    transform: translateY(-1px);
}
.aicom-keymodal-terminal-icon.is-copied {
    background: #15803d;
    border-color: #15803d;
    color: #fff;
}
.aicom-keymodal-terminal-icon .aicom-icon-check { display: none; }
.aicom-keymodal-terminal-icon.is-copied .aicom-icon-copy { display: none; }
.aicom-keymodal-terminal-icon.is-copied .aicom-icon-check { display: block; }
.aicom-keymodal-terminal-actions {
    display: flex;
    justify-content: flex-end;
}
.aicom-keymodal-row .button {
    white-space: nowrap;
    flex-shrink: 0;
    align-self: flex-start;
}

.aicom-preset-user-badge {
    font-size: 0.65em;
    color: #a855f7;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.aicom-preset-actions {
    position: absolute;
    top: 6px;
    right: 6px;
    display: none;
    flex-direction: row;
    gap: 1px;
    align-items: center;
}
.aicom-preset-user:hover .aicom-preset-actions { display: flex; }

.aicom-preset-rename,
.aicom-preset-duplicate,
.aicom-preset-delete {
    background: none;
    border: none;
    cursor: pointer;
    color: #4b5563;
    font-size: 11px;
    line-height: 1;
    padding: 3px 5px;
    border-radius: 4px;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.aicom-preset-rename:hover,
.aicom-preset-duplicate:hover { background: #eff6ff; color: #3b82f6; }
.aicom-preset-delete:hover { background: #fee2e2; color: #dc2626; }

.aicom-preset-rename::after,
.aicom-preset-duplicate::after,
.aicom-preset-delete::after {
    content: attr(title);
    position: absolute;
    bottom: calc(100% + 5px);
    left: 50%;
    transform: translateX(-50%);
    background: #1e293b;
    color: #fff;
    font-size: 0.7em;
    font-weight: 500;
    padding: 3px 7px;
    border-radius: 4px;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.12s;
    z-index: 200;
}
.aicom-preset-rename:hover::after,
.aicom-preset-duplicate:hover::after,
.aicom-preset-delete:hover::after { opacity: 1; }

/* ── Risk Badges ────────────────────────────────────────────────────────── */
.aicom-risk-badge {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.64em;
    font-weight: 700;
    letter-spacing: 0.45px;
    font-family: 'Plus Jakarta Sans', sans-serif;
}
.aicom-risk-low      { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
.aicom-risk-med      { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }
.aicom-risk-high     { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.aicom-risk-critical { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }

/* ── Save-as-preset bar ─────────────────────────────────────────────────── */
.aicom-save-preset-wrap { margin-top: 14px; display: flex; align-items: center; gap: 8px; }

/* ── Scope search ───────────────────────────────────────────────────────── */
.aicom-scope-search {
    width: 100%;
    max-width: 300px;
    display: block;
    margin-bottom: 12px;
    font-size: 0.87em;
}

/* ── Scope Tree ─────────────────────────────────────────────────────────── */
#aicom-scope-tree { margin-top: 0; }
.aicom-tree-group {
    margin-bottom: 6px;
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius-sm);
    overflow: hidden;
}
.aicom-tree-group-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: var(--aicom-bg);
    cursor: pointer;
    user-select: none;
    border-bottom: 1px solid var(--aicom-border-light);
}
.aicom-tree-group-header:hover { background: var(--aicom-border-light); }
.aicom-tree-group-header strong {
    font-size: 0.81em;
    font-weight: 700;
    color: var(--aicom-text-sm);
    letter-spacing: -0.1px;
}
.aicom-tree-chevron {
    font-size: 0.55em;
    color: var(--aicom-text-xs);
    display: inline-block;
    transition: transform 0.15s;
}
.aicom-tree-group.is-collapsed .aicom-tree-chevron { transform: rotate(-90deg); }
.aicom-tree-group.is-collapsed .aicom-tree-group-body { display: none; }
.aicom-tree-group.is-collapsed .aicom-tree-group-header { border-bottom: none; }
.aicom-tree-group-count { margin-left: auto; font-size: 0.74em; color: var(--aicom-primary); font-weight: 700; }
.aicom-tree-scope-row {
    display: grid;
    grid-template-columns: 20px 1fr minmax(180px,220px) 64px;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    cursor: pointer;
    border-bottom: 1px solid var(--aicom-border-light);
}
.aicom-tree-scope-row:last-child { border-bottom: none; }
.aicom-tree-scope-row:hover { background: var(--aicom-bg); }
.aicom-tree-scope-row.is-hidden { display: none; }
.aicom-tree-scope-row input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
    accent-color: var(--aicom-primary);
}
.aicom-tree-scope-label { font-size: 0.83em; color: var(--aicom-text-md); }
.aicom-tree-scope-code  {
    font-size: 0.73em;
    color: var(--aicom-text-xs);
    letter-spacing: -0.2px;
}
.aicom-tree-scope-row .aicom-risk-badge { justify-self: end; }

/* ── Kebab menu ─────────────────────────────────────────────────────────── */
.aicom-km { position: relative; display: inline-block; }
.aicom-km-trigger {
    width: 30px;
    height: 30px;
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius-sm);
    background: var(--aicom-surface);
    color: var(--aicom-text-sm);
    font-size: 1.1em;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.12s, border-color 0.12s;
    padding: 0;
}
.aicom-km-trigger:hover,
.aicom-km.is-open .aicom-km-trigger {
    background: var(--aicom-bg);
    border-color: #94a3b8;
    color: var(--aicom-text);
}
.aicom-km-dropdown {
    display: none;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999;
    background: var(--aicom-surface);
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius-sm);
    box-shadow: var(--aicom-shadow-md);
    min-width: 160px;
    padding: 4px;
    white-space: nowrap;
}
.aicom-km.is-open .aicom-km-dropdown { display: block; }
.aicom-km-dropdown form { margin: 0; }
.aicom-km-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 7px 12px;
    border: none;
    background: none;
    border-radius: 4px;
    font-size: 0.83em;
    color: var(--aicom-text-md);
    cursor: pointer;
    text-align: left;
    font-family: 'Plus Jakarta Sans', sans-serif;
    transition: background 0.1s;
    font-weight: 500;
}
.aicom-km-item:hover          { background: var(--aicom-bg); }
.aicom-km-item.aicom-km-warn  { color: #d97706; }
.aicom-km-item.aicom-km-warn:hover   { background: #fffbeb; }
.aicom-km-item.aicom-km-danger { color: #dc2626; }
.aicom-km-item.aicom-km-danger:hover { background: #fef2f2; }
.aicom-km-item.aicom-km-ok    { color: #16a34a; }
.aicom-km-item.aicom-km-ok:hover    { background: #f0fdf4; }
.aicom-km-icon { font-size: 0.9em; width: 14px; text-align: center; flex-shrink: 0; }
.aicom-km-sep  { height: 1px; background: var(--aicom-border); margin: 4px 0; }

/* ── Action buttons ─────────────────────────────────────────────────────── */
.aicom-wrap .aicom-btn-danger       { color: #dc2626; border-color: #fca5a5; }
.aicom-wrap .aicom-btn-danger:hover { background: #fef2f2; color: #dc2626; }

/* ── Hard lock notice ───────────────────────────────────────────────────── */
.aicom-hard-lock-notice { color: #92400e; font-style: italic; }

/* ── Scope grid (legacy) ────────────────────────────────────────────────── */
.aicom-scope-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px; }
.aicom-scope-label { display: flex; align-items: flex-start; gap: 6px; padding: 4px; cursor: pointer; }
.aicom-scope-label:hover { background: var(--aicom-border-light); border-radius: 3px; }
.aicom-scope-code { font-size: 0.75em; color: var(--aicom-text-xs); display: block; }
.aicom-check-all-label { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 8px; cursor: pointer; }

/* ── AICOM Admin Bar Toolbar ────────────────────────────────────────────── */
#wpadminbar #wp-admin-bar-aicom-toolbar > .ab-item { padding: 0 10px; }
/* Icon rendered via ::before so WP's native `.ab-icon::before { color: ... }` rules
   (default dim, hover full bright) apply naturally — same pattern as dashicons. */
#wpadminbar #wp-toolbar #wp-admin-bar-root-default #wp-admin-bar-aicom-toolbar .aicom-tb-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 32px;
    padding: 0;
}
#wpadminbar #wp-toolbar #wp-admin-bar-root-default #wp-admin-bar-aicom-toolbar .aicom-tb-icon::before {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    background-color: currentColor;
    -webkit-mask: url('branding/aicom-icon-mono.svg') center / contain no-repeat;
            mask: url('branding/aicom-icon-mono.svg') center / contain no-repeat;
}
#wpadminbar #wp-admin-bar-aicom-toolbar.aicom-tb-hardlocked > .ab-item {
    background: rgba(220,38,38,.85) !important;
    color: #fff !important;
}
#wpadminbar #wp-admin-bar-aicom-toolbar.aicom-tb-hardlocked > .ab-item .aicom-tb-count {
    background: #fff;
    color: #dc2626;
}
#wpadminbar #wp-admin-bar-aicom-toolbar.aicom-tb-softlocked > .ab-item {
    background: rgba(217,119,6,.75) !important;
    color: #fff !important;
}
#wpadminbar #wp-admin-bar-aicom-toolbar.aicom-tb-softlocked > .ab-item .aicom-tb-count {
    background: #fff;
    color: #d97706;
}
#wpadminbar .aicom-tb-lock-row > .ab-item {
    display: flex !important;
    align-items: center;
    gap: 6px;
    padding: 8px 12px !important;
    border-bottom: 1px solid rgba(255,255,255,.1);
}
#wpadminbar .aicom-tb-lock-btn {
    font-size: 11px; padding: 3px 9px; border-radius: 3px; border: none;
    cursor: pointer; font-weight: 600; line-height: 1.6;
    background: rgba(255,255,255,.12); color: rgba(255,255,255,.7);
    transition: background .15s;
}
#wpadminbar .aicom-tb-lock-btn:hover { background: rgba(255,255,255,.25); color: #fff; }
#wpadminbar .aicom-tb-lock-btn.is-active { background: rgba(255,255,255,.28); color: #fff; font-weight: 700; }
#wpadminbar .aicom-tb-lock-hard.is-active { background: rgba(220,38,38,.6) !important; color: #fff !important; }
#wpadminbar .aicom-tb-lock-hard:not(.is-active):hover { background: rgba(220,38,38,.35) !important; color: #fca5a5 !important; }
#wpadminbar .aicom-tb-key > .ab-item {
    display: flex !important;
    align-items: center;
    gap: 6px;
    padding: 0 12px !important;
    min-width: 240px;
}
#wpadminbar .aicom-tb-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 160px; }
#wpadminbar .aicom-tb-dot   { font-size: 10px; line-height: 1; flex-shrink: 0; }
#wpadminbar .aicom-tb-btn {
    font-size: 10px; padding: 2px 7px; border-radius: 3px; border: none;
    cursor: pointer; font-weight: 700; line-height: 1.6; flex-shrink: 0;
}
#wpadminbar .aicom-tb-btn-suspend   { background: rgba(245,158,11,.25); color: #fbbf24; }
#wpadminbar .aicom-tb-btn-suspend:hover { background: rgba(245,158,11,.45); }
#wpadminbar .aicom-tb-btn-unsuspend { background: rgba(34,197,94,.25);  color: #4ade80; }
#wpadminbar .aicom-tb-btn-unsuspend:hover { background: rgba(34,197,94,.45); }
#wpadminbar .aicom-tb-manage > .ab-item { border-top: 1px solid rgba(255,255,255,.1) !important; font-style: italic; opacity: .8; }
#wpadminbar .aicom-tb-count {
    display: inline-block; min-width: 18px; height: 18px; line-height: 18px;
    padding: 0 5px; border-radius: 9px; font-size: 11px; font-weight: 700;
    background: var(--aicom-primary); color: #fff; margin-left: 5px; vertical-align: middle; text-align: center;
}

/* ── Sessions: activity graph ───────────────────────────────────────── */
.aicom-graph {
    display: flex;
    align-items: flex-end;
    gap: 3px;
    height: 80px;
}
.aicom-graph-bar {
    flex: 1;
    border-radius: 4px 4px 0 0;
    cursor: pointer;
    transition: filter .15s;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.aicom-graph-bar:hover {
    filter: brightness(.82);
}
.aicom-graph-bar.is-active {
    filter: brightness(.75);
    outline: 2px solid var(--aicom-primary);
    outline-offset: 1px;
}
.aicom-graph-bar.is-empty {
    min-height: 3px;
    background: var(--aicom-border);
    cursor: default;
    opacity: .45;
    filter: none;
}
.aicom-graph-bar.is-empty:hover {
    filter: none;
}
/* ── Graph segments (tool class colors) ──────────────────────────────── */
.aicom-graph-seg            { width: 100%; flex-shrink: 0; }
.seg-public                 { background: #3b82f6; }
.seg-discovery              { background: #0284c7; }
.seg-read                   { background: #16a34a; }
.seg-write                  { background: #d97706; }
.seg-destructive            { background: #dc2626; }
.seg-admin_sensitive        { background: #9333ea; }
/* ── Graph legend ─────────────────────────────────────────────────────── */
.aicom-graph-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-top: 10px;
}
.aicom-graph-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.74em;
    color: var(--aicom-text-sm);
}
.aicom-graph-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    flex-shrink: 0;
}
.aicom-graph-dates {
    display: flex;
    justify-content: space-between;
    font-size: 0.7em;
    color: var(--aicom-text-xs);
    padding: 4px 0 0;
}

/* ── Sessions: session cards ─────────────────────────────────────────── */
.aicom-session {
    border: 1px solid var(--aicom-border);
    border-radius: var(--aicom-radius-sm);
    margin-top: 8px;
    overflow: hidden;
}
.aicom-session-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
    background: var(--aicom-surface);
    user-select: none;
    flex-wrap: wrap;
}
.aicom-session-name {
    font-weight: 600;
    font-size: 0.88em;
    flex: 1;
    min-width: 120px;
}
p.aicom-session-desc {
    margin: 0;
    padding: 10px 16px;
    font-size: 0.82em;
    color: var(--aicom-text-sm);
    border-bottom: 1px solid var(--aicom-border-light);
    line-height: 1.5;
    font-style: italic;
}
.aicom-session-meta {
    font-size: 0.78em;
    color: var(--aicom-text-sm);
    white-space: nowrap;
}
.aicom-session-body {
    display: none;
    border-top: 1px solid var(--aicom-border-light);
}
.aicom-session.is-open .aicom-session-body {
    display: block;
}
.aicom-session-toggle {
    font-size: 0.72em;
    color: var(--aicom-text-xs);
    flex-shrink: 0;
    transition: transform .15s;
}
.aicom-session.is-highlighted {
    outline: 2px solid var(--aicom-primary);
    outline-offset: -1px;
    border-radius: var(--aicom-radius-sm);
}
.aicom-session.is-open .aicom-session-toggle {
    transform: rotate(180deg);
}
.aicom-badge-active {
    background: #dcfce7;
    color: #15803d;
    border: 1px solid #bbf7d0;
    font-size: 0.68em;
    padding: 2px 7px;
    border-radius: 999px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    flex-shrink: 0;
}

/* ── Backups dashboard stat grid ────────────────────────────────────────── */
.aicom-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
@media (max-width: 780px) {
    .aicom-stat-grid { grid-template-columns: 1fr 1fr; }
}
.aicom-stat-box {
    padding: 18px 20px;
    background: var(--aicom-bg);
    border: 1px solid var(--aicom-border-light);
    border-radius: var(--aicom-radius-sm);
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.aicom-stat-box.is-ok {
    background: #f0fdf4;
    border-color: #bbf7d0;
}
.aicom-stat-box.is-warn {
    background: #fffbeb;
    border-color: #fde68a;
}
.aicom-stat-value {
    font-size: 1.6em;
    font-weight: 800;
    letter-spacing: -0.5px;
    line-height: 1.15;
    color: var(--aicom-text);
}
.aicom-stat-box.is-ok .aicom-stat-value  { color: #15803d; }
.aicom-stat-box.is-warn .aicom-stat-value { color: #92400e; }
.aicom-stat-box .aicom-stat-label {
    font-size: 0.75em;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 600;
    color: var(--aicom-text-xs);
    margin-top: 0;
}
.aicom-stat-box.is-ok .aicom-stat-label  { color: #15803d; }
.aicom-stat-box.is-warn .aicom-stat-label { color: #92400e; }

/* ── Help page — editorial cottage ─────────────────────────────────────── */

.aicom-help-page {
    max-width: 980px;
    margin: 0 auto;
    padding: 16px 4px 60px;
    font-family: 'Plus Jakarta Sans', sans-serif;
    color: var(--aicom-text-md);
    line-height: 1.65;
}

/* — kicker label between hairlines — */
.aicom-help-kicker {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--aicom-primary);
    margin: 0 0 18px;
}
.aicom-help-rule {
    display: inline-block;
    width: 36px;
    height: 1px;
    background: var(--aicom-primary);
    opacity: .55;
}

/* — fleuron ornaments between sections — */
.aicom-help-fleuron {
    text-align: center;
    color: var(--aicom-primary);
    font-family: 'Fraunces', serif;
    font-size: 1.5rem;
    opacity: .55;
    margin: 56px 0;
    user-select: none;
}

/* — Hero — */
.aicom-help-hero {
    text-align: center;
    padding: 24px 12px 8px;
}
.aicom-help-hero h1 {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 144;
    font-weight: 500;
    font-size: clamp(2.4rem, 5vw, 3.6rem);
    line-height: 1.04;
    color: var(--aicom-ink);
    letter-spacing: -0.012em;
    margin: 0 auto 28px;
    max-width: 22ch;
}
.aicom-help-hero h1 em {
    font-style: italic;
    font-weight: 400;
    color: var(--aicom-primary);
    display: block;
    margin-top: 4px;
}
.aicom-help-hero-lead {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 14;
    font-weight: 400;
    font-size: 1.15rem;
    line-height: 1.62;
    color: var(--aicom-text);
    max-width: 58ch;
    margin: 0 auto 18px;
}
.aicom-help-hero-lead::first-letter {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 144;
    font-weight: 700;
    font-size: 3.8em;
    float: left;
    line-height: 0.85;
    padding: 8px 12px 0 0;
    color: var(--aicom-primary);
}
.aicom-help-signed {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 0.92rem;
    color: var(--aicom-text-sm);
    margin: 24px 0 0;
}

/* — Recipe: 3 steps — */
.aicom-help-recipe {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 48px 40px;
    padding: 16px 0;
    max-width: 940px;
    margin: 0 auto;
}
.aicom-help-recipe-step { text-align: left; }
.aicom-help-recipe-num {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 144;
    font-style: italic;
    font-weight: 500;
    font-size: 3.4rem;
    line-height: 1;
    color: var(--aicom-primary);
    margin: 0 0 14px;
    letter-spacing: -0.02em;
}
.aicom-help-recipe-step h3 {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 60;
    font-weight: 500;
    font-size: 1.35rem;
    line-height: 1.2;
    color: var(--aicom-ink);
    margin: 0 0 10px;
    letter-spacing: -0.005em;
}
.aicom-help-recipe-step p {
    margin: 0;
    font-size: 0.97rem;
    line-height: 1.6;
    color: var(--aicom-text-md);
}
.aicom-help-recipe-step a { color: var(--aicom-primary-dk); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.aicom-help-recipe-step em { color: var(--aicom-primary); font-style: italic; }

/* — Section heads — */
.aicom-help-section-head {
    max-width: 56ch;
    margin: 0 auto 36px;
    text-align: center;
}
.aicom-help-section-head h2 {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 96;
    font-weight: 500;
    font-size: clamp(1.8rem, 3.6vw, 2.4rem);
    line-height: 1.15;
    color: var(--aicom-ink);
    margin: 0 0 14px;
    letter-spacing: -0.012em;
}
.aicom-help-section-head h2 em {
    font-style: italic;
    color: var(--aicom-primary);
}
.aicom-help-section-head p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--aicom-text-md);
}

/* ── Interactive builder ─────────────────────────────────────────────── */
.aicom-help-builder { padding: 0; }

.aicom-help-recipes {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 36px;
}
.aicom-help-recipe-card {
    text-align: left;
    background: var(--aicom-surface);
    border: 1.5px solid var(--aicom-border);
    border-radius: 8px;
    padding: 18px 18px 20px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-family: inherit;
    color: inherit;
    position: relative;
}
.aicom-help-recipe-card:hover {
    transform: translateY(-2px);
    border-color: var(--aicom-primary-lt);
    box-shadow: 0 8px 24px rgba(22, 24, 29, .06);
}
.aicom-help-recipe-card.is-active {
    background: #fff;
    border-color: var(--aicom-primary);
    box-shadow: 0 0 0 4px rgba(232, 93, 44, .10), 0 12px 28px rgba(22, 24, 29, .08);
    transform: translateY(-2px);
}
.aicom-help-recipe-card-cat {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--aicom-primary);
}
.aicom-help-recipe-card-title {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 36;
    font-weight: 500;
    font-size: 1.1rem;
    color: var(--aicom-ink);
    line-height: 1.2;
}
.aicom-help-recipe-card-story {
    font-size: 0.84rem;
    line-height: 1.5;
    color: var(--aicom-text-md);
    font-family: inherit;
    flex: 1;
}
.aicom-help-recipe-card-cue {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 0.78rem;
    color: var(--aicom-text-sm);
    margin-top: 4px;
    opacity: 0;
    transition: opacity .15s;
}
.aicom-help-recipe-card:hover .aicom-help-recipe-card-cue,
.aicom-help-recipe-card.is-active .aicom-help-recipe-card-cue {
    opacity: 1;
    color: var(--aicom-primary);
}

/* — Output panel — */
.aicom-help-output {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 36px;
    padding: 36px;
    background: var(--aicom-surface);
    border: 1px solid var(--aicom-border);
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}
.aicom-help-output::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: var(--aicom-primary);
    opacity: .9;
}

.aicom-help-output-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--aicom-text-sm);
    margin: 0 0 14px;
}

/* — Perms column — */
.aicom-help-output-perms ul {
    list-style: none;
    padding: 0;
    margin: 0 0 18px;
}
.aicom-help-output-perms li {
    position: relative;
    padding: 8px 0 8px 26px;
    font-size: 0.93rem;
    color: var(--aicom-ink);
    line-height: 1.4;
    border-bottom: 1px dashed var(--aicom-border-light);
}
.aicom-help-output-perms li:last-child { border-bottom: none; }
.aicom-help-output-perms li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 14px;
    width: 14px;
    height: 8px;
    border-left: 2px solid var(--aicom-primary);
    border-bottom: 2px solid var(--aicom-primary);
    transform: rotate(-45deg);
}
.aicom-help-output-link {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 0.96rem;
    color: var(--aicom-primary-dk);
    text-decoration: none;
    border-bottom: 1px solid var(--aicom-primary);
    padding-bottom: 2px;
}
.aicom-help-output-link:hover { color: var(--aicom-primary); }

/* — Prompt column — */
.aicom-help-output-prompt {
    position: relative;
    display: flex;
    flex-direction: column;
}
.aicom-help-output-prompt blockquote {
    margin: 0 0 18px;
    padding: 22px 26px;
    background: var(--aicom-bg);
    border-radius: 6px;
    border-left: 3px solid var(--aicom-primary);
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 1.08rem;
    line-height: 1.55;
    color: var(--aicom-ink);
    flex: 1;
    position: relative;
}
.aicom-help-copy-btn {
    align-self: flex-start;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #fff;
    background: var(--aicom-ink);
    border: none;
    border-radius: 6px;
    padding: 10px 18px;
    cursor: pointer;
    transition: background .15s, transform .15s;
}
.aicom-help-copy-btn:hover { background: #2a2d33; transform: translateY(-1px); }
.aicom-help-copy-btn.is-copied { background: #15803d; }

/* ── Wiring section ──────────────────────────────────────────────────── */
.aicom-help-notes {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    margin-bottom: 16px;
}
.aicom-help-note-card {
    background: var(--aicom-surface);
    border: 1px solid var(--aicom-border);
    border-radius: 8px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.aicom-help-note-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--aicom-text-sm);
}
.aicom-help-note-card code {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.88rem;
    color: var(--aicom-ink);
    background: transparent;
    padding: 0;
    word-break: break-all;
}
.aicom-help-aside {
    font-size: 0.88rem;
    color: var(--aicom-text-sm);
    margin: 0 0 28px;
    font-style: italic;
    text-align: center;
}
.aicom-help-aside code {
    background: var(--aicom-bg);
    padding: 2px 6px;
    border-radius: 3px;
    font-style: normal;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.92em;
}

.aicom-help-disclosures {
    max-width: 760px;
    margin: 0 auto;
}
.aicom-help-disclosure {
    border-bottom: 1px solid var(--aicom-border-light);
    padding: 18px 0;
}
.aicom-help-disclosure:first-child { border-top: 1px solid var(--aicom-border-light); }
.aicom-help-disclosure > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: 'Fraunces', serif;
    font-weight: 500;
    font-size: 1.1rem;
    color: var(--aicom-ink);
    transition: color .15s;
}
.aicom-help-disclosure > summary:hover { color: var(--aicom-primary-dk); }
.aicom-help-disclosure > summary::-webkit-details-marker { display: none; }
.aicom-help-summary-mark {
    color: var(--aicom-primary);
    font-family: 'Fraunces', serif;
    font-size: 1.4rem;
    line-height: 1;
    transition: transform .2s;
}
.aicom-help-disclosure[open] .aicom-help-summary-mark { transform: rotate(45deg); }
.aicom-help-disclosure p,
.aicom-help-disclosure pre {
    margin-top: 14px;
}
.aicom-help-disclosure p {
    font-size: 0.95rem;
    color: var(--aicom-text-md);
    line-height: 1.65;
}
.aicom-help-disclosure p code {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.88em;
    background: var(--aicom-bg);
    padding: 1px 6px;
    border-radius: 3px;
    color: var(--aicom-ink);
}
.aicom-help-disclosure pre {
    background: var(--aicom-ink);
    color: #f5f1e8;
    padding: 18px 22px;
    border-radius: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.84rem;
    line-height: 1.6;
    overflow-x: auto;
    white-space: pre;
    margin: 0;
}

/* Snippet wrapper — pre + floating copy button */
.aicom-help-snippet {
    position: relative;
    margin-top: 14px;
}
.aicom-help-snippet pre {
    padding-right: 80px;  /* room for copy button */
}
.aicom-help-snippet-copy {
    position: absolute;
    top: 12px;
    right: 12px;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #f5f1e8;
    background: rgba(245, 241, 232, .08);
    border: 1px solid rgba(245, 241, 232, .2);
    border-radius: 4px;
    padding: 6px 12px;
    cursor: pointer;
    transition: background .15s, border-color .15s, color .15s, transform .15s;
}
.aicom-help-snippet-copy:hover {
    background: rgba(232, 93, 44, .85);
    border-color: var(--aicom-primary);
    color: #fff;
    transform: translateY(-1px);
}
.aicom-help-snippet-copy.is-copied {
    background: #15803d;
    border-color: #15803d;
    color: #fff;
}

/* ── Helper picker (wiring section, mirrors recipe cards) ───────────── */
.aicom-help-helpers {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 0 0 32px;
}
.aicom-help-helper-card {
    text-align: left;
    background: var(--aicom-surface);
    border: 1.5px solid var(--aicom-border);
    border-radius: 8px;
    padding: 16px 18px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-family: inherit;
    color: inherit;
}
.aicom-help-helper-card:hover {
    transform: translateY(-2px);
    border-color: var(--aicom-primary-lt);
    box-shadow: 0 8px 20px rgba(22, 24, 29, .06);
}
.aicom-help-helper-card.is-active {
    background: #fff;
    border-color: var(--aicom-primary);
    box-shadow: 0 0 0 4px rgba(232, 93, 44, .10), 0 12px 24px rgba(22, 24, 29, .08);
    transform: translateY(-2px);
}
.aicom-help-helper-name {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 24;
    font-weight: 500;
    font-size: 1.05rem;
    color: var(--aicom-ink);
    line-height: 1.2;
}
.aicom-help-helper-where {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--aicom-text-sm);
}
.aicom-help-helper-card.is-active .aicom-help-helper-where {
    color: var(--aicom-primary);
}

/* Wiring output — same shell as builder output but tighter on text side */
.aicom-help-output--wiring {
    grid-template-columns: 1fr 1.4fr;
}
.aicom-help-output-intro .aicom-help-helper-intro {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 14;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--aicom-text);
    margin: 0 0 12px;
}
.aicom-help-output-intro .aicom-help-helper-after {
    font-size: 0.88rem;
    line-height: 1.55;
    color: var(--aicom-text-sm);
    font-style: italic;
    margin: 0;
}
.aicom-help-output--wiring .aicom-help-snippet pre {
    background: var(--aicom-ink);
    color: #f5f1e8;
    padding: 18px 22px;
    padding-right: 80px;
    border-radius: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    line-height: 1.6;
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-word;
    margin: 0;
}

@media (max-width: 1024px) {
    .aicom-help-helpers { grid-template-columns: repeat(2, 1fr); }
    .aicom-help-output--wiring { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 640px) {
    .aicom-help-helpers { grid-template-columns: 1fr; }
}

/* ── Quiet questions ─────────────────────────────────────────────────── */
.aicom-help-thread {
    max-width: 680px;
    margin: 0 auto;
}
.aicom-help-q {
    padding: 22px 0;
    border-bottom: 1px solid var(--aicom-border-light);
}
.aicom-help-q:last-child { border-bottom: none; }
.aicom-help-q > summary {
    cursor: pointer;
    list-style: none;
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-variation-settings: "opsz" 24;
    font-size: 1.1rem;
    font-weight: 400;
    color: var(--aicom-ink);
    line-height: 1.35;
    position: relative;
    padding-left: 36px;
    transition: color .15s;
}
.aicom-help-q > summary:hover { color: var(--aicom-primary-dk); }
.aicom-help-q > summary::-webkit-details-marker { display: none; }
.aicom-help-q > summary::before {
    content: '?';
    position: absolute;
    left: 0;
    top: -2px;
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 60;
    font-weight: 700;
    font-style: normal;
    font-size: 1.6rem;
    color: var(--aicom-primary);
    line-height: 1;
}
.aicom-help-q[open] > summary::before { content: '!'; }
.aicom-help-q > p {
    margin: 14px 0 0 36px;
    font-size: 0.96rem;
    line-height: 1.7;
    color: var(--aicom-text-md);
}
.aicom-help-q > p code {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.88em;
    background: var(--aicom-bg);
    padding: 1px 6px;
    border-radius: 3px;
    color: var(--aicom-ink);
}

/* ── Closing ─────────────────────────────────────────────────────────── */
.aicom-help-closing {
    text-align: center;
    max-width: 56ch;
    margin: 0 auto;
    padding: 16px 12px 28px;
}
.aicom-help-closing h2 {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 96;
    font-style: italic;
    font-weight: 500;
    font-size: 1.7rem;
    color: var(--aicom-ink);
    margin: 0 0 16px;
}
.aicom-help-closing p {
    font-size: 1rem;
    line-height: 1.65;
    color: var(--aicom-text-md);
    margin: 0 0 22px;
}
.aicom-help-closing-signoff {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 1.25rem;
    color: var(--aicom-primary);
}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .aicom-help-recipes { grid-template-columns: repeat(2, 1fr); }
    .aicom-help-recipe { grid-template-columns: 1fr; gap: 32px; max-width: 480px; }
    .aicom-help-output { grid-template-columns: 1fr; gap: 24px; padding: 24px; }
    .aicom-help-notes { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .aicom-help-recipes { grid-template-columns: 1fr; }
}

/* ── Stagger reveal on page load ─────────────────────────────────────── */
.aicom-help-page > section,
.aicom-help-page > .aicom-help-fleuron {
    animation: aicomHelpFadeUp .6s ease-out backwards;
}
.aicom-help-page > section:nth-child(1) { animation-delay: 0s; }
.aicom-help-page > *:nth-child(2) { animation-delay: .08s; }
.aicom-help-page > *:nth-child(3) { animation-delay: .14s; }
.aicom-help-page > *:nth-child(4) { animation-delay: .2s; }
.aicom-help-page > *:nth-child(5) { animation-delay: .26s; }
.aicom-help-page > *:nth-child(6) { animation-delay: .32s; }
.aicom-help-page > *:nth-child(7) { animation-delay: .38s; }
.aicom-help-page > *:nth-child(8) { animation-delay: .44s; }
.aicom-help-page > *:nth-child(9) { animation-delay: .5s; }
@keyframes aicomHelpFadeUp {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    .aicom-help-page > *,
    .aicom-help-recipe-card { animation: none !important; transition: none !important; }
}

/* ── WP Dashboard Widget (on /wp-admin/index.php) ──────────────────────── */
#aicom_dashboard_widget .inside { padding: 0; margin: 0; }
.aicom-dash-widget {
    font-family: 'Plus Jakarta Sans', sans-serif;
    color: var(--aicom-text-md);
    line-height: 1.55;
}
.aicom-dash-widget-head {
    padding: 18px 16px 14px;
    text-align: center;
    background: linear-gradient(180deg, var(--aicom-bg) 0%, #ffffff 100%);
    border-bottom: 1px solid var(--aicom-border-light);
}
.aicom-dash-widget-logo-link {
    display: inline-block;
    text-decoration: none;
    box-shadow: none !important;
}
.aicom-dash-widget-logo {
    height: 36px;
    width: auto;
    display: block;
    margin: 0 auto;
}
.aicom-dash-widget-tagline {
    margin: 8px 0 0;
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 14;
    font-style: italic;
    font-size: 0.92em;
    color: var(--aicom-text-sm);
}

/* CTA row */
.aicom-dash-widget-cta {
    padding: 16px 16px 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid var(--aicom-border-light);
}
.aicom-dash-widget-cta-btn.button-hero {
    background: var(--aicom-ink);
    border-color: var(--aicom-ink);
    color: #fff;
    text-shadow: none;
    box-shadow: 0 1px 0 rgba(22, 24, 29, .12);
    font-size: 13px;
    padding: 0 18px;
    min-height: 36px;
    line-height: 34px;
    border-radius: 6px;
    transition: background .15s, transform .15s;
}
.aicom-dash-widget-cta-btn.button-hero:hover,
.aicom-dash-widget-cta-btn.button-hero:focus {
    background: #2a2d33;
    border-color: #2a2d33;
    color: #fff;
    transform: translateY(-1px);
}
.aicom-dash-widget-cta-aside {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 0.92em;
    color: var(--aicom-primary-dk);
    text-decoration: none;
}
.aicom-dash-widget-cta-aside:hover { color: var(--aicom-primary); }

/* Section */
.aicom-dash-widget-section { padding: 14px 16px 10px; }
.aicom-dash-widget-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 10px;
}
.aicom-dash-widget-section-head h3 {
    margin: 0;
    font-size: 0.78em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--aicom-text-sm);
    font-family: 'JetBrains Mono', monospace;
}
.aicom-dash-widget-link {
    font-size: 0.85em;
    color: var(--aicom-primary-dk);
    text-decoration: none;
}
.aicom-dash-widget-link:hover { color: var(--aicom-primary); }

/* Sessions list */
.aicom-dash-widget-sessions {
    list-style: none;
    margin: 0;
    padding: 0;
}
.aicom-dash-widget-session {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 9px 0;
    border-bottom: 1px dashed var(--aicom-border-light);
    font-size: 0.9em;
}
.aicom-dash-widget-session:last-child { border-bottom: none; }
.aicom-dash-widget-session-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--aicom-text-xs);
    flex-shrink: 0;
}
.aicom-dash-widget-session.is-active .aicom-dash-widget-session-dot {
    background: #22c55e;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, .18);
}
.aicom-dash-widget-session-name {
    color: var(--aicom-ink);
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.aicom-dash-widget-session-meta {
    font-size: 0.82em;
    color: var(--aicom-text-sm);
    text-align: right;
    white-space: nowrap;
}
.aicom-dash-widget-empty {
    margin: 0;
    padding: 8px 0 12px;
    font-style: italic;
    color: var(--aicom-text-sm);
    font-size: 0.92em;
}

/* Footer */
.aicom-dash-widget-footer {
    padding: 12px 16px 14px;
    background: var(--aicom-bg);
    border-top: 1px solid var(--aicom-border-light);
}
.aicom-dash-widget-help {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    font-size: 0.92em;
    color: var(--aicom-text-md);
    transition: color .15s;
}
.aicom-dash-widget-help:hover { color: var(--aicom-primary-dk); }
.aicom-dash-widget-help-icon {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--aicom-primary-lt);
    color: var(--aicom-primary-dk);
    font-family: 'Fraunces', serif;
    font-weight: 700;
    font-size: 0.95em;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* ── Generate Key — Advanced options disclosure ──────────────────────── */
.aicom-advanced {
    margin: 16px 0 0;
    padding: 0;
    border-top: 1px dashed var(--aicom-border);
}
.aicom-advanced > summary {
    list-style: none;
    cursor: pointer;
    padding: 14px 0 12px;
    display: flex;
    align-items: baseline;
    gap: 10px;
    color: var(--aicom-text-md);
    transition: color .15s;
}
.aicom-advanced > summary::-webkit-details-marker { display: none; }
.aicom-advanced > summary::before {
    content: '▸';
    color: var(--aicom-primary);
    font-size: 0.85em;
    line-height: 1;
    transform: translateY(-1px);
    transition: transform .15s;
}
.aicom-advanced[open] > summary::before { transform: rotate(90deg) translateX(-1px); }
.aicom-advanced > summary > span:first-of-type {
    font-weight: 700;
    font-size: 0.95em;
    color: var(--aicom-ink);
}
.aicom-advanced-hint {
    font-size: 0.83em;
    color: var(--aicom-text-sm);
    font-style: italic;
}
.aicom-advanced > summary:hover > span:first-of-type { color: var(--aicom-primary-dk); }

/* ── Key modal — client picker chips ─────────────────────────────────── */
.aicom-keymodal-clients {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 8px 0 14px;
}
.aicom-keymodal-client {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 0.85em;
    font-weight: 600;
    color: var(--aicom-text-md);
    background: var(--aicom-bg);
    border: 1px solid var(--aicom-border);
    border-radius: 6px;
    padding: 7px 12px;
    cursor: pointer;
    transition: background .12s, color .12s, border-color .12s;
}
.aicom-keymodal-client:hover {
    background: #fff;
    border-color: var(--aicom-primary-lt);
    color: var(--aicom-ink);
}
.aicom-keymodal-client.is-active {
    background: var(--aicom-ink);
    border-color: var(--aicom-ink);
    color: #fff;
}
.aicom-keymodal-client-intro {
    margin: 0 0 10px;
    font-size: 0.93em;
    line-height: 1.55;
    color: var(--aicom-text-md);
}

/* ── Glossary tooltip — inline jargon explainer ──────────────────────── */
.aicom-term {
    position: relative;
    border-bottom: 1px dotted var(--aicom-text-sm);
    cursor: help;
    transition: border-color .15s, color .15s;
}
.aicom-term:hover,
.aicom-term:focus {
    outline: none;
    border-bottom-color: var(--aicom-primary);
    color: var(--aicom-primary-dk);
}

/* ── Primary CTAs — unify to brand ink across AICOM pages ────────────── */
/* Scoped to .aicom-wrap so other plugins keep their native WP-blue buttons. */
.aicom-wrap .button-primary,
.aicom-wrap .wp-core-ui .button-primary,
.aicom-onboarding .button-primary,
.aicom-onboarding .wp-core-ui .button-primary {
    background: var(--aicom-ink);
    border-color: var(--aicom-ink);
    color: #fff;
    text-shadow: none;
    box-shadow: 0 1px 0 rgba(22, 24, 29, .15);
    transition: background .15s, transform .12s;
}
.aicom-wrap .button-primary:hover,
.aicom-wrap .button-primary:focus,
.aicom-onboarding .button-primary:hover,
.aicom-onboarding .button-primary:focus {
    background: #2a2d33;
    border-color: #2a2d33;
    color: #fff;
}
.aicom-wrap .button-primary:active,
.aicom-onboarding .button-primary:active {
    background: var(--aicom-ink);
    transform: translateY(1px);
}
.aicom-wrap .button-primary:disabled,
.aicom-wrap .button-primary[disabled],
.aicom-onboarding .button-primary:disabled {
    background: var(--aicom-text-xs) !important;
    border-color: var(--aicom-text-xs) !important;
    color: rgba(255,255,255,.7) !important;
}
.aicom-term::before {
    content: attr(data-define);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    width: max-content;
    max-width: 260px;
    background: var(--aicom-ink);
    color: #f5f1e8;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 0.82em;
    font-weight: 400;
    line-height: 1.5;
    padding: 8px 12px;
    border-radius: 5px;
    box-shadow: 0 4px 12px rgba(22, 24, 29, .15);
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s, transform .15s;
    white-space: normal;
    text-align: left;
    z-index: 100;
}
.aicom-term:hover::before,
.aicom-term:focus::before {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* ── Onboarding wizard ───────────────────────────────────────────────── */

/* Fullscreen welcome — hide WP admin chrome while wizard is showing. */
body.aicom-fullscreen #wpadminbar,
body.aicom-fullscreen #adminmenuback,
body.aicom-fullscreen #adminmenuwrap,
body.aicom-fullscreen #wpfooter {
    display: none !important;
}
body.aicom-fullscreen #wpcontent {
    margin-left: 0 !important;
    padding-left: 0 !important;
}
body.aicom-fullscreen #wpbody-content {
    padding-bottom: 60px;
    padding-top: 0;
}
/* Drop the 32px top padding WP reserves for the admin bar, only while the
   wizard is on screen. :has() lets us target html based on body's class. */
html:has(body.aicom-fullscreen) { padding-top: 0 !important; }
body.aicom-fullscreen {
    background: var(--aicom-bg);
    min-height: 100vh;
}

.aicom-onboarding {
    max-width: 720px;
    margin: 60px auto 60px;
    padding: 40px 36px 36px;
    background: var(--aicom-surface);
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(22, 24, 29, .08);
    font-family: 'Plus Jakarta Sans', sans-serif;
    color: var(--aicom-text-md);
}
.aicom-onboarding-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28px;
}
.aicom-onboarding-logo { height: 36px; width: auto; }
.aicom-onboarding-progress {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}
.aicom-onboarding-pill {
    width: 22px;
    height: 22px;
    line-height: 22px;
    border-radius: 50%;
    text-align: center;
    background: var(--aicom-bg);
    color: var(--aicom-text-sm);
    font-size: 0.78em;
    font-weight: 700;
    border: 1px solid var(--aicom-border);
}
.aicom-onboarding-pill.is-active {
    background: var(--aicom-primary);
    color: #fff;
    border-color: var(--aicom-primary);
}
.aicom-onboarding-pill.is-done {
    background: #15803d;
    color: #fff;
    border-color: #15803d;
}
.aicom-onboarding-pill-line {
    width: 30px;
    height: 1px;
    background: var(--aicom-border);
}
.aicom-onboarding h1 {
    font-family: 'Fraunces', serif;
    font-variation-settings: "opsz" 96;
    font-weight: 500;
    font-size: 2rem;
    color: var(--aicom-ink);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin: 0 0 8px;
}
.aicom-onboarding h1 em {
    font-style: italic;
    color: var(--aicom-primary);
    font-weight: 400;
}
.aicom-onboarding h2 {
    margin: 28px 0 6px;
    font-size: 0.85em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--aicom-text-sm);
    font-family: 'JetBrains Mono', monospace;
}
.aicom-onboarding-lede {
    margin: 0 0 8px;
    font-size: 1.02em;
    line-height: 1.55;
    color: var(--aicom-text-md);
}
.aicom-onboarding-sub {
    margin: 0 0 16px;
    font-size: 0.92em;
    color: var(--aicom-text-sm);
}
.aicom-onboarding-clients {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 24px;
}
.aicom-onboarding-client {
    background: var(--aicom-surface);
    border: 1.5px solid var(--aicom-border);
    border-radius: 8px;
    padding: 14px 14px;
    cursor: pointer;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-family: inherit;
    color: inherit;
    transition: border-color .12s, box-shadow .12s, transform .12s, background .12s;
}
.aicom-onboarding-client:hover {
    border-color: var(--aicom-primary-lt);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(22, 24, 29, .06);
}
.aicom-onboarding-client.is-active {
    background: #fff;
    border-color: var(--aicom-primary);
    box-shadow: 0 0 0 4px rgba(232, 93, 44, .10), 0 8px 18px rgba(22, 24, 29, .07);
}
.aicom-onboarding-client-name {
    font-family: 'Fraunces', serif;
    font-weight: 500;
    font-size: 1em;
    color: var(--aicom-ink);
}
.aicom-onboarding-client-tag {
    font-size: 0.82em;
    color: var(--aicom-text-sm);
}
/* Onboarding step 2 reuses the same .aicom-preset-card markup as the
   Dashboard Quick Generation. Layout overrides put the cards in a single
   column with a few small tweaks. */
.aicom-onboarding-preset-grid {
    grid-template-columns: 1fr;
    gap: 10px;
    margin: 18px 0 16px;
}
.aicom-onboarding-preset-label {
    cursor: pointer;
    transition: border-color .12s, box-shadow .12s, background .12s, transform .12s;
}
.aicom-onboarding-preset-label > input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.aicom-onboarding-preset-label:hover {
    border-color: var(--aicom-primary-lt);
    transform: translateY(-1px);
}
.aicom-onboarding-preset-label:has(input[type="radio"]:checked) {
    border-color: var(--aicom-primary);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(232, 93, 44, .10);
    transform: translateY(-1px);
}
.aicom-onboarding-tip {
    margin: 18px 0 0;
    padding: 12px 14px;
    background: var(--aicom-bg);
    border-left: 3px solid var(--aicom-primary);
    border-radius: 4px;
    font-size: 0.9em;
    color: var(--aicom-text-md);
    font-style: italic;
}
.aicom-onboarding-error {
    margin: 0 0 14px;
    padding: 10px 14px;
    background: #fef2f2;
    border-left: 3px solid #dc2626;
    border-radius: 4px;
    color: #991b1b;
    font-size: 0.92em;
}
.aicom-onboarding-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 24px;
    gap: 12px;
}
.aicom-onboarding-actions .button-hero {
    background: var(--aicom-ink);
    border-color: var(--aicom-ink);
    color: #fff;
    text-shadow: none;
    box-shadow: 0 1px 0 rgba(22, 24, 29, .12);
    font-size: 14px;
    padding: 0 20px;
    min-height: 38px;
    line-height: 36px;
    border-radius: 6px;
}
.aicom-onboarding-actions .button-hero:hover,
.aicom-onboarding-actions .button-hero:focus {
    background: #2a2d33;
    border-color: #2a2d33;
    color: #fff;
}
.aicom-onboarding-skip,
.aicom-onboarding-back {
    background: none;
    border: none;
    color: var(--aicom-text-sm);
    font-size: 0.9em;
    cursor: pointer;
    text-decoration: underline;
    font-family: inherit;
    padding: 6px 0;
}
.aicom-onboarding-skip:hover,
.aicom-onboarding-back:hover { color: var(--aicom-primary-dk); }
.aicom-onboarding-form { margin: 0; }