/*
Theme Name:  Candide AI Hub
Theme URI:   https://github.com/candide-ai/candide-ai-hub
Author:      Candide Engineering
Author URI:  https://candide.example
Description: Block theme for the Candide AI Hub. Layout and styling are defined in theme.json + the templates/ + patterns/ directories.
Version:     0.1.0
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 8.2
License:     Proprietary
Text Domain: cah-theme
Tags:        block-theme, full-site-editing
*/

/* ---------- Header: top nav (T-V06) ---------- */

.cah-brand:hover,
.cah-nav-brand:hover { opacity: 0.85; }

/* Nav container — matches B1 mockup `.topnav` (lines 18-29). */
.cah-topnav {
    background: var(--wp--preset--color--surface);
    border-bottom: 1px solid var(--wp--preset--color--border);
    min-height: 60px;
    display: flex;
    align-items: center;
    padding: 0 32px;
    position: sticky;
    top: 0;
    z-index: 100;
    gap: 0;
}

.cah-nav-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    flex-shrink: 0;
    margin-right: 40px;
}

.cah-nav-brand-logo {
    height: 40px;
    width: auto;
    display: block;
}

.cah-nav-links {
    display: flex;
    align-items: center;
    gap: 2px;
    flex: 1;
}

.cah-nav-link {
    font-size: 13.5px;
    font-weight: 500;
    color: var(--wp--preset--color--text-muted);
    text-decoration: none;
    padding: 6px 14px;
    border-radius: 6px;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

.cah-nav-link:hover {
    background: var(--wp--preset--color--background);
    color: var(--wp--preset--color--primary);
}

.cah-nav-link.is-active,
.cah-nav-link[aria-current="page"] {
    color: var(--wp--preset--color--primary);
    background: var(--wp--preset--color--primary-tint);
    font-weight: 600;
}

.cah-nav-link.is-disabled {
    color: #c0b9ae;
    cursor: not-allowed;
    pointer-events: none;
}

.cah-nav-soon {
    display: inline-block;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: #f0ece6;
    color: var(--wp--preset--color--text-faint);
    border-radius: 4px;
    padding: 1px 5px;
    margin-left: 5px;
    vertical-align: middle;
    position: relative;
    top: -1px;
}

.cah-nav-right {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
}

/* ---------- Dark banner variant (T-V11) ---------- */

.cah-topnav.is-dark {
    background: var(--wp--preset--color--ink-deep);
    border-bottom-color: var(--wp--preset--color--ink-deeper);
    color: #f1ece0;
}

.cah-topnav.is-dark .cah-nav-brand-logo {
    /* invert the dark-on-cream wordmark to render solid white */
    filter: brightness(0) invert(1);
}

.cah-topnav.is-dark .cah-nav-link               { color: rgba(255, 255, 255, 0.72); }
.cah-topnav.is-dark .cah-nav-link:hover         { background: rgba(255, 255, 255, 0.06); color: #fff; }
.cah-topnav.is-dark .cah-nav-link.is-active,
.cah-topnav.is-dark .cah-nav-link[aria-current="page"] { background: rgba(255, 255, 255, 0.10); color: #fff; }
.cah-topnav.is-dark .cah-nav-link.is-disabled   { color: rgba(255, 255, 255, 0.34); }
.cah-topnav.is-dark .cah-nav-soon               { background: rgba(255, 255, 255, 0.10); color: rgba(255, 255, 255, 0.72); }
.cah-topnav.is-dark .cah-estate-badge           { background: rgba(255, 255, 255, 0.10); border-color: rgba(255, 255, 255, 0.18); color: #f1ece0; }
.cah-topnav.is-dark .cah-user-btn               { color: #f1ece0; }
.cah-topnav.is-dark .cah-user-btn:hover         { background: rgba(255, 255, 255, 0.06); }
.cah-topnav.is-dark .cah-user-name              { color: #f1ece0; }
.cah-topnav.is-dark .cah-chevron                { color: rgba(255, 255, 255, 0.6); }

/* Focus ring for keyboard users — browser default contrast is poor on dark surfaces */
.cah-topnav.is-dark .cah-nav-link:focus-visible,
.cah-topnav.is-dark .cah-user-btn:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.85);
    outline-offset: 2px;
}

/* ---------- Taxonomy chips ---------- */

.cah-category-chip {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--wp--preset--color--primary);
}
.cah-category-chip a { color: inherit; text-decoration: none; }
.cah-category-chip a:hover { text-decoration: underline; }

.cah-tag-list {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 0.75rem;
    line-height: 1.4;
}
.cah-tag-list a {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--wp--preset--color--primary-tint);
    color: var(--wp--preset--color--primary);
    text-decoration: none;
    font-weight: 500;
}
.cah-tag-list a:hover { background: var(--wp--preset--color--primary-tint-2); }

/* ---------- Status badges ---------- */

.cah-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    line-height: 1.4;
}
.cah-status-badge.is-pending,
.cah-status-badge[data-status="pending"] {
    background: var(--wp--preset--color--status-pending-bg);
    color: var(--wp--preset--color--status-pending);
}
.cah-status-badge.is-published,
.cah-status-badge[data-status="published"] {
    background: var(--wp--preset--color--status-published-bg);
    color: var(--wp--preset--color--status-published);
}
.cah-status-badge.is-archived,
.cah-status-badge[data-status="archived"],
.cah-status-badge.is-archive {
    background: var(--wp--preset--color--status-archive-bg);
    color: var(--wp--preset--color--status-archive);
}
.cah-status-badge.is-planned {
    background: var(--wp--preset--color--status-pending-bg);
    color: var(--wp--preset--color--status-pending);
}

/* ---------- Tool / Champion cards (T-V02 mirrors C1 mockup lines 70-99) ---------- */

.cah-tool-card,
.cah-champion-card {
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 12px;
    padding: 20px;
    cursor: pointer;
    transition: box-shadow 0.2s, border-color 0.2s, transform 0.15s;
    display: flex;
    flex-direction: column;
    min-height: 230px;
    position: relative;
}

/* Stretched-link: title anchor expands to cover the card so clicks anywhere
   on the card open the tool. Keyboard users still tab to one real anchor.
   Elements that need their own hover/tooltip sit above the overlay via z-index. */
.cah-tool-card .cah-card-name a::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
}
.cah-tool-card .cah-estate-dots { position: relative; z-index: 1; }

.cah-tool-card:hover,
.cah-champion-card:hover {
    /* Mockup hover (C1:71): sage `#c8dbd4` border + soft shadow + 1px lift.
       No exact theme.json token for the hover border (sage is between
       primary-tint and primary), so inline. */
    border-color: #c8dbd4;
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.cah-tool-card h3 a,
.cah-champion-card h3 {
    color: var(--wp--preset--color--text-strong);
    text-decoration: none;
}
.cah-tool-card h3 a:hover { color: var(--wp--preset--color--primary); }

.cah-tool-card .cah-card-name {
    font-family: var(--wp--preset--font-family--serif);
    font-size: 15px;
    font-weight: 400;
    color: var(--wp--preset--color--text-strong);
    line-height: 1.3;
    margin: 2px 0 0 0;
}
.cah-tool-card .cah-card-name a { color: inherit; text-decoration: none; }
.cah-tool-card .cah-card-name a:hover { color: var(--wp--preset--color--primary); }

.cah-tool-card .cah-card-provider {
    font-size: 11.5px;
    color: var(--wp--preset--color--text-faint);
    margin-top: 2px;
}

.cah-tool-card .cah-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 10px;
    gap: 8px;
}

.cah-tool-card .cah-card-desc {
    font-size: 12.5px;
    color: #6b6259; /* mockup C1:82 — sits between text and text-muted, no exact token */
    line-height: 1.55;
    margin-bottom: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cah-tool-card .cah-category-badge {
    display: inline-block;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    padding: 3px 9px;
    border-radius: 4px;
    background: var(--wp--preset--color--primary-tint);
    color: var(--wp--preset--color--primary);
    white-space: nowrap;
    flex-shrink: 0;
    text-transform: none;
}

.cah-tool-card.is-planned {
    border-style: dashed;
    border-color: var(--wp--preset--color--border-strong);
}

/* ---------- Card row groups ---------- */

.cah-card-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 8px;
    border-top: 1px solid var(--wp--preset--color--border);
}

/* ---------- Estate dots ---------- */

.cah-estate-dots {
    display: inline-flex;
    gap: 4px;
    align-items: center;
}
.cah-estate-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: var(--wp--preset--color--text-faint);
    border: 1px solid rgba(0, 0, 0, 0.05);
}
.cah-estate-count {
    font-size: 0.6875rem;
    color: var(--wp--preset--color--text-subtle);
    margin-left: 4px;
}

.cah-estate-dot.estate-candide { background: var(--wp--preset--color--estate-candide); }
.cah-estate-dot.estate-babylonstoren { background: var(--wp--preset--color--estate-babylonstoren); }
.cah-estate-dot.estate-the-newt-in-somerset { background: var(--wp--preset--color--estate-newt); }
.cah-estate-dot.estate-vignamaggio { background: var(--wp--preset--color--estate-vignamaggio); }
.cah-estate-dot.estate-over-amstel-boerderij { background: var(--wp--preset--color--estate-overamstel); }
.cah-estate-dot.estate-the-story-of-emily { background: var(--wp--preset--color--estate-emily); }
.cah-estate-dot.estate-plataeon { background: var(--wp--preset--color--estate-plataeon); }

/* ---------- Star rating ---------- */

.cah-stars {
    display: inline-flex;
    gap: 2px;
    font-size: 0.875rem;
    line-height: 1;
    color: var(--wp--preset--color--rating-gold);
    letter-spacing: 1px;
}
.cah-stars .cah-star-empty { color: var(--wp--preset--color--border-strong); }
.cah-stars-label {
    margin-left: 6px;
    color: var(--wp--preset--color--text-muted);
    font-size: 0.75rem;
}

/* ---------- Champion card (T-V03 mirrors D1 mockup lines 69-127) ---------- */

.cah-champion-card {
    /* shared base from .cah-tool-card,.cah-champion-card above; override
       padding (mockup D1:73 = 22px 20px, not 20px 20px) and gap (D1:76 = 14px) */
    padding: 22px 20px;
    gap: 14px;
    min-height: 0; /* champion cards size to content; tool grid alignment doesn't apply */
}

.cah-champion-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    /* Mockup D1:81-92 — 44px circle, sans 15px/600. Acceptance had 56px
       serif 18px; mockup wins per PROMPT.md. */
    width: 44px;
    height: 44px;
    border-radius: 50%;
    color: #fff;
    font-family: var(--wp--preset--font-family--sans);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-bottom: 0;
    background: var(--wp--preset--color--primary);
    flex-shrink: 0;
}
.cah-champion-avatar.estate-candide { background: var(--wp--preset--color--estate-candide); }
.cah-champion-avatar.estate-babylonstoren { background: var(--wp--preset--color--estate-babylonstoren); }
.cah-champion-avatar.estate-the-newt-in-somerset { background: var(--wp--preset--color--estate-newt); }
.cah-champion-avatar.estate-vignamaggio { background: var(--wp--preset--color--estate-vignamaggio); }
.cah-champion-avatar.estate-over-amstel-boerderij { background: var(--wp--preset--color--estate-overamstel); }
.cah-champion-avatar.estate-the-story-of-emily { background: var(--wp--preset--color--estate-emily); }
.cah-champion-avatar.estate-plataeon { background: var(--wp--preset--color--estate-plataeon); }

.cah-champion-card h3.cah-champ-name {
    /* Mockup D1:94-100: serif 16px/400/1.3, text-strong */
    font-family: var(--wp--preset--font-family--serif);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: var(--wp--preset--color--text-strong);
    margin: 0;
}
.cah-champion-meta {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.cah-champion-card .cah-champ-team {
    /* Mockup D1:116-119: 12.5px #6b6259 (no uppercase, despite acceptance) */
    font-size: 12.5px;
    color: #6b6259;
    text-transform: none;
    letter-spacing: 0;
}
.cah-champion-card .cah-champ-estate-badge {
    /* Mockup D1:104-114: 11px/600, padding 3px 9px, radius 4px,
       width fit-content. Background is per-estate (matches avatar). */
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: 3px 9px;
    border-radius: 4px;
    width: fit-content;
    background: var(--wp--preset--color--primary-tint);
    color: var(--wp--preset--color--primary);
}
.cah-champion-card a.cah-mailto {
    /* Mockup D1:121-126 */
    display: inline-block;
    font-size: 12.5px;
    color: var(--wp--preset--color--primary);
    text-decoration: none;
    word-break: break-all;
}
.cah-champion-card a.cah-mailto:hover { text-decoration: underline; }

/* ---------- Admin warning panel (T-V04: mirrors C1 mockup .admin-note line 114) ---------- */

.cah-admin-warning {
    background: var(--wp--preset--color--amber-warn-bg);
    border: 1px solid var(--wp--preset--color--amber-warn-border);
    border-left: 4px solid var(--wp--preset--color--amber-warn-border);
    border-radius: 8px;
    padding: 16px;
    color: var(--wp--preset--color--amber-warn);
    font-size: 0.8125rem; /* 13px — matches mockup line 114 */
    line-height: 1.5;
}
.cah-admin-warning strong { color: var(--wp--preset--color--amber-warn); font-weight: 600; }

/* ---------- Aggregate stats bar (T-V04: per ticket acceptance — border-top + border-bottom, 24px serif values) ---------- */

.cah-stats-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    padding: 16px 0;
    border-top: 1px solid var(--wp--preset--color--border);
    border-bottom: 1px solid var(--wp--preset--color--border);
    margin: 16px 0 24px;
}
.cah-stat-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cah-stat-value {
    font-family: var(--wp--preset--font-family--serif);
    font-size: 1.5rem; /* 24px */
    font-weight: 400;
    color: var(--wp--preset--color--text-strong);
    line-height: 1;
}
.cah-stat-label {
    font-size: 0.6875rem; /* 11px */
    font-weight: 600;
    color: var(--wp--preset--color--text-subtle);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ---------- Per-estate submission card (T-V04: mirrors C1 mockup .submission-card lines 128-145) ---------- */

.cah-submission-card {
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 10px;
    padding: 18px 20px;
    margin-bottom: 14px;
}
.cah-submission-card:last-child { margin-bottom: 0; }
.cah-submission-card .cah-sub-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.cah-submission-card .cah-sub-estate {
    font-weight: 600;
    font-size: 0.875rem; /* 14px */
    color: var(--wp--preset--color--text-strong);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.cah-submission-card .cah-sub-team {
    font-size: 0.75rem; /* 12px */
    font-weight: 400;
    color: var(--wp--preset--color--text-subtle);
}
.cah-submission-card .cah-sub-licence {
    font-size: 0.75rem; /* 12px */
    color: var(--wp--preset--color--text-muted);
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--wp--preset--color--border);
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
.cah-submission-card .cah-sub-licence strong {
    color: var(--wp--preset--color--text-strong);
    font-weight: 600;
}
.cah-submission-card .cah-sub-usecases {
    font-size: 0.8125rem; /* 13px — mockup .sub-field p line 140 */
    color: var(--wp--preset--color--text);
    line-height: 1.5;
}
.cah-submission-card .cah-sub-usecases-label {
    margin: 0 0 4px 0;
    font-size: 0.6875rem; /* 11px */
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--wp--preset--color--text-subtle);
}
.cah-submission-card .cah-sub-usecases-body {
    margin: 0;
}
.cah-submission-card .cah-sub-details {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--wp--preset--color--border);
    font-size: 0.8125rem;
    color: var(--wp--preset--color--text);
}
.cah-submission-card .cah-sub-details > summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 0.75rem;
    color: var(--wp--preset--color--text-subtle);
    list-style: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.cah-submission-card .cah-sub-details > summary::-webkit-details-marker { display: none; }
.cah-submission-card .cah-sub-details > summary::before {
    content: "▸";
    font-size: 0.7rem;
    transition: transform 0.15s ease;
}
.cah-submission-card .cah-sub-details[open] > summary::before { transform: rotate(90deg); }
.cah-submission-card .cah-sub-details-list {
    margin: 10px 0 0 0;
    display: grid;
    grid-template-columns: max-content 1fr;
    column-gap: 14px;
    row-gap: 6px;
    line-height: 1.5;
}
.cah-submission-card .cah-sub-details-list dt {
    font-weight: 600;
    color: var(--wp--preset--color--text-strong);
}
.cah-submission-card .cah-sub-details-list dd { margin: 0; }

/* ---------- Home: section labels (T-V05 mirrors B1 mockup lines 279-286) ---------- */

.cah-section-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--wp--preset--color--text-faint);
    margin-bottom: 14px;
}

/* ---------- Home: welcome header (T-V05 mirrors B1 mockup lines 258-277) ---------- */

.cah-welcome-header { margin-bottom: 36px; }
.cah-welcome-heading {
    font-family: var(--wp--preset--font-family--serif);
    font-size: 26px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 0.01em;
    color: var(--wp--preset--color--text-strong);
    margin: 0 0 6px 0;
}
.cah-welcome-sub {
    font-size: 14px;
    line-height: 1.5;
    color: var(--wp--preset--color--text-subtle); /* mockup B1:274 #8a8078 */
    margin: 0;
}
.cah-welcome-estate { margin-left: 6px; color: var(--wp--preset--color--text-subtle); }

/* ---------- Home: hub section cards (T-V05 mirrors B1 mockup lines 289-373) ---------- */

.cah-hub-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 44px;
}
.cah-hub-card {
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 12px;
    padding: 24px 22px;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    transition: box-shadow 0.2s, border-color 0.2s, transform 0.15s;
}
.cah-hub-card:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    border-color: #c8dbd4; /* sage — same hover token as .cah-tool-card */
    transform: translateY(-1px);
}
.cah-hub-card.is-disabled {
    opacity: 0.6;
    cursor: default;
    pointer-events: none;
}
.cah-hub-card-icon {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.cah-hub-card-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.cah-hub-card-body { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.cah-hub-card-title {
    font-family: var(--wp--preset--font-family--serif);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: 0.01em;
    color: var(--wp--preset--color--text-strong);
}
.cah-hub-card-desc {
    font-size: 12.5px;
    line-height: 1.55;
    color: var(--wp--preset--color--text-subtle); /* mockup B1:347 #8a8078 */
}
.cah-hub-card-action {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--wp--preset--color--primary);
}
.cah-hub-card-soon {
    display: inline-block;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    background: var(--wp--preset--color--status-pending-bg);
    color: var(--wp--preset--color--status-pending);
    border-radius: 4px;
    padding: 2px 7px;
    width: fit-content;
}

/* ---------- Home: activity feed card (T-V05 mirrors B1 mockup lines 376-459) ---------- */

.cah-activity-section { overflow: hidden; }
.cah-activity-header {
    padding: 20px 24px 16px;
    border-bottom: 1px solid #f0ece6; /* lighter than --border; mockup B1:385 */
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.cah-activity-header h2 {
    font-family: var(--wp--preset--font-family--serif);
    font-size: 16px;
    font-weight: 400;
    color: var(--wp--preset--color--text-strong);
    margin: 0;
}
.cah-activity-header p {
    font-size: 12px;
    color: var(--wp--preset--color--text-faint);
    margin: 0;
}

.cah-activity-feed { list-style: none; padding: 0; margin: 0; }
.cah-activity-feed .cah-feed-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 24px;
    border-bottom: 1px solid #f5f2ed; /* mockup B1:412 — lighter still */
    transition: background 0.15s;
}
.cah-activity-feed .cah-feed-item:last-child { border-bottom: none; }
.cah-activity-feed .cah-feed-item:hover { background: #faf8f5; }
.cah-activity-feed .cah-feed-dot {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    margin-top: 1px;
}
.cah-activity-feed .cah-feed-dot.is-tool     { background: #e8f0ed; }
.cah-activity-feed .cah-feed-dot.is-champion { background: #e8edf5; }
.cah-activity-feed .cah-feed-body { flex: 1; }
.cah-activity-feed .cah-feed-text {
    font-size: 13.5px;
    line-height: 1.5;
    color: #3a3330; /* mockup B1:437 */
}
.cah-activity-feed .cah-feed-text strong {
    color: var(--wp--preset--color--text-strong);
    font-weight: 600;
}
.cah-activity-feed .cah-feed-text a {
    color: var(--wp--preset--color--primary);
    text-decoration: none;
    font-weight: 500;
}
.cah-activity-feed .cah-feed-text a:hover { text-decoration: underline; }
.cah-activity-feed .cah-feed-meta {
    font-size: 11.5px;
    color: #b0a899; /* mockup B1:446 */
    margin-top: 3px;
}
.cah-activity-empty {
    padding: 16px 24px;
    font-size: 13px;
    color: var(--wp--preset--color--text-subtle);
}

/* ---------- Tool card body content ---------- */

.cah-tool-card .cah-tool-excerpt {
    color: var(--wp--preset--color--text-muted);
    font-size: 0.8125rem;
    line-height: 1.5;
    margin: 4px 0 0 0;
}

/* ---------- Single-tool body prose (T-V04: 15px body, serif h3s per ticket acceptance) ---------- */

.cah-tool-prose,
.cah-tool-prose p {
    color: var(--wp--preset--color--text);
    font-size: 0.9375rem; /* 15px */
    line-height: 1.6;
}
.cah-tool-prose p { margin: 0 0 12px; }
.cah-tool-prose h3 {
    color: var(--wp--preset--color--text-strong);
    font-family: var(--wp--preset--font-family--serif);
    font-weight: 400;
    font-size: 1rem; /* 16px */
    margin-top: 20px;
    margin-bottom: 6px;
}
.cah-tool-prose h3:first-child { margin-top: 0; }
.cah-tool-prose ul { margin: 0 0 12px; padding-left: 20px; }
.cah-tool-prose li { font-size: 0.9375rem; line-height: 1.6; color: var(--wp--preset--color--text); }

/* ---------- Welcome greeting (home) ---------- */

.cah-welcome-name { color: var(--wp--preset--color--primary); }

/* ---------- Search bar (T-FN02: mirrors C1 mockup lines 50-54) ----------
   Used by archive-tool.html (and later archive-champion via T-FN03). The
   wp:search block emits its own structural markup; we add the className
   `cah-search-bar` to the form so we can style without `!important`.
   ---------------------------------------------------------------------- */

.cah-search-bar {
    margin-bottom: 16px;
}

.cah-search-bar .wp-block-search__inside-wrapper {
    position: relative;
    border: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
}

.cah-search-bar .wp-block-search__input {
    width: 100%;
    height: 42px;
    padding: 0 16px 0 42px;
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border-strong);
    border-radius: 10px;
    font-size: 14px;
    color: var(--wp--preset--color--text-strong);
    outline: none;
    box-shadow: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.cah-search-bar .wp-block-search__input:focus {
    border-color: var(--wp--preset--color--primary);
    box-shadow: 0 0 0 3px rgba(45, 74, 62, 0.08);
}
.cah-search-bar .wp-block-search__input::placeholder {
    color: #c0b9ae;
}

/* Magnifier icon — pseudo-element on the inside wrapper so it overlays
   the input's left padding without an extra DOM node. */
.cah-search-bar .wp-block-search__inside-wrapper::before {
    content: '🔍';
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    pointer-events: none;
    opacity: 0.4;
    z-index: 1;
}

/* Submit button is hidden — Enter submits the form, magnifier hints intent.
   Mockup C1 has no visible Search button (oninput live-filtering). */
.cah-search-bar .wp-block-search__button {
    display: none;
}

/* ---------- Filter chips (T-V01: mirrors C1 mockup lines 56-61) ---------- */

.cah-filter-row {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 20px;
}

.cah-filter-group {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.cah-filter-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wp--preset--color--text-faint);
    white-space: nowrap;
    min-width: 60px;
}

.cah-filter-chips {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
}

.cah-filter-chip {
    display: inline-block;
    font-size: 12.5px;
    font-weight: 500;
    padding: 5px 12px;
    border-radius: 20px;
    border: 1px solid var(--wp--preset--color--border-strong);
    background: var(--wp--preset--color--surface);
    color: var(--wp--preset--color--text-muted);
    cursor: pointer;
    text-decoration: none;
    transition: all 0.15s;
    white-space: nowrap;
    line-height: 1.4;
}
/* Hover sage border + grey-green tint — no exact theme.json token, so
   mirror the mockup hex (C1 line 60) inline. Keep these in sync if the
   palette ever gets a `chip-hover-*` token. */
.cah-filter-chip:hover {
    border-color: #b0c8c0;
    background: #f0f5f2;
    color: var(--wp--preset--color--primary);
}
.cah-filter-chip.is-active {
    background: var(--wp--preset--color--primary);
    color: #fff;
    border-color: var(--wp--preset--color--primary);
}

.cah-filter-tag-overflow {
    font-size: 11px;
    color: var(--wp--preset--color--text-faint);
    padding: 2px 4px;
    align-self: center;
}

.cah-filter-clear {
    font-size: 0.75rem;
    color: var(--wp--preset--color--text-subtle);
    text-decoration: underline;
}
.cah-filter-clear:hover { color: var(--wp--preset--color--primary); }

/* ---------- Toolkit filter bar (T-V11) ---------- */

.cah-toolkit-filterbar {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}

/* Search input — replaces the wp:search block on /tools/. The <form>
   wrapper enables a real ?s= GET on Enter for no-JS users. */
.cah-toolkit-filterbar .cah-search {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border-strong);
    border-radius: 10px;
    padding: 10px 14px;
    transition: border-color 0.2s, box-shadow 0.2s;
    margin-bottom: 0;
}
.cah-toolkit-filterbar .cah-search:focus-within {
    border-color: var(--wp--preset--color--primary);
    box-shadow: 0 0 0 3px rgba(45, 74, 62, 0.08);
}
.cah-toolkit-filterbar .cah-search svg {
    color: var(--wp--preset--color--text-faint);
    flex: none;
}
.cah-search__input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font: inherit;
    color: var(--wp--preset--color--text-strong);
    height: 22px;
}
.cah-search__input::placeholder {
    color: var(--wp--preset--color--text-disabled);
}
.cah-search__clear {
    border: none;
    background: transparent;
    cursor: pointer;
    color: var(--wp--preset--color--text-faint);
    font-size: 18px;
    padding: 0 4px;
    line-height: 1;
}

/* Dropdown trigger — a pill in the same family as .cah-filter-chip but
   with extra slot for caret + count. */
.cah-dropdown {
    position: relative;
}
.cah-dropdown__trigger {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    border-radius: 20px;
    border: 1px solid var(--wp--preset--color--border-strong);
    background: var(--wp--preset--color--surface);
    cursor: pointer;
    font: inherit;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--wp--preset--color--text-muted);
    line-height: 1.4;
    transition: all 0.15s;
}
.cah-dropdown__trigger:hover {
    border-color: #b0c8c0;
    background: #f0f5f2;
    color: var(--wp--preset--color--primary);
}
.cah-dropdown__trigger.is-active {
    background: var(--wp--preset--color--primary);
    color: #fff;
    border-color: var(--wp--preset--color--primary);
}
.cah-dropdown__trigger[aria-expanded="true"] svg {
    transform: rotate(180deg);
}
.cah-dropdown__trigger svg {
    transition: transform 0.15s;
}
.cah-dropdown__count {
    background: var(--wp--preset--color--primary);
    color: #fff;
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 11px;
}
.cah-dropdown__trigger.is-active .cah-dropdown__count {
    background: rgba(255, 255, 255, 0.18);
}

/* Dropdown panel */
.cah-dropdown__panel {
    position: absolute;
    z-index: 30;
    top: calc(100% + 6px);
    left: 0;
    min-width: 240px;
    max-height: 360px;
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(35, 30, 20, 0.06), 0 8px 24px -12px rgba(35, 30, 20, 0.08);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.cah-dropdown__panel[hidden] {
    display: none;
}
.cah-dropdown__list {
    overflow-y: auto;
    padding: 6px;
}
.cah-dropdown__item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    text-align: left;
    border: none;
    background: transparent;
    padding: 7px 10px;
    border-radius: 6px;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
    color: var(--wp--preset--color--text);
}
.cah-dropdown__item:hover {
    background: var(--wp--preset--color--background);
}
.cah-dropdown__check {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1.5px solid var(--wp--preset--color--border-strong);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background-position: center;
    background-repeat: no-repeat;
}
.cah-dropdown__item.is-on .cah-dropdown__check {
    background-color: var(--wp--preset--color--primary);
    border-color: var(--wp--preset--color--primary);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
    background-size: 12px 12px;
}
.cah-dropdown__footer {
    border-top: 1px solid var(--wp--preset--color--border);
    padding: 6px 10px;
    display: flex;
    justify-content: flex-end;
}
.cah-dropdown__footer[hidden] {
    display: none;
}
.cah-dropdown__footer .cah-filter-clear {
    cursor: pointer;
    border: none;
    background: transparent;
    font: inherit;
    font-size: 12px;
}

/* Active-chip bar */
.cah-active-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding-top: 12px;
    border-top: 1px dashed var(--wp--preset--color--border);
}
.cah-active-bar[hidden] {
    display: none;
}
.cah-active-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wp--preset--color--text-faint);
    margin-right: 4px;
}
.cah-active-bar .cah-filter-chip.is-active {
    cursor: pointer;
    /* reuses existing .cah-filter-chip.is-active background+color */
}
.cah-active-bar .cah-active-key {
    opacity: 0.7;
    margin-right: 4px;
}
.cah-active-bar .cah-active-x {
    margin-left: 6px;
    opacity: 0.85;
}
.cah-active-bar .cah-filter-clear {
    cursor: pointer;
    border: none;
    background: transparent;
    font: inherit;
}

/* Hidden cards (JS-toggled). Stronger than .wp-block-post-template
   defaults — !important not needed because no other rule sets display
   on .cah-tool-card directly. */
.cah-tool-card.is-hidden {
    display: none;
}

/* Empty state when filters return zero matches */
.cah-empty {
    border: 1px dashed var(--wp--preset--color--border-strong);
    padding: 60px 20px;
    text-align: center;
    color: var(--wp--preset--color--text-muted);
    border-radius: 12px;
}
.cah-empty[hidden] {
    display: none;
}
.cah-empty strong {
    color: var(--wp--preset--color--text-strong);
    display: block;
    font-size: 16px;
    margin-bottom: 4px;
    font-family: var(--wp--preset--font-family--serif);
    font-weight: 400;
}

@media (max-width: 640px) {
    .cah-dropdown__trigger {
        min-height: 44px;
    }
    .cah-dropdown__item {
        min-height: 44px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .cah-dropdown__panel {
        min-width: 200px;
        max-width: calc(100vw - 32px);
    }
}

/* ---------- Nav user dropdown (T-A03 + T-V06 polish) ---------- */
/* Visual oracle: mockups/B1-landing-general-user.html lines 113-249. */

.cah-nav-user {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-size: 13px;
}

.cah-estate-badge {
    padding: 4px 12px;
    border-radius: 20px;
    background: #e4eeea;
    border: 1px solid #c2d9ce;
    color: #3a5a4e;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.01em;
    white-space: nowrap;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cah-user-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    background: none;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font: inherit;
    color: var(--wp--preset--color--text);
    transition: background 0.15s;
}
.cah-user-btn:hover { background: var(--wp--preset--color--background); }

.cah-user-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--wp--preset--color--primary);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
}
.cah-user-avatar.estate-candide { background: var(--wp--preset--color--estate-candide); }
.cah-user-avatar.estate-babylonstoren { background: var(--wp--preset--color--estate-babylonstoren); }
.cah-user-avatar.estate-the-newt-in-somerset { background: var(--wp--preset--color--estate-newt); }
.cah-user-avatar.estate-vignamaggio { background: var(--wp--preset--color--estate-vignamaggio); }
.cah-user-avatar.estate-over-amstel-boerderij { background: var(--wp--preset--color--estate-overamstel); }
.cah-user-avatar.estate-the-story-of-emily { background: var(--wp--preset--color--estate-emily); }
.cah-user-avatar.estate-plataeon { background: var(--wp--preset--color--estate-plataeon); }

.cah-user-name {
    font-size: 13px;
    font-weight: 500;
    color: #3a3330;
}
.cah-chevron {
    font-size: 10px;
    color: #9e9589;
    transition: transform 0.2s;
}
.cah-nav-user[data-cah-dropdown="open"] .cah-chevron { transform: rotate(180deg); }

.cah-user-menu {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 200px;
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wp--preset--color--border);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10);
    padding: 0;
    overflow: hidden;
    z-index: 200;
}
.cah-nav-user[data-cah-dropdown="open"] .cah-user-menu { display: block; }

.cah-menu-header {
    padding: 14px 16px 10px;
    border-bottom: 1px solid #f0ece6;
}
.cah-menu-name { font-weight: 600; color: var(--wp--preset--color--text-strong); font-size: 13.5px; margin-bottom: 2px; }
.cah-menu-email { color: var(--wp--preset--color--text-faint); font-size: 11.5px; }
.cah-role-badge {
    display: inline-block;
    margin-top: 4px;
    padding: 2px 7px;
    border-radius: 4px;
    background: var(--wp--preset--color--primary-tint);
    color: #3a5a4e;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.cah-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    color: #3a3330;
    text-decoration: none;
    font-size: 13px;
    transition: background 0.15s;
}
.cah-menu-item:hover { background: #faf8f5; }
.cah-menu-item.is-danger { color: var(--wp--preset--color--danger); }
.cah-menu-item.is-danger:hover { background: #fdf4f3; }
.cah-menu-divider { height: 1px; background: #f0ece6; margin: 2px 0; }

/* ---------- CTA button (T-A04) ---------- */

.cah-cta-row {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 12px;
}
.cah-cta-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 8px;
    background: var(--wp--preset--color--primary);
    color: #fff;
    font-size: 0.8125rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 120ms ease;
}
.cah-cta-button:hover { background: var(--wp--preset--color--text-strong); color: #fff; }

/* ---------- Page back-link ---------- */

.cah-back-link {
    display: inline-block;
    margin-bottom: 16px;
    font-size: 0.8125rem;
    color: var(--wp--preset--color--text-subtle);
    text-decoration: none;
}
.cah-back-link:hover { color: var(--wp--preset--color--primary); }

/* ============================================================
   T-V07 — Mobile breakpoint (≤640px). Audits the V04-V06 mobile
   render at the spec viewport (390x844). Goals per acceptance:
     - no horizontal scroll
     - tap targets ≥44px (WCAG 2.5.5)
     - filter chips wrap into rows of 2-3
     - tool/champion/hub cards stack 1-column (already do via grid)
     - stats bar stacks 1-column on detail page
   ============================================================ */

@media (max-width: 640px) {

    /* Nav: shrink container padding + let links scroll horizontally
       so brand stays visible and overflow doesn't push the page wider
       than the viewport. SOON pills hidden — they're the widest text. */
    .cah-topnav {
        padding: 0 12px;
        gap: 8px;
    }
    .cah-nav-brand { margin-right: 8px; }
    .cah-nav-brand-logo { height: 32px; }
    .cah-nav-brand-name { display: none; }
    .cah-nav-links {
        gap: 4px;
        flex: 1 1 auto;
        min-width: 0;
        overflow-x: auto;
        scrollbar-width: none;       /* Firefox */
        -ms-overflow-style: none;    /* IE/Edge */
    }
    .cah-nav-links::-webkit-scrollbar { display: none; }
    .cah-nav-link {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        padding: 8px 10px;
        font-size: 12.5px;
    }
    .cah-nav-soon { display: none; }
    .cah-nav-right { flex-shrink: 0; }

    /* Page wrapper: reduce horizontal padding so cards have room. */
    .wp-block-group.has-background,
    main { padding-left: 16px; padding-right: 16px; }

    /* Filter chips: bump touch height to 44px without changing
       computed visible style (style-prop checks remain green at
       1440 viewport since they only apply ≤640). */
    .cah-filter-chip { min-height: 44px; display: inline-flex; align-items: center; }
    .cah-filter-row { gap: 8px; }
    .cah-filter-group { gap: 8px; }

    /* Hub cards stack 1-column (mockup B1 is 4-col on desktop). */
    .cah-hub-cards { grid-template-columns: 1fr !important; }
    .cah-hub-card { min-height: 0; }

    /* Tool/Champion archives stack 1-column. WP block grids default
       to repeat(auto-fit, minmax(...)) — force 1fr on mobile. */
    .wp-block-post-template.is-layout-grid {
        grid-template-columns: 1fr !important;
    }

    /* Stats bar (single-tool detail): stack values vertically. */
    .cah-stats-bar {
        flex-direction: column;
        align-items: flex-start;
        row-gap: 16px;
        column-gap: 0;
    }

    /* Activity feed item padding shrink so 24px+24px doesn't eat the
       feed text width below 320px. */
    .cah-activity-feed .cah-feed-item {
        padding-left: 16px;
        padding-right: 16px;
    }

    /* Mailto link bump for tap-target compliance. */
    .cah-champion-card a.cah-mailto {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
    }
}