/* ── VARIABLES ─────────────────────────────────────────────────────────── */
:root {
    --purple:        #723063;
    --purple-dark:   #4e1f44;
    --purple-deeper: #2e1029;
    --purple-light:  #9b4a87;
    --purple-pale:   #f5eef3;
    --pink-light:    #e8b4d8;
    --white:         #ffffff;
    --gray-50:       #faf9fa;
    --gray-100:      #f2eff2;
    --gray-200:      #e4dfe4;
    --gray-300:      #cfc8d0;
    --gray-400:      #b0a8b8;
    --gray-500:      #8a8096;
    --gray-600:      #6b6578;
    --gray-700:      #4e4858;
    --gray-800:      #342e3c;
    --gray-900:      #1f1a26;
    --text:          #1a1020;
    --radius:        12px;
    --transition:    0.22s ease;
    --shadow-sm:     0 2px 8px rgba(114,48,99,0.08);
    --shadow-md:     0 6px 24px rgba(114,48,99,0.14);
    --shadow-lg:     0 16px 48px rgba(114,48,99,0.20);
    --nav-height:    62px;
}

/* ── RESET ──────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
    scroll-behavior: smooth;
    overflow-x: hidden; /* prevents horizontal scroll at viewport root */
}

body {
    font-family: 'Inter', sans-serif;
    color: var(--text);
    background: var(--white);
    line-height: 1.6;
    font-size: 16px;
    overflow-x: clip;   /* clip without creating a scroll container so that
                           position:sticky nav always spans the full viewport;
                           individual overflow-x:auto wrappers still work */
}

img { max-width: 100%; display: block; }
a { color: var(--purple); }


/* ── NAVIGATION ─────────────────────────────────────────────────────────── */
.site-nav {
    position: sticky;
    top: 0;
    z-index: 200;
    height: var(--nav-height);
    background: rgba(46, 16, 41, 0.97);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 2rem;
    box-shadow: 0 2px 16px rgba(0,0,0,0.35);
}

.nav-logo {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    text-decoration: none;
    flex-shrink: 0;
}
.nav-logo img {
    height: 40px;
    width: auto;
    border-radius: 6px;
}
.nav-logo-text {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}
.nav-logo-text .nav-logo-name {
    color: var(--white);
    font-family: 'Poppins', sans-serif;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}
.nav-logo-text .nav-logo-tagline {
    color: var(--pink-light);
    font-size: 0.65rem;
    font-weight: 400;
    letter-spacing: 0.02em;
    opacity: 0.85;
}

/* Desktop links */
.nav-links {
    display: flex;
    align-items: center;
    gap: 0.15rem;
    list-style: none;
}
.nav-links a {
    color: rgba(255,255,255,0.80);
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 500;
    padding: 0.4rem 0.7rem;
    border-radius: 6px;
    transition: background var(--transition), color var(--transition);
    white-space: nowrap;
}
.nav-links a:hover,
.nav-links li.active a {
    background: rgba(255,255,255,0.12);
    color: var(--white);
}
.nav-links li.nav-cta a {
    background: var(--purple-light);
    color: var(--white);
    font-weight: 600;
    margin-left: 0.4rem;
}
.nav-links li.nav-cta a:hover {
    background: var(--purple);
}

/* Hamburger button (mobile) */
.nav-hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px;
    border-radius: 6px;
    transition: background var(--transition);
}
.nav-hamburger:hover { background: rgba(255,255,255,0.1); }
.nav-hamburger span {
    display: block;
    height: 2px;
    background: var(--white);
    border-radius: 2px;
    transition: transform 0.25s ease, opacity 0.25s ease;
    transform-origin: center;
}
.nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; }
.nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Nav right group (links only — auth badge is now in nav-userbar) */
.nav-right {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

/* Account menu — inline pill trigger + dropdown */
.nav-account {
    position: relative;
    display: inline-flex;
}

.nav-account-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.16);
    border-radius: 20px;
    padding: 0.18rem 0.65rem 0.18rem 0.18rem;
    font-size: 0.8rem;
    font-weight: 500;
    font-family: 'Inter', sans-serif;
    color: var(--white);
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--transition), border-color var(--transition);
    line-height: 1;
}
.nav-account-toggle:hover,
#nav-account.open .nav-account-toggle {
    background: rgba(255,255,255,0.18);
    border-color: rgba(255,255,255,0.28);
}
/* Small avatar chip inside the pill — mirrors the dropdown header avatar */
.nav-account-toggle-avatar {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background: var(--purple-light);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.nav-account-toggle-avatar svg { width: 0.82rem; height: 0.82rem; color: var(--white); }
.nav-account-name { color: var(--white); }
.nav-account-caret {
    width: 0.75rem;
    height: 0.75rem;
    color: rgba(255,255,255,0.6);
    flex-shrink: 0;
    transition: transform 0.2s ease;
}
#nav-account.open .nav-account-caret { transform: rotate(180deg); }

/* Dropdown panel */
.nav-account-menu {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 230px;
    background: rgba(35, 10, 31, 0.97);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
    overflow: hidden;
    z-index: 300;
}
#nav-account.open .nav-account-menu { display: block; }

/* Identity header */
.nav-account-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 14px 11px;
}
.nav-account-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--purple-light);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.nav-account-avatar svg { width: 1rem; height: 1rem; color: var(--white); }
.nav-account-id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nav-account-head-name { color: var(--white); font-size: 0.875rem; font-weight: 700; line-height: 1.2; }
.nav-account-level { color: var(--pink-light); font-size: 0.72rem; font-weight: 400; }

/* Divider */
.nav-account-divider { height: 1px; background: rgba(255,255,255,0.12); }

/* Menu items */
.nav-account-item {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 10px 14px;
    text-decoration: none;
    transition: background var(--transition);
}
.nav-account-item:hover { background: rgba(255,255,255,0.08); }
.nav-account-item svg { width: 1.05rem; height: 1.05rem; color: var(--pink-light); flex-shrink: 0; }
.nav-account-item-label { display: block; color: rgba(255,255,255,0.92); font-size: 0.8rem; font-weight: 500; }
.nav-account-item-sub { display: block; color: rgba(255,255,255,0.48); font-size: 0.7rem; margin-top: 1px; }
.nav-account-item:hover .nav-account-item-label { color: var(--white); }
.nav-account-signout svg { color: rgba(255,255,255,0.55); }
.nav-account-signout .nav-account-item-label { color: rgba(255,255,255,0.75); }
.nav-account-signout:hover .nav-account-item-label { color: var(--white); }
.nav-account-signout:hover svg { color: rgba(255,255,255,0.85); }

/* Sign-in link in nav (shown when signed out) — subtle, inline with the menu. */
.nav-signin-link {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: rgba(255,255,255,0.72);
    font-size: 0.8rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    padding: 0.2rem 0.45rem;
    border-radius: 6px;
    transition: color var(--transition), background var(--transition);
    font-family: 'Inter', sans-serif;
    line-height: 1;
}
.nav-signin-link:hover { color: var(--white); background: rgba(255,255,255,0.08); }
.nav-signin-link svg { width: 0.85rem; height: 0.85rem; }

/* Mobile dropdown menu */
.nav-mobile {
    display: none;
    position: fixed;
    top: var(--nav-height);
    left: 0;
    right: 0;
    background: rgba(35, 10, 31, 0.98);
    backdrop-filter: blur(12px);
    padding: 1rem 1.5rem 1.5rem;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    z-index: 199;
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
    max-height: calc(100dvh - var(--nav-height));
    overflow-y: auto;
}
.nav-mobile.open { display: block; }
.nav-mobile ul { list-style: none; }
.nav-mobile ul li { border-bottom: 1px solid rgba(255,255,255,0.06); }
.nav-mobile ul li:last-child { border-bottom: none; }
.nav-mobile ul a {
    display: block;
    padding: 0.85rem 0.25rem;
    color: rgba(255,255,255,0.80);
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500;
    transition: color var(--transition);
}
.nav-mobile ul a:hover,
.nav-mobile ul li.active a { color: var(--white); }
.nav-mobile ul li.nav-cta a {
    color: var(--pink-light);
    font-weight: 700;
}
.nav-mobile ul li.nav-cta .nav-mobile-subnav a {
    color: rgba(255,255,255,0.70);
    font-weight: 400;
}
.nav-mobile-divider {
    height: 1px;
    background: rgba(255,255,255,0.12);
    margin: 0.25rem 0;
    border: none;
}
.nav-mobile-user {
    padding: 0.6rem 0.25rem 0.3rem;
    font-size: 0.78rem;
    color: rgba(255,255,255,0.45);
    letter-spacing: 0.04em;
}
.nav-mobile ul li.nav-signout a {
    color: rgba(255,255,255,0.60);
    font-size: 0.875rem;
}
.nav-mobile ul li.nav-signout a:hover { color: var(--white); }
.nav-mobile ul li.nav-signin a { color: var(--white); font-size: 0.9375rem; font-weight: 600; }

/* Mobile subnav — expandable section rows and nested sub-links */
/* The whole row is a <button> — tapping anywhere on it toggles the subnav */
.nav-mobile-item-row {
    display: flex;
    align-items: center;
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.85rem 0.25rem;
    color: rgba(255,255,255,0.80);
    font-size: 1rem;
    font-weight: 500;
    font-family: inherit;
    text-align: left;
    transition: color var(--transition);
}
.nav-mobile-item-row:hover,
.nav-mobile ul li.active .nav-mobile-item-row { color: var(--white); }
.nav-mobile-item-label { flex: 1; }
.nav-subnav-arrow {
    display: inline-block;
    font-size: 0.55rem;
    opacity: 0.55;
    margin-left: 0.5rem;
    transition: transform 0.2s ease;
}
.nav-mobile-item-row.open .nav-subnav-arrow { transform: rotate(180deg); }
.nav-mobile-subnav {
    display: none;
    list-style: none;
    background: rgba(0,0,0,0.2);
    border-top: 1px solid rgba(255,255,255,0.05);
    border-left: 3px solid rgba(255,255,255,0.20);
    margin-left: 1.25rem;
}
.nav-mobile-subnav.open { display: block; }
.nav-mobile-subnav li { border-bottom: 1px solid rgba(255,255,255,0.04); }
.nav-mobile-subnav li:last-child { border-bottom: none; }
.nav-mobile-subnav a {
    display: block;
    padding: 0.7rem 0.25rem 0.7rem 1rem;
    color: rgba(255,255,255,0.70);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 400;
    transition: color var(--transition);
}
.nav-mobile-subnav a::before {
    content: '›';
    margin-right: 0.45rem;
    opacity: 0.55;
}
.nav-mobile-subnav a:hover,
.nav-mobile-subnav li.active a { color: var(--white); }
/* Group li manages its own borders via the toggle button; suppress the default li border */
.nav-mobile-subnav li.nav-mobile-subnav-group { border-bottom: none; }
/* Sub-list links get their own › via nav-mobile-subnav-sub a::before; suppress the inherited one */
.nav-mobile-subnav-sub a::before { content: none; }

/* Mobile subnav nested group (sub-dropdown within a section's subnav) */
/* Group toggles: no › prefix, same size as flat links, ▼ on the right signals expandability */
.nav-subnav-sub-toggle {
    display: flex;
    align-items: center;
    width: 100%;
    background: rgba(255,255,255,0.04);
    border: none;
    border-top: 1px solid rgba(255,255,255,0.06);
    border-bottom: 1px solid rgba(255,255,255,0.06);
    cursor: pointer;
    padding: 0.7rem 0.25rem 0.7rem 1rem;
    color: rgba(255,255,255,0.85);
    font-size: 1rem;
    font-weight: 500;
    font-family: inherit;
    text-align: left;
    transition: color var(--transition), background var(--transition);
}
.nav-subnav-sub-toggle:hover,
.nav-subnav-sub-toggle.open { color: var(--white); background: rgba(255,255,255,0.08); }
.nav-subnav-sub-toggle .nav-mobile-item-label { flex: 1; }
.nav-subnav-sub-toggle .nav-subnav-arrow { font-size: 0.55rem; opacity: 0.55; margin-left: 0.5rem; }
.nav-subnav-sub-toggle.open .nav-subnav-arrow { transform: rotate(180deg); }
/* Flat links keep their › prefix; group toggles do not get one */
.nav-mobile-subnav-sub {
    display: none;
    list-style: none;
    padding: 0;
    margin: 0;
    background: rgba(0,0,0,0.2);
}
.nav-mobile-subnav-sub.open { display: block; }
.nav-mobile-subnav-sub li { border-bottom: 1px solid rgba(255,255,255,0.03); }
.nav-mobile-subnav-sub li:last-child { border-bottom: none; }
.nav-mobile-subnav-sub a {
    display: block;
    padding: 0.65rem 0.25rem 0.65rem 1.75rem;
    color: rgba(255,255,255,0.65);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 400;
    transition: color var(--transition);
}
.nav-mobile-subnav-sub a::before {
    content: '›';
    margin-right: 0.45rem;
    opacity: 0.55;
}
.nav-mobile-subnav-sub a:hover { color: var(--white); }

/* ── EMERGENCY BANNER ──────────────────────────────────────────────────── */
.emergency-banner {
    background: #7a1c1c;
    color: #fff;
    text-align: center;
    padding: 0.75rem 1.5rem;
    font-size: 0.9rem;
    line-height: 1.5;
}
.emergency-banner strong { color: #ffcaca; }


/* ── BUTTONS ─────────────────────────────────────────────────────────────  */
.btn {
    display: inline-block;
    padding: 0.8rem 1.9rem;
    border-radius: var(--radius);
    font-weight: 600;
    font-size: 0.975rem;
    text-decoration: none;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    border: none;
    transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
    line-height: 1;
}
.btn:hover { transform: translateY(-2px); }

.btn-white {
    background: var(--white);
    color: var(--purple-dark);
    box-shadow: 0 4px 18px rgba(0,0,0,0.18);
}
.btn-white:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.28); color: var(--purple-dark); }

.btn-outline {
    background: transparent;
    border: 2px solid rgba(255,255,255,0.55);
    color: var(--white);
}
.btn-outline:hover { background: rgba(255,255,255,0.1); border-color: var(--white); color: var(--white); }

.btn-purple {
    background: var(--purple);
    color: var(--white);
    box-shadow: var(--shadow-sm);
}
.btn-purple:hover { background: var(--purple-dark); color: var(--white); box-shadow: var(--shadow-md); }

.btn-outline-purple {
    background: transparent;
    border: 2px solid var(--purple);
    color: var(--purple);
}
.btn-outline-purple:hover { background: var(--purple); color: var(--white); }

/* ── SECTION LAYOUT ─────────────────────────────────────────────────────── */
.section-inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 1.5rem;
}
/* Report tables: allow horizontal scrolling on narrow viewports */
.section-inner:has(.report-table) {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
section { padding: 3rem 0; }
.page-subnav + section { padding-top: 2rem; }

.section-eyebrow {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--purple);
    margin-bottom: 0.5rem;
}
.section-title {
    font-family: 'Poppins', sans-serif;
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
    margin-bottom: 1rem;
}
.section-title span { color: var(--purple); }
.section-title.on-dark { color: var(--white); }
.section-title.on-dark span { color: var(--pink-light); }
.section-eyebrow.on-dark { color: var(--pink-light); }

/* ── PAGE SUBNAV ─────────────────────────────────────────────────────────── */
.page-subnav {
    background: #fff;
    border-bottom: 1px solid var(--gray-200);
    position: sticky;
    top: var(--nav-height);
    z-index: 90;
}
.page-subnav-inner {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.page-subnav-link {
    display: inline-flex;
    align-items: center;
    padding: 0.65rem 1.1rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--gray-600);
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
    transition: color 0.15s, border-color 0.15s;
}
.page-subnav-link:hover { color: var(--purple); }
.page-subnav-link.active {
    color: var(--purple);
    border-bottom-color: var(--purple);
    font-weight: 600;
}
@media (max-width: 600px) {
    .page-subnav-inner { padding: 0 0.75rem; }
    .page-subnav-link  { padding: 0.6rem 0.75rem; font-size: 0.8rem; }
}

/* ── PAGE SUBNAV GROUP DROPDOWN ─────────────────────────────────────────── */
.page-subnav-group {
    position: relative;
    display: inline-flex;
    align-items: stretch;
}
.page-subnav-group-toggle {
    background: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}
.page-subnav-caret {
    font-size: 0.6em;
    display: inline-block;
    transition: transform 0.15s;
    line-height: 1;
}
.page-subnav-group-toggle.open .page-subnav-caret { transform: rotate(180deg); }
.page-subnav-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border: 1px solid var(--gray-200);
    border-radius: 0 0 4px 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    min-width: 200px;
    z-index: 100;
}
.page-subnav-dropdown.open { display: block; }
.page-subnav-dropdown-link {
    display: block;
    padding: 0.65rem 1.1rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--gray-600);
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 1px solid var(--gray-100);
    transition: color 0.15s, background-color 0.15s;
}
.page-subnav-dropdown-link:last-child { border-bottom: none; }
.page-subnav-dropdown-link:hover { color: var(--purple); background: var(--gray-50); }
.page-subnav-dropdown-link.active { color: var(--purple); font-weight: 600; }

/* ── PAGE HEADER (inner pages) ──────────────────────────────────────────── */
.page-header {
    background: linear-gradient(135deg, var(--purple-deeper) 0%, var(--purple-dark) 55%, var(--purple) 100%);
    padding: 3rem 1.5rem 2.5rem;
    text-align: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 28px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.13);
    border-bottom: 1px solid rgba(255,255,255,0.07);
}
.page-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 70% 50%, rgba(155,74,135,0.2) 0%, transparent 60%);
    pointer-events: none;
    z-index: 1;
}
.page-header::after {
    content: '';
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        -55deg,
        transparent,
        transparent 18px,
        rgba(255,255,255,0.05) 18px,
        rgba(255,255,255,0.05) 19px
    );
    pointer-events: none;
    z-index: 1;
}
.page-header .section-inner {
    position: relative;
    z-index: 2;
}
.page-header .breadcrumb {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.40);
    margin-bottom: 0.65rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    position: relative;
}
.page-header .breadcrumb a { color: rgba(255,255,255,0.40); text-decoration: none; }
.page-header .breadcrumb a:hover { color: rgba(255,255,255,0.7); }
.page-header h1 {
    font-family: 'Poppins', sans-serif;
    font-size: clamp(1.6rem, 5vw, 2.6rem);
    font-weight: 800;
    color: var(--white);
    letter-spacing: -0.02em;
    line-height: 1.15;
    position: relative;
}
.page-header h1 span { color: var(--pink-light); }
.page-header .page-sub {
    color: rgba(255,255,255,0.6);
    margin-top: 0.5rem;
    font-size: 1rem;
    position: relative;
}
.access-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: rgba(0, 0, 0, 0.30);
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0.28rem 0.75rem;
    border-radius: 999px;
    margin-top: 0.6rem;
}
.restricted-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.6rem;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    color: rgba(255,255,255,0.65);
    border-radius: 20px;
    padding: 0.2rem 0.85rem;
    font-size: 0.73rem;
    font-weight: 600;
    position: relative;
}

/* ── STATS BAR ───────────────────────────────────────────────────────────── */
.stats-bar {
    background: var(--purple-dark);
    display: flex;
    justify-content: center;
}
.stat-item {
    flex: 1;
    max-width: 300px;
    text-align: center;
    padding: 1.5rem 1rem;
    border-right: 1px solid rgba(255,255,255,0.1);
    color: var(--white);
}
.stat-item:last-child { border-right: none; }
.stat-value {
    font-family: 'Poppins', sans-serif;
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--pink-light);
    line-height: 1;
}
.stat-label {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.55);
    margin-top: 0.3rem;
    text-transform: uppercase;
    letter-spacing: 0.09em;
}
.stat-sub {
    font-size: 0.7rem;
    color: rgba(255,255,255,0.38);
    margin-top: 0.2rem;
}

/* ── CARDS ──────────────────────────────────────────────────────────────── */
.card {
    background: var(--white);
    border-radius: var(--radius);
    border: 1px solid var(--gray-200);
    box-shadow: var(--shadow-sm);
}
.card-head {
    padding: 0.9rem 1.25rem;
    border-bottom: 1px solid var(--gray-100);
}
.card-head h3 {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--gray-600);
}
.card-body { padding: 1.25rem; }

/* ── LINK CARDS (quick nav) ─────────────────────────────────────────────── */
.links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
    margin-top: 2rem;
}
.link-card {
    background: var(--purple-pale);
    border-radius: var(--radius);
    padding: 1.5rem 1rem;
    text-align: center;
    text-decoration: none;
    color: var(--purple-dark);
    font-weight: 600;
    font-size: 0.9rem;
    border: 2px solid transparent;
    transition: border-color var(--transition), background var(--transition), transform var(--transition), box-shadow var(--transition);
}
.link-card:hover {
    border-color: var(--purple);
    background: var(--white);
    color: var(--purple);
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(114,48,99,0.14);
}
.link-card .link-icon {
    font-size: 1.75rem;
    display: block;
    margin-bottom: 0.45rem;
}

/* ── VIDEO EMBED ─────────────────────────────────────────────────────────── */
.video-wrapper {
    position: relative;
    padding-bottom: 56.25%;
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow-md);
}
.video-wrapper iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* ── TESTIMONIAL ─────────────────────────────────────────────────────────── */
.testimonial-section {
    background: linear-gradient(135deg, var(--purple-deeper), var(--purple-dark));
}
.testimonial-card {
    max-width: 740px;
    margin: 2rem auto 0;
    text-align: center;
}
.testimonial-card blockquote {
    font-size: clamp(1rem, 2.5vw, 1.25rem);
    font-style: italic;
    line-height: 1.8;
    color: rgba(255,255,255,0.86);
    position: relative;
    padding: 0 1.5rem;
}
.testimonial-card blockquote::before {
    content: '\201C';
    font-size: 5rem;
    color: rgba(255,255,255,0.1);
    font-family: Georgia, serif;
    position: absolute;
    top: -1.8rem;
    left: 0;
    line-height: 1;
}
.testimonial-card cite {
    display: block;
    margin-top: 1.2rem;
    font-size: 0.875rem;
    font-style: normal;
    color: var(--pink-light);
    font-weight: 600;
}

/* ── FOOTER ──────────────────────────────────────────────────────────────── */
.site-footer {
    background: var(--purple-deeper);
    color: rgba(255,255,255,0.45);
    padding: 3rem 1.5rem 2rem;
    font-size: 0.85rem;
}
.footer-inner {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    margin-bottom: 1.5rem;
}
.footer-brand .footer-name {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--white);
    margin-bottom: 0.25rem;
}
.footer-brand .footer-tagline {
    font-size: 0.8rem;
    color: rgba(255,255,255,0.35);
    font-style: italic;
}
.footer-links {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.footer-links a {
    color: rgba(255,255,255,0.5);
    text-decoration: none;
    font-size: 0.82rem;
    transition: color var(--transition);
}
.footer-links a:hover { color: var(--white); }
.footer-copy {
    max-width: 1100px;
    margin: 0 auto;
    text-align: center;
    font-size: 0.78rem;
    color: rgba(255,255,255,0.3);
}

/* ── DATA TABLES ─────────────────────────────────────────────────────────── */
.data-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.data-table th {
    background: var(--gray-50);
    color: var(--gray-600);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-weight: 700;
    padding: 0.55rem 0.75rem;
    text-align: left;
    border-bottom: 1px solid var(--gray-200);
    white-space: nowrap;
}
.data-table td {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--gray-100);
    vertical-align: middle;
}
.data-table tr:last-child td { border-bottom: none; }
.data-table tr:hover td { background: var(--gray-50); }

/* ── INFO PAGE LAYOUT ────────────────────────────────────────────────────── */
.info-layout {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 3.5rem;
    align-items: start;
}
.info-body p {
    color: var(--gray-600);
    font-size: 1.05rem;
    line-height: 1.8;
    margin-bottom: 1.25rem;
}
.info-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.info-card {
    background: var(--purple-pale);
    border-radius: var(--radius);
    padding: 1.25rem 1.4rem;
    border-left: 3px solid var(--purple);
}
.info-card-icon {
    font-size: 1.4rem;
    margin-bottom: 0.4rem;
}
.info-card-icon svg { width: 1.6rem; height: 1.6rem; color: var(--purple); }
.info-card h3 {
    font-family: 'Poppins', sans-serif;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin-bottom: 0.3rem;
}
.info-card p {
    font-size: 0.85rem;
    color: var(--gray-600);
    line-height: 1.6;
    margin: 0;
}

/* Flowing prose block (beliefs, mission) */
.prose p {
    color: var(--gray-600);
    font-size: 1.05rem;
    line-height: 1.8;
    margin-bottom: 1.25rem;
    max-width: 820px;
}

/* Two-column testimonial grid */
.testimonial-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    margin-top: 2rem;
}
.testimonial-grid .testimonial-card {
    margin: 0;
    text-align: left;
}
.testimonial-grid .testimonial-card blockquote {
    font-size: 0.95rem;
    margin-bottom: 0.75rem;
}

/* ── INNER PAGE PHOTO STRIP ──────────────────────────────────────────────── */
.photo-strip {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin: 2rem 0 0;
    /* padding: 0 1.5rem; */
}
/* When strip is at the top inside section-inner, reduce top gap, add bottom gap */
.section-inner > .photo-strip {
    margin-top: 0;
    margin-bottom: 2.5rem;
}
.photo-strip-img {
    width: 200px;
    height: 200px;
    background-size: cover;
    background-position: center;
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    flex-shrink: 0;
}

/* Mobile  -  shrink photos so all four fit across the screen */
@media (max-width: 600px) {
    .photo-strip {
        width: 100%;
        padding: 0 0.75rem;
        gap: 4px;
        margin-top: 1.5rem;
        box-sizing: border-box;
    }
    .photo-strip-img {
        flex: 1 1 0;
        width: 0;
        height: auto;
        aspect-ratio: 1 / 1;
    }
}


/* ── TEAM ONLY LOGIN PAGE ────────────────────────────────────────────────── */
.login-wrap {
    min-height: calc(100vh - 60px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 2rem 1rem;
    background: linear-gradient(135deg, var(--purple-deeper), var(--purple-dark));
}
.login-card {
    background: var(--white);
    border-radius: 18px;
    padding: 2.5rem 2.5rem 2rem;
    width: 100%;
    max-width: 400px;
    box-shadow: 0 24px 64px rgba(0,0,0,0.35);
}
.login-card .lock-icon {
    font-size: 2.4rem;
    text-align: center;
    margin-bottom: 0.5rem;
}
.login-card h2 {
    font-family: 'Poppins', sans-serif;
    font-size: 1.4rem;
    font-weight: 700;
    text-align: center;
    color: var(--purple-dark);
    margin-bottom: 0.3rem;
}
.login-card .login-sub {
    text-align: center;
    font-size: 0.85rem;
    color: var(--gray-600);
    margin-bottom: 1.5rem;
}
.login-card .field-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gray-600);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin-bottom: 0.3rem;
    display: block;
}
.login-card .field-input {
    width: 100%;
    padding: 0.7rem 1rem;
    border: 1.5px solid var(--gray-200);
    border-radius: 8px;
    font-size: 0.95rem;
    font-family: 'Inter', sans-serif;
    color: var(--text);
    transition: border-color 0.22s ease;
    margin-bottom: 1.1rem;
    box-sizing: border-box;
}
.login-card .field-input:focus {
    outline: none;
    border-color: var(--purple-light);
}
.login-card .btn-login {
    width: 100%;
    padding: 0.75rem;
    background: var(--white);
    color: var(--purple-dark);
    border: 1.5px solid var(--gray-300);
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    transition: background 0.22s ease, border-color 0.22s ease;
    margin-top: 0.4rem;
}
.login-card .btn-login:hover { background: var(--gray-100); border-color: var(--gray-400); }
.login-divider {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 1.25rem 0 1rem;
    color: var(--gray-400);
    font-size: 0.8rem;
}
.login-divider::before,
.login-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--gray-200);
}
.oauth-pitch {
    text-align: left;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--purple-dark);
    margin-bottom: 0.75rem;
    line-height: 1.4;
}
.oauth-buttons {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-top: 0.5rem;
}
.login-card .btn-google {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.95rem;
    background: var(--white);
    color: var(--text);
    border: 1.5px solid var(--gray-300);
    border-radius: 10px;
    font-size: 1.02rem;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
    transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.1s ease;
    box-sizing: border-box;
}
.login-card .btn-google:hover {
    border-color: var(--purple-light);
    box-shadow: 0 6px 18px rgba(0,0,0,0.14);
}
.login-card .btn-google:active { transform: translateY(1px); }

.login-note {
    font-size: 0.85rem;
    color: var(--gray-600);
    margin-top: 0.25rem;
}
.magic-link-details {
    margin-top: 1.25rem;
    text-align: center;
}
.magic-link-details summary {
    cursor: pointer;
    color: var(--purple-dark);
    font-size: 0.88rem;
    font-weight: 600;
    list-style: none;
    display: inline-block;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.magic-link-details summary::-webkit-details-marker { display: none; }
.magic-link-details[open] summary { color: var(--purple-dark); }
.magic-link-details .login-note { text-align: left; }
.login-card .login-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.875rem;
    margin-bottom: 1.25rem;
}
.login-hint {
    background: var(--gray-100);
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    padding: 0.9rem 1rem;
    font-size: 0.875rem;
    margin-top: 0.75rem;
}

.login-hint > div {
    display: grid;
    grid-template-columns: 5.5rem 1fr;
    gap: 0.5rem;
    align-items: start;
    margin-bottom: 0.3rem;
}

.login-hint-label {
    font-weight: 600;
    color: var(--text);
}

.login-hint-value {
    font-family: monospace;
    font-size: 0.875rem;
}

/* ── ACCOUNT LINKING PAGE ────────────────────────────────────────────────── */
.link-match-name {
    font-size: 1.2rem;
    font-weight: 700;
    font-family: 'Poppins', sans-serif;
    color: var(--purple-dark);
    text-align: center;
    background: var(--gray-100);
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    padding: 0.85rem 1rem;
    margin: 1rem 0 1.5rem;
}
.link-results {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}
.link-result-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.75rem 1rem;
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    font-family: 'Inter', sans-serif;
    transition: border-color 0.2s, background 0.2s;
}
.link-result-row:hover {
    border-color: var(--purple-light);
    background: var(--purple-pale);
}
.link-result-name {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text);
}
.link-result-meta {
    font-size: 0.8rem;
    color: var(--gray-500);
}

/* ── TEAM ONLY TOOLBAR (signed-in state) ────────────────────────────────── */
.to-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.25rem;
}
.to-logout-link {
    font-size: 0.8rem;
    color: var(--gray-500);
    text-decoration: none;
    border: 1px solid var(--gray-300);
    border-radius: 99px;
    padding: 0.25rem 0.75rem;
    transition: color 0.15s, border-color 0.15s;
}
.to-logout-link:hover { color: var(--purple); border-color: var(--purple-light); }

/* ── ASSET FILE LIST ─────────────────────────────────────────────────────── */
.asset-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.asset-item {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    padding: 0.85rem 1.1rem;
    color: var(--text);
    transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
}
.asset-item:hover {
    border-color: var(--purple-light);
    box-shadow: var(--shadow-sm);
    background: var(--purple-pale);
}
.asset-icon { font-size: 1.4rem; flex-shrink: 0; line-height: 1; }
.asset-name {
    flex: 1;
    font-size: 0.925rem;
    font-weight: 500;
    word-break: break-word;
    text-decoration: none;
    color: var(--text);
}
.asset-name:hover { text-decoration: underline; }
.asset-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}
.asset-ext {
    font-size: 0.7rem;
    font-weight: 700;
    background: var(--gray-100);
    color: var(--gray-600);
    border-radius: 4px;
    padding: 0.15rem 0.45rem;
    letter-spacing: 0.05em;
}
.asset-size { font-size: 0.78rem; color: var(--gray-500); }
.asset-dl {
    flex-shrink: 0;
    width: 1.75rem;
    height: 1.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gray-100);
    color: var(--purple);
    border-radius: 50%;
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
}
.asset-item:hover .asset-dl { background: var(--purple); color: var(--white); }

.asset-row {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
}
.asset-row .asset-item { flex: 1; min-width: 0; }

/* -- File manager (includes/file_manager.php) ---------------------------- */
/* Admin-only upload form + per-file delete. Rendered on teamonly/assets.php and
   the church_info Documents tab. */
.fm-flash {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    border: 1px solid;
    border-radius: var(--radius);
    padding: 0.7rem 1rem;
    margin-bottom: 1.1rem;
    font-size: 0.875rem;
}
.fm-flash i { width: 17px; height: 17px; flex-shrink: 0; }
.fm-flash--ok  { background: #f0fdf4; border-color: #bbf7d0; color: #166534; }
.fm-flash--err { background: #fef2f2; border-color: #fecaca; color: #991b1b; }

.fm-upload {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6rem;
    background: var(--purple-pale);
    border: 1px dashed var(--purple-light);
    border-radius: var(--radius);
    padding: 0.85rem 1rem;
    margin-bottom: 1.5rem;
}
/* The real input is hidden; .fm-upload-label is the visible control. Kept
   focusable-adjacent rather than display:none so keyboard tabbing still lands
   on it via the label's `for`. */
.fm-upload input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}
.fm-upload-label {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex: 1;
    min-width: 12rem;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    padding: 0.5rem 0.8rem;
    font-size: 0.875rem;
    color: var(--gray-600);
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s;
}
.fm-upload-label:hover { border-color: var(--purple-light); color: var(--purple); }
.fm-upload-label i { width: 16px; height: 16px; flex-shrink: 0; }
.fm-upload-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fm-upload--picked .fm-upload-label { color: var(--text); border-color: var(--purple); }
/* The file input is visually hidden but still tab-focusable, so mirror its focus
   ring onto the label the user actually sees. Relies on the input preceding the
   label in the markup. */
.fm-upload input[type="file"]:focus-visible + .fm-upload-label {
    outline: 2px solid var(--purple);
    outline-offset: 2px;
}
.fm-upload-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.fm-upload-hint {
    flex-basis: 100%;
    margin: 0;
    font-size: 0.75rem;
    color: var(--gray-500);
}

.fm-del-form { display: flex; flex-shrink: 0; }
.fm-del-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    color: var(--gray-500);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.fm-del-btn:hover {
    border-color: #fecaca;
    background: #fef2f2;
    color: #dc2626;
}
.fm-del-btn i { width: 16px; height: 16px; }

@media (max-width: 640px) {
    .fm-upload-label { min-width: 0; }
}
.asset-annotate {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0 0.9rem;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    color: var(--purple);
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
}
.asset-annotate:hover {
    border-color: var(--purple-light);
    box-shadow: var(--shadow-sm);
    background: var(--purple-pale);
}
.asset-annotate i { width: 16px; height: 16px; }
/* "Download annotated" variant — a green accent distinguishes "get the finished,
   marked-up map" from the purple "Annotate" (open the editor) action beside it. */
.asset-annotate--dl { color: #1e874b; }
.asset-annotate--dl:hover {
    border-color: #27ae60;
    background: rgba(39,174,96,0.09);
}

/* Empty state (shared) */
.empty-state {
    text-align: center;
    padding: 4rem 1rem;
    color: var(--gray-500);
}
.empty-state p:first-child { font-size: 3rem; margin-bottom: 0.75rem; }
.empty-state p { font-size: 1rem; }


/* ── CHURCH INFO PAGE ────────────────────────────────────────────────────── */

/* Header row: church name + summary pills */
.ci-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}
.ci-church-heading {
    font-family: 'Poppins', sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin: 0;
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.ci-church-city {
    font-family: 'Inter', sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--gray-600);
}
.ci-church-id {
    font-family: 'Inter', sans-serif;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--gray-600);
    background: var(--gray-100);
    border: 1px solid var(--gray-200);
    border-radius: 999px;
    padding: 0.1rem 0.5rem;
}
.ci-summary-pills {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
}
.ci-pill {
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.25rem 0.7rem;
    border-radius: 20px;
    white-space: nowrap;
}
.ci-pill--notes   { background: #eef2ff; color: #3730a3; }
.ci-pill--docs    { background: #fef3c7; color: #92400e; }
.ci-pill--vendors { background: #d1fae5; color: #065f46; }

/* Tab bar */
.ci-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--gray-200);
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}
.ci-tab {
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    padding: 0.6rem 1.1rem;
    font-family: 'Inter', sans-serif;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--gray-600);
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
    display: flex;
    align-items: center;
    gap: 0.45rem;
    white-space: nowrap;
}
.ci-tab:hover { color: var(--purple); }
.ci-tab.active {
    color: var(--purple);
    border-bottom-color: var(--purple);
}
.ci-tab-count {
    background: var(--purple-pale);
    color: var(--purple-dark);
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.1rem 0.45rem;
    border-radius: 10px;
}
.ci-tab.active .ci-tab-count {
    background: var(--purple);
    color: var(--white);
}

/* Tab panels */
.ci-panel { display: none; }
.ci-panel.active { display: block; }

/* Empty state per tab */
.ci-tab-empty {
    text-align: center;
    padding: 2.5rem 1rem;
    color: var(--gray-600);
}
.ci-tab-empty-icon {
    font-size: 2rem;
    display: block;
    margin-bottom: 0.5rem;
}

/* Notes */
.ci-notes-list { display: flex; flex-direction: column; gap: 0.75rem; }
.ci-note-row {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
}
.ci-note-date {
    flex-shrink: 0;
    min-width: 80px;
    background: var(--purple);
    color: var(--white);
    font-size: 0.75rem;
    font-weight: 700;
    text-align: center;
    padding: 0.35rem 0.6rem;
    border-radius: 6px;
    line-height: 1.3;
}
.ci-note-text {
    flex: 1;
    background: var(--gray-50);
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    padding: 0.65rem 0.9rem;
    font-size: 0.9rem;
    line-height: 1.55;
}

/* Vendor city note */
.ci-vendor-city-note {
    font-size: 0.85rem;
    color: var(--gray-600);
    margin-bottom: 1.25rem;
    padding: 0.6rem 0.9rem;
    background: var(--gray-50);
    border-radius: 8px;
    border-left: 3px solid var(--purple-light);
}

/* Vendor type accordions */
.ci-vtype-accordion {
    border: 1px solid var(--gray-200);
    border-radius: 10px;
    margin-bottom: 0.75rem;
    overflow: hidden;
}
.ci-vtype-accordion:last-child { margin-bottom: 0; }
.ci-vtype-summary {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: var(--gray-50);
    cursor: pointer;
    list-style: none;
    user-select: none;
    border-bottom: 1px solid transparent;
    transition: background 0.15s;
}
.ci-vtype-accordion[open] > .ci-vtype-summary {
    border-bottom-color: var(--gray-200);
    background: var(--purple-pale);
}
.ci-vtype-summary::-webkit-details-marker { display: none; }
.ci-vtype-name {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--purple-dark);
    flex: 1;
}
.ci-vtype-count {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--gray-600);
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: 10px;
    padding: 0.1rem 0.5rem;
}
.ci-vtype-chevron {
    width: 0.5rem;
    height: 0.5rem;
    border-right: 2px solid var(--gray-600);
    border-bottom: 2px solid var(--gray-600);
    transform: rotate(45deg);
    transition: transform 0.2s;
    flex-shrink: 0;
}
.ci-vtype-accordion[open] .ci-vtype-chevron { transform: rotate(-135deg); }
.ci-vtype-body { padding: 0.85rem 1rem 1rem; }

/* Vendor table */
.ci-vendor-table { margin-bottom: 0; }
.ci-vendor-name { font-size: 0.875rem; font-weight: 500; }
.ci-vendor-city { font-weight: 400; color: var(--gray-600); }
.ci-vendor-phone {
    font-size: 0.78rem;
    color: var(--gray-600);
    margin-top: 0.15rem;
}
.ci-vendor-contact {
    font-size: 0.75rem;
    color: var(--gray-600);
    margin-top: 0.1rem;
    font-style: italic;
}
.ci-cost-cell {
    font-weight: 600;
    white-space: nowrap;
}
.ci-people-cell {
    font-size: 0.9rem;
    white-space: nowrap;
}
.ci-per-person {
    display: block;
    font-size: 0.72rem;
    color: var(--gray-600);
}
.ci-tec-btn {
    background: var(--purple-pale);
    color: var(--purple-dark);
    border: 1px solid var(--gray-200);
    border-radius: 6px;
    padding: 0.2rem 0.55rem;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    transition: background 0.15s;
    white-space: nowrap;
}
.ci-tec-btn:hover { background: var(--purple); color: var(--white); }
.ci-note-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    padding: 0 0.2rem;
    vertical-align: middle;
    opacity: 0.7;
    transition: opacity 0.15s;
}
.ci-note-btn:hover { opacity: 1; }

/* Note modal */
.ci-modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}
.ci-modal-box {
    background: var(--purple-dark);
    color: var(--white);
    border-radius: 14px;
    padding: 2rem 2rem 1.75rem;
    width: 100%;
    max-width: 380px;
    box-shadow: 0 16px 48px rgba(0,0,0,0.4);
    position: relative;
}
.ci-modal-close {
    position: absolute;
    top: 0.75rem;
    right: 1rem;
    background: none;
    border: none;
    color: rgba(255,255,255,0.7);
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    transition: color 0.15s;
}
.ci-modal-close:hover { color: var(--white); }
.ci-modal-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgba(255,255,255,0.5);
    margin-bottom: 0.75rem;
}
.ci-modal-text {
    font-size: 1rem;
    line-height: 1.6;
    color: var(--white);
}

/* Version chooser (annotated vs original) action buttons */
.ci-version-actions {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-top: 1.5rem;
}
.ci-version-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}
.ci-version-btn i { width: 17px; height: 17px; }
/* Primary = annotated: big, green, obvious default */
.ci-version-btn--primary {
    background: #2ecc71;
    color: #0b3d22;
    font-size: 0.95rem;
}
.ci-version-btn--primary:hover { background: #27ae60; color: var(--white); }
/* Secondary = original: smaller, quiet outline */
.ci-version-btn--secondary {
    background: transparent;
    color: rgba(255,255,255,0.85);
    border-color: rgba(255,255,255,0.28);
    font-weight: 600;
    font-size: 0.82rem;
    padding: 0.5rem 1rem;
}
.ci-version-btn--secondary:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.5); }

@media (max-width: 600px) {
    .ci-header { flex-direction: column; }
    .ci-note-row { flex-direction: column; gap: 0.4rem; }
    .ci-note-date { min-width: unset; width: fit-content; }
    .ci-tab { padding: 0.5rem 0.75rem; font-size: 0.8rem; }
    .ci-vendor-table th:nth-child(5),
    .ci-vendor-table td:nth-child(5) { display: none; }
}

/* ── CHURCH DETAILS ENTRY ────────────────────────────────────────────────── */
.cd-selector-wrap { margin-bottom: 2rem; }
.field-label-plain {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gray-600);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin-bottom: 0.4rem;
}
.cd-select {
    width: 100%;
    max-width: 480px;
    padding: 0.65rem 1rem;
    border: 1.5px solid var(--gray-200);
    border-radius: 8px;
    font-size: 0.95rem;
    font-family: 'Inter', sans-serif;
    color: var(--text);
    background: var(--white);
    cursor: pointer;
    transition: border-color 0.15s;
}
.cd-select:focus { outline: none; border-color: var(--purple-light); }

.cd-section {
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}
.cd-section-title {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.65rem;
}
.cd-count {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    background: var(--purple-pale);
    color: var(--purple);
    border-radius: 20px;
    padding: 0.15rem 0.65rem;
}
.cd-empty { color: var(--gray-500); font-style: italic; font-size: 0.9rem; }

.cd-detail-list { display: flex; flex-direction: column; gap: 1rem; }
.cd-detail-row {
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    padding: 1rem;
    background: var(--gray-50);
}
.cd-detail-date {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gray-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}
.cd-textarea {
    width: 100%;
    padding: 0.6rem 0.85rem;
    border: 1.5px solid var(--gray-200);
    border-radius: 8px;
    font-size: 0.9rem;
    font-family: 'Inter', sans-serif;
    color: var(--text);
    resize: vertical;
    box-sizing: border-box;
    transition: border-color 0.15s;
    margin-bottom: 0.75rem;
}
.cd-textarea:focus { outline: none; border-color: var(--purple-light); }
.cd-detail-actions { display: flex; gap: 0.5rem; }

/* Small button variant */
.btn-sm { padding: 0.35rem 0.85rem; font-size: 0.8rem; }

/* Danger button */
.btn-danger {
    background: #dc2626;
    color: var(--white);
    border: none;
    border-radius: 8px;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    transition: background 0.15s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.btn-danger:hover { background: #b91c1c; }

@media (max-width: 600px) {
    .cd-select { max-width: 100%; }
    .cd-detail-actions { flex-wrap: wrap; }
}


/* ── TALK ACCORDION ──────────────────────────────────────────────────────── */
.talk-accordion { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 1.5rem; }

.talk-item {
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    background: #fff;
    overflow: hidden;
}
.talk-item[open] { border-color: var(--purple-light); }

.talk-summary {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    cursor: pointer;
    list-style: none;
    user-select: none;
    transition: background 0.15s;
}
.talk-summary::-webkit-details-marker { display: none; }
.talk-summary:hover { background: var(--gray-100); }
.talk-item[open] .talk-summary { background: var(--gray-100); border-bottom: 1px solid var(--gray-200); }

.talk-num {
    flex-shrink: 0;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--purple);
    background: rgba(124, 58, 237, 0.08);
    border-radius: 99px;
    padding: 0.2rem 0.65rem;
}
.talk-title-text {
    flex: 1;
    font-weight: 600;
    font-size: 1rem;
    color: var(--text);
}
.talk-duration {
    flex-shrink: 0;
    font-size: 0.8rem;
    color: var(--gray-500);
    white-space: nowrap;
}
.talk-chevron {
    flex-shrink: 0;
    width: 1.1rem;
    height: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.talk-chevron::after {
    content: '';
    display: block;
    width: 0.5rem;
    height: 0.5rem;
    border-right: 2px solid var(--gray-400);
    border-bottom: 2px solid var(--gray-400);
    transform: rotate(45deg);
    transition: transform 0.2s;
    margin-top: -4px;
}
.talk-item[open] .talk-chevron::after {
    transform: rotate(-135deg);
    margin-top: 4px;
}

.talk-body {
    padding: 1.5rem 1.5rem 1.75rem;
    color: var(--gray-700);
    line-height: 1.7;
}
.talk-body p { margin: 0 0 1rem; }
.talk-body ol, .talk-body ul {
    margin: 0 0 1rem 1.25rem;
    padding: 0;
}
.talk-body li { margin-bottom: 0.4rem; }
.talk-body ol ol { margin-top: 0.35rem; margin-bottom: 0.35rem; }

/* Verse reference table (Talk 2) */
.verse-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    margin-top: 0.75rem;
    margin-bottom: 1rem;
}
.verse-table th {
    text-align: left;
    padding: 0.5rem 0.75rem;
    background: var(--gray-100);
    border-bottom: 2px solid var(--gray-200);
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gray-600);
}
.verse-table td {
    padding: 0.45rem 0.75rem;
    border-bottom: 1px solid var(--gray-100);
    vertical-align: top;
}
.verse-table td:first-child {
    white-space: nowrap;
    font-weight: 600;
    color: var(--purple-dark);
    width: 9rem;
}
.verse-section-header {
    font-weight: 700 !important;
    color: var(--text) !important;
    padding-top: 0.9rem !important;
    background: none;
}

@media (max-width: 600px) {
    .talk-summary { gap: 0.5rem; padding: 0.875rem 1rem; }
    .talk-duration { display: none; }
    .talk-body { padding: 1.25rem 1rem 1.5rem; }
    .verse-table td:first-child { width: auto; white-space: normal; }
}


/* ── RESOURCE GRID (Team Only hub) ──────────────────────────────────────── */
.resource-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1.25rem;
    margin-top: 2.5rem;
}
.resource-card {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.5rem 1.25rem;
    background: #fff;
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.15s, border-color 0.15s, transform 0.15s;
}
.resource-card:hover {
    box-shadow: var(--shadow);
    border-color: var(--purple-light);
    transform: translateY(-2px);
}
.resource-card-icon {
    font-size: 1.75rem;
    line-height: 1;
    margin-bottom: 0.25rem;
}
.resource-card h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin: 0;
}
.resource-card p {
    font-size: 0.875rem;
    color: var(--gray-600);
    margin: 0;
    line-height: 1.5;
}

/* ── CONTACT FORM ────────────────────────────────────────────────────────── */
.form-card {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 2rem 2.25rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
    margin-bottom: 2rem;
}

.contact-form { display: flex; flex-direction: column; gap: 1.25rem; }
.form-row { display: flex; flex-direction: column; gap: 0.4rem; }
.form-row label { font-size: 0.875rem; font-weight: 600; color: var(--text); }
.form-row input,
.form-row select,
.form-row textarea {
    width: 100%;
    padding: 0.65rem 0.9rem;
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem;
    color: var(--text);
    background: var(--white);
    transition: border-color var(--transition), box-shadow var(--transition);
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus {
    outline: none;
    border-color: var(--purple);
    box-shadow: 0 0 0 3px rgba(114,48,99,0.12);
}
.form-row textarea { resize: vertical; min-height: 160px; }
.req { color: var(--purple); }

.form-success {
    text-align: center;
    padding: 3rem 1.5rem;
    background: var(--purple-pale);
    border-radius: var(--radius);
    border: 1px solid rgba(114,48,99,0.15);
}
.form-success h2 { font-family: 'Poppins', sans-serif; color: var(--purple-dark); margin-bottom: 0.5rem; }

.form-errors {
    background: #fff0f0;
    border: 1px solid #f5c0c0;
    border-radius: 8px;
    padding: 0.9rem 1.2rem;
    margin-bottom: 1.5rem;
    color: #c0392b;
    font-size: 0.9rem;
}

/* ── PAYMENT FORMS ───────────────────────────────────────────────────────── */
.payment-block { margin-bottom: 1rem; }
.payment-form { display: flex; flex-direction: column; gap: 1.25rem; max-width: 480px; }

/* ── TEC COUNCIL ─────────────────────────────────────────────────────────── */
.council-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: start;
}
.council-group-title {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin-bottom: 1rem;
}

/* ── FAQ ─────────────────────────────────────────────────────────────────── */
.faq-list { display: flex; flex-direction: column; }
.faq-item {
    padding: 1.5rem 0;
    border-bottom: 1px solid var(--gray-200);
}
.faq-item:last-of-type { border-bottom: none; }
.faq-item h3 {
    font-family: 'Poppins', sans-serif;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin-bottom: 0.6rem;
}
.faq-item p { color: var(--gray-600); line-height: 1.75; margin-bottom: 0.5rem; }
.faq-item p:last-child { margin-bottom: 0; }
.faq-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 2rem;
    margin-top: 0.5rem;
}
.faq-two-col ul { padding-left: 1.2rem; color: var(--gray-600); line-height: 1.9; }

/* ── HISTORY ─────────────────────────────────────────────────────────────── */
.history-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
    margin: 1.5rem 0;
}
.history-card {
    border-radius: var(--radius);
    border: 1px solid var(--gray-200);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    background: #fff;
    transition: box-shadow var(--transition), transform var(--transition);
}
.history-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.history-card-media {
    height: 165px;
    background-size: cover;
    background-position: center center;
    position: relative;
}
.history-card-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    background: var(--gray-100);
}
.history-card-year { z-index: 1; }
.history-card-media.no-photo {
    background: linear-gradient(135deg, var(--purple-deeper) 0%, var(--purple) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}
.history-card-media.canceled-card {
    background: linear-gradient(135deg, var(--gray-400) 0%, var(--gray-500) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}
.history-card-num-bg {
    font-family: 'Poppins', sans-serif;
    font-weight: 800;
    font-size: 2.4rem;
    color: rgba(255,255,255,0.18);
    letter-spacing: 0.02em;
    user-select: none;
}
.history-card-year {
    position: absolute;
    top: 0.6rem;
    right: 0.75rem;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(4px);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.2rem 0.55rem;
    border-radius: 20px;
}
.history-card-canceled-badge {
    position: absolute;
    top: 0.6rem;
    left: 0.75rem;
    background: var(--gray-600);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.2rem 0.55rem;
    border-radius: 20px;
}
.history-card-body {
    padding: 1rem 1.2rem 1.2rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.history-card-title {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    color: var(--purple-dark);
    font-size: 1rem;
    margin-bottom: 0.15rem;
}
.history-card-dates { font-weight: 600; font-size: 0.95rem; color: var(--text); }
.history-card-church { font-size: 0.84rem; color: var(--gray-500); margin-bottom: 0.6rem; }
.history-card-details { font-size: 0.84rem; color: var(--gray-600); line-height: 1.65; flex: 1; }
.history-card-details p { margin-bottom: 0.25rem; }
.history-card-canceled-reason { font-size: 0.875rem; font-style: italic; color: var(--gray-500); flex: 1; margin-top: 0.25rem; }
.history-links { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.75rem; }
.history-link {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--purple);
    text-decoration: none;
    border: 1px solid rgba(114,48,99,0.3);
    border-radius: 20px;
    padding: 0.2rem 0.7rem;
    transition: background var(--transition), color var(--transition);
    background: var(--purple-pale);
    width: calc(50% - 0.2rem);
    text-align: center;
    box-sizing: border-box;
}
.history-link:hover { background: var(--purple); color: var(--white); }
@media (max-width: 700px) {
    .history-grid { grid-template-columns: 1fr; }
    .history-card-media { height: 140px; }
}

/* Pagination */
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
}
.page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    border: 1px solid var(--gray-200);
    color: var(--purple);
    text-decoration: none;
    font-size: 1.1rem;
    font-weight: 700;
    transition: background var(--transition), border-color var(--transition);
}
.page-btn:hover { background: var(--purple-pale); border-color: var(--purple); }
.page-info { font-size: 0.85rem; color: var(--gray-600); margin: 0 0.5rem; }

/* ── PROMOTION PAGE ──────────────────────────────────────────────────────── */
.promo-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    margin-top: 2rem;
    align-items: start;
}
.promo-item h3 {
    font-family: 'Poppins', sans-serif;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin-bottom: 0.6rem;
}
.promo-item p { color: var(--gray-600); line-height: 1.75; margin-bottom: 1rem; }
.logo-downloads { display: flex; gap: 1.5rem; flex-wrap: wrap; margin-top: 1rem; }
.logo-thumb-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    text-decoration: none;
    color: var(--purple);
    font-size: 0.8rem;
    font-weight: 600;
}
.logo-thumb-link img { border-radius: 6px; border: 1px solid var(--gray-200); }
.logo-thumb-link:hover img { border-color: var(--purple); }

/* ── RESPONSIVE ──────────────────────────────────────────────────────────── */
@media (max-width: 860px) {
    .nav-right { display: none; }
    .nav-hamburger { display: flex; }
    .page-subnav { display: none; }

    .footer-inner { grid-template-columns: 1fr; gap: 1rem; }
    .footer-links { justify-content: flex-start; }

    .info-layout { grid-template-columns: 1fr; }
    .info-sidebar { flex-direction: row; flex-wrap: wrap; }
    .info-card { flex: 1 1 200px; }

    .testimonial-grid { grid-template-columns: 1fr; }

    .council-grid { grid-template-columns: 1fr; gap: 2rem; }
    .promo-grid { grid-template-columns: 1fr; gap: 2rem; }
    .faq-two-col { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    section { padding: 3.5rem 0; }
    .stats-bar { flex-wrap: wrap; }
    .stat-item { flex: 1 1 50%; border-right: none; border-bottom: 1px solid rgba(255,255,255,0.1); }

    .data-table { font-size: 0.78rem; }
    .data-table th { font-size: 0.64rem; padding: 0.45rem 0.5rem; }
    .data-table td { padding: 0.45rem 0.5rem; }
}

/* ── TEAM FORMS PAGE ─────────────────────────────────────────────────────── */
.tf-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.1rem;
}
.tf-card {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: 14px;
    padding: 1.4rem 1.25rem 1.25rem;
    transition: box-shadow 0.18s, transform 0.15s, border-color 0.15s;
}
.tf-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
    border-color: var(--purple-light);
}
.tf-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.25rem;
}
.tf-icon { font-size: 1.75rem; line-height: 1; }
.tf-badge-required {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    background: #fef3c7;
    color: #92400e;
    padding: 0.2rem 0.6rem;
    border-radius: 20px;
}
.tf-title {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin: 0;
}
.tf-desc {
    flex: 1;
    font-size: 0.85rem;
    color: var(--gray-600);
    line-height: 1.5;
    margin: 0;
}
.tf-download-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.4rem;
    padding: 0.5rem 1rem;
    background: var(--purple);
    color: var(--white);
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.15s;
    align-self: flex-start;
}
.tf-download-btn:hover { background: var(--purple-dark); color: var(--white); }
.tf-dl-icon {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
}

@media (max-width: 700px) {
    .tf-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .tf-grid { grid-template-columns: 1fr; }
}

/* ── WEEKEND SCHEDULE ────────────────────────────────────────────────────── */

/* Live indicator dot */
.sched-live-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #4ade80;
    border-radius: 50%;
    margin-right: 0.3rem;
    animation: sched-pulse 2s infinite;
    vertical-align: middle;
}
@keyframes sched-pulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.35; }
}

/* Team tab bar — the mobile analog of the desktop team columns. Sticky so the
   active team stays visible while scrolling a day. Opaque bg + padding-bottom
   (instead of margin) so scrolling rows never show through the pinned bar.
   Its live height is published to --sched-tabs-h (see schedule.php) so the day
   header can pin flush underneath it. */
.sched-tabs {
    display: flex;
    gap: 0.35rem;
    flex-wrap: wrap;
    position: sticky;
    top: calc(var(--nav-height) + var(--subnav-h, 3rem));
    z-index: 30;
    background: var(--white);
    padding-bottom: 0.9rem;
    margin-bottom: 0.6rem;
    box-shadow: 0 5px 8px -6px rgba(0, 0, 0, 0.25);
}
.sched-tab {
    flex: 0 0 calc(50% - 0.175rem);
    padding: 0.5rem 1.1rem;
    border: 1.5px solid var(--gray-300);
    border-radius: 8px;
    background: var(--white);
    color: var(--gray-600);
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.14s, border-color 0.14s, color 0.14s;
    white-space: nowrap;
}
.sched-tab:hover { border-color: var(--purple); color: var(--purple-dark); }
.sched-tab--active,
.sched-tab--active:hover {
    background: var(--purple);
    border-color: var(--purple);
    color: var(--white);
}

/* Panels */
.sched-panel { display: none; }
.sched-panel--active { display: block; }

/* Day section */
.sched-day-section { margin-bottom: 1.75rem; }
.sched-day-hd {
    font-family: 'Poppins', sans-serif;
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--white);
    background: var(--purple);
    padding: 0.4rem 0.9rem;
    border-radius: 8px 8px 0 0;
}

/* Mobile: pin each day's header just under the sticky tab bar. --sched-tabs-h
   is set by JS from the tab bar's live height (it wraps to two rows on narrow
   screens); 5.6rem is a sane fallback before the script runs. */
.sched-mobile .sched-day-hd {
    position: sticky;
    top: calc(var(--nav-height) + var(--subnav-h, 3rem) + var(--sched-tabs-h, 5.6rem));
    z-index: 20;
}

/* Schedule rows */
.sched-row {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    padding: 0.45rem 0.9rem;
    border-bottom: 1px solid var(--gray-100);
    border-left: 1.5px solid var(--gray-200);
    border-right: 1.5px solid var(--gray-200);
    background: var(--white);
    position: relative;
    transition: background 0.12s;
}
.sched-day-section > .sched-row:last-child {
    border-radius: 0 0 8px 8px;
    border-bottom: 1.5px solid var(--gray-200);
}
.sched-row:nth-child(even) { background: var(--gray-50); }
.sched-row:nth-child(even).sched-row--past { background: var(--gray-50); }

/* Past rows */
.sched-row--past .sched-time,
.sched-row--past .sched-activity {
    color: var(--gray-400);
}

/* Upcoming rows */
.sched-row--upcoming .sched-time,
.sched-row--upcoming .sched-activity {
    color: var(--gray-800);
}

.sched-time {
    flex-shrink: 0;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
    min-width: 70px;
    color: var(--gray-500);
}
.sched-row--upcoming .sched-time { color: var(--purple); }

.sched-activity {
    font-size: 0.88rem;
    line-height: 1.45;
    flex: 1;
}

/* "Now" marker on first upcoming row — floats outside the left edge of the row */
.sched-now-marker {
    position: absolute;
    left: -1rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--white);
    background: var(--purple);
    padding: 0.1rem 0.45rem;
    border-radius: 20px;
    white-space: nowrap;
    line-height: 1;
}

/* Desktop vs mobile schedule visibility */
.sched-desktop { display: none; }
.sched-mobile  { display: block; }

@media (min-width: 700px) {
    .sched-desktop { display: block; }
    .sched-mobile  { display: none; }
    .sched-now-marker { left: -1rem; }
}

/* Desktop: 5-column grid header — sticky so the team columns stay labeled
   while scrolling within a day. Sticks within its own .sched-day-section, so
   it also hands off to the next day's header. */
.sched-day-hd--grid {
    display: grid;
    grid-template-columns: 80px 1fr 1fr 1fr 1fr;
    gap: 0;
    font-family: 'Poppins', sans-serif;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--white);
    background: var(--purple);
    padding: 0.4rem 0.9rem;
    border-radius: 8px 8px 0 0;
    position: sticky;
    top: calc(var(--nav-height) + var(--subnav-h, 3rem));
    z-index: 21;
}

/* Day label row between header and data rows — pins just under the column
   header (its ~2.05rem height) so day + teams stay visible together. */
.sched-day-label {
    font-family: 'Poppins', sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--purple);
    background: var(--purple-50, #f3eeff);
    padding: 0.28rem 0.9rem;
    border-left: 1.5px solid var(--gray-200);
    border-right: 1.5px solid var(--gray-200);
    border-bottom: 1px solid var(--gray-100);
    position: sticky;
    top: calc(var(--nav-height) + var(--subnav-h, 3rem) + 2.05rem);
    z-index: 20;
}

/* Desktop data rows */
.sched-grid-row {
    display: grid;
    grid-template-columns: 80px 1fr 1fr 1fr 1fr;
    gap: 0;
    align-items: baseline;
    padding: 0.45rem 0.9rem;
    border-bottom: 1px solid var(--gray-100);
    border-left: 1.5px solid var(--gray-200);
    border-right: 1.5px solid var(--gray-200);
    background: var(--white);
    transition: background 0.12s;
    position: relative;
}
.sched-day-section > .sched-grid-row:last-child {
    border-radius: 0 0 8px 8px;
    border-bottom: 1.5px solid var(--gray-200);
}
.sched-grid-row:nth-child(odd) { background: var(--gray-50); }
.sched-grid-row:nth-child(odd).sched-row--past { background: var(--gray-50); }

/* Past styling for grid rows */
.sched-grid-row.sched-row--past .sched-time,
.sched-grid-row.sched-row--past .sched-col {
    color: var(--gray-400);
}
.sched-grid-row.sched-row--upcoming .sched-time { color: var(--purple); }
.sched-grid-row.sched-row--upcoming .sched-col  { color: var(--gray-800); }

/* Team content cells in desktop rows */
.sched-col {
    font-size: 0.83rem;
    line-height: 1.45;
    padding-right: 0.5rem;
}

/* Print toolbar */
.sched-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 1rem;
}

/* ── Weekend schedule — print: one day per page, all four teams ─────────── */
@media print {
    /* reports.css sets body { overflow: hidden } for single-page reports; this
       page prints across several pages, so it must scroll its own content */
    body.sched-page { overflow: visible !important; }

    .sched-page .photo-strip,
    .sched-page .sched-toolbar,
    .sched-page .sched-mobile,
    .sched-page .sched-now-marker { display: none !important; }

    /* Always print the four-team grid, whatever the screen width was */
    .sched-page .sched-desktop { display: block !important; }

    .sched-page .sched-day-section {
        margin-bottom: 0;
        break-after: page;
    }
    .sched-page .sched-day-section:last-of-type { break-after: auto; }

    /* Keep a day's header rows attached to the first schedule row */
    .sched-page .sched-day-hd--grid,
    .sched-page .sched-day-label { break-after: avoid; }
    .sched-page .sched-grid-row  { break-inside: avoid; }

    /* Past-item graying is a live-retreat screen cue; print everything black */
    .sched-page .sched-grid-row.sched-row--past .sched-time,
    .sched-page .sched-grid-row.sched-row--past .sched-col,
    .sched-page .sched-grid-row.sched-row--upcoming .sched-time,
    .sched-page .sched-grid-row.sched-row--upcoming .sched-col {
        color: #000 !important;
    }

    .sched-page .sched-day-hd--grid,
    .sched-page .sched-day-label,
    .sched-page .sched-grid-row:nth-child(odd) {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}


/* ── PRAYER PARTNER TRACKER ─────────────────────────────────────────────── */

/* Team selector grid */
.ppt-team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
}
.ppt-team-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1.4rem 1rem;
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: 14px;
    text-decoration: none;
    color: var(--gray-800);
    font-weight: 600;
    font-size: 0.9rem;
    text-align: center;
    transition: box-shadow 0.15s, transform 0.15s, border-color 0.15s;
}
.ppt-team-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
    border-color: var(--purple);
    color: var(--purple-dark);
}
.ppt-team-icon { font-size: 2rem; line-height: 1; }
.ppt-svg-icon {
    width: 2rem;
    height: 2rem;
    display: block;
    color: var(--purple);
}
.ppt-team-name { font-size: 0.88rem; }

/* Flash banner */
.ppt-flash {
    padding: 0.75rem 1.1rem;
    border-radius: 10px;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 1.5rem;
}
.ppt-flash--ok { background:#d1fae5; color:#065f46; border:1.5px solid #6ee7b7; }

/* Instructions */
.ppt-instructions {
    display: flex;
    gap: 0.9rem;
    align-items: flex-start;
    background: var(--gray-50);
    border: 1.5px solid var(--gray-200);
    border-radius: 12px;
    padding: 1rem 1.1rem;
    margin-bottom: 1rem;
    font-size: 0.9rem;
    color: var(--gray-700);
    line-height: 1.55;
}
.ppt-instr-icon { font-size: 1.4rem; flex-shrink: 0; margin-top: 1px; }

/* Legend */
.ppt-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    margin-bottom: 1.5rem;
    font-size: 0.82rem;
    color: var(--gray-600);
    align-items: center;
}
.ppt-legend-item { display: flex; align-items: center; gap: 0.4rem; }
.ppt-badge {
    display: inline-block;
    padding: 0.1rem 0.45rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.ppt-badge--new   { background: #fef3c7; color: #92400e; }
.ppt-badge--adult { background: #dbeafe; color: #1e40af; }
.ppt-badge--atl   { background: var(--purple); color: #fff; }

/* Group list */
.ppt-group-list { display: flex; flex-direction: column; gap: 0.6rem; margin-bottom: 1rem; }

.ppt-group-row {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: 12px;
    padding: 0.75rem 0.9rem;
    transition: border-color 0.15s, background 0.15s;
}
.ppt-group-row--filled {
    border-color: #6ee7b7;
    background: #f0fdf4;
}

.ppt-group-num {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    background: var(--purple);
    color: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    margin-top: 1.35rem;
}

.ppt-group-selects {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.6rem;
}

.ppt-select-wrap { display: flex; flex-direction: column; gap: 0.25rem; }
.ppt-select-wrap--third { opacity: 0.7; }
.ppt-select-wrap--third:focus-within { opacity: 1; }

.ppt-select-label {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--gray-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.ppt-select-wrap--third .ppt-select-label { color: var(--gray-400); }

.ppt-select {
    width: 100%;
    padding: 0.4rem 0.5rem;
    border: 1.5px solid var(--gray-300);
    border-radius: 8px;
    font-size: 0.82rem;
    color: var(--gray-800);
    background: var(--white);
    outline: none;
    transition: border-color 0.15s;
}
.ppt-select:focus { border-color: var(--purple); }
.ppt-select:disabled { opacity: 0.4; background: var(--gray-100); cursor: not-allowed; }

/* Sticky save bar */
.ppt-save-bar {
    position: sticky;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
    background: var(--white);

    padding: 0.9rem 1rem;
    margin-top: 1rem;
    z-index: 50;
}
.ppt-save-btn {
    padding: 0.65rem 1.5rem;
    background: var(--purple);
    color: var(--white);
    border: none;
    border-radius: 9px;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.15s;
    white-space: nowrap;
}
.ppt-save-btn:hover { background: var(--purple-dark); }
.ppt-save-hint { font-size: 0.8rem; color: var(--gray-500); }

@media (max-width: 600px) {
    .ppt-group-selects { grid-template-columns: 1fr 1fr; }
    .ppt-select-wrap--third { grid-column: 1 / -1; }
    .ppt-save-hint { display: none; }
}

/* ── LEADERSHIP SELECTION TRACKER ───────────────────────────────────────── */

.lst-flash {
    padding: 0.75rem 1.1rem;
    border-radius: 10px;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 1.5rem;
}
.lst-flash--ok   { background:#d1fae5; color:#065f46; border:1.5px solid #6ee7b7; }
.lst-flash--warn { background:#fef3c7; color:#92400e; border:1.5px solid #fcd34d; }
.lst-flash--err  { background:#fee2e2; color:#991b1b; border:1.5px solid #fca5a5; }

/* Add card */
.lst-card {
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: 14px;
    padding: 1.5rem 1.5rem 1.1rem;
    box-shadow: var(--shadow-sm);
}
.lst-card-hd {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 1.1rem;
}
.lst-card-icon { font-size: 1.25rem; }
.lst-card-title {
    font-family: 'Poppins', sans-serif;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin: 0;
    flex: 1;
}
.lst-tec-badge {
    font-size: 0.75rem;
    font-weight: 700;
    background: var(--purple);
    color: var(--white);
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
}

/* Live search */
.lst-search-wrap {
    position: relative;
    margin-bottom: 0.9rem;
}
.lst-search-input {
    width: 100%;
    box-sizing: border-box;
    padding: 0.55rem 2.2rem 0.55rem 0.85rem;
    border: 1.5px solid var(--gray-300);
    border-radius: 8px;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.15s;
}
.lst-search-input:focus { border-color: var(--purple); }
.lst-search-clear {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    font-size: 1.1rem;
    color: var(--gray-400);
    cursor: pointer;
    padding: 0 0.2rem;
    line-height: 1;
}
.lst-search-clear:hover { color: var(--gray-700); }

/* Add form grid */
.lst-add-grid {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr auto;
    gap: 0.75rem;
    align-items: end;
}
.lst-field { display: flex; flex-direction: column; gap: 0.3rem; }
.lst-field--wide { }
.lst-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gray-600);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.lst-select {
    padding: 0.5rem 0.65rem;
    border: 1.5px solid var(--gray-300);
    border-radius: 8px;
    font-size: 0.88rem;
    color: var(--gray-800);
    background: var(--white);
    outline: none;
    transition: border-color 0.15s;
}
.lst-select:focus { border-color: var(--purple); }

.lst-field--actions { flex-shrink: 0; }
.lst-add-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.lst-check-label {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.88rem;
    color: var(--gray-700);
    white-space: nowrap;
    cursor: pointer;
}
.lst-check-label input[type="checkbox"],
.lst-accepted-label input[type="checkbox"] {
    accent-color: var(--purple);
    width: 15px;
    height: 15px;
    cursor: pointer;
}
.lst-add-btn {
    padding: 0.52rem 1.25rem;
    background: var(--purple);
    color: var(--white);
    border: none;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s;
}
.lst-add-btn:hover { background: var(--purple-dark); }

.lst-legend-note {
    margin: 0.75rem 0 0;
    font-size: 0.75rem;
    color: var(--gray-500);
}

/* Count badge next to heading */
.lst-count-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--gray-700);
    color: var(--white) !important;
    font-size: 0.75rem;
    font-weight: 700;
    min-width: 1.5rem;
    height: 1.5rem;
    border-radius: 20px;
    padding: 0 0.4rem;
    vertical-align: middle;
    margin-left: 0.4rem;
}

/* Team block */
.lst-team-block {
    margin-bottom: 1.75rem;
    border: 1.5px solid var(--gray-200);
    border-radius: 12px;
    overflow: hidden;
}
.lst-team-hd {
    background: var(--purple);
    color: var(--white);
    font-family: 'Poppins', sans-serif;
    font-size: 0.95rem;
    font-weight: 700;
    padding: 0.6rem 1rem;
}
.lst-gender-block { }
.lst-gender-hd {
    background: var(--gray-100);
    color: var(--gray-600);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 0.3rem 1rem;
    border-top: 1px solid var(--gray-200);
    border-bottom: 1px solid var(--gray-200);
}

/* Each row */
.lst-row {
    display: grid;
    grid-template-columns: 2fr 1.2fr 0.8fr 0.9fr auto;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--gray-100);
    background: var(--white);
    transition: background 0.12s;
}
.lst-row:last-child { border-bottom: none; }
.lst-row:hover { background: var(--gray-50); }

.lst-inline-select {
    width: 100%;
    padding: 0.35rem 0.45rem;
    border: 1.5px solid var(--gray-200);
    border-radius: 6px;
    font-size: 0.82rem;
    color: var(--gray-800);
    background: var(--white);
    outline: none;
}
.lst-inline-select:focus { border-color: var(--purple); }

.lst-accepted-label {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.8rem;
    color: var(--gray-600);
    cursor: pointer;
    white-space: nowrap;
}
.lst-accepted-text { }

.lst-row-actions {
    display: flex;
    gap: 0.3rem;
    flex-shrink: 0;
}
.lst-btn-save, .lst-btn-del {
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 0.13s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.lst-btn-save { background: var(--purple); color: #fff; border: none; }
.lst-btn-save:hover { background: var(--purple-dark); }
.lst-btn-del  { background: transparent; color: #888; border: 1.5px solid #d1d5db; }
.lst-btn-del:hover  { background: #fef2f2; color: #b91c1c; border-color: #fca5a5; }

.lst-empty {
    text-align: center;
    color: var(--gray-500);
    font-size: 0.95rem;
    padding: 2.5rem 1rem;
    background: var(--gray-50);
    border-radius: 12px;
    border: 1.5px dashed var(--gray-300);
}

@media (max-width: 720px) {
    .lst-add-grid {
        grid-template-columns: 1fr 1fr;
    }
    .lst-field--wide { grid-column: 1 / -1; }
    .lst-field--actions { grid-column: 1 / -1; }
    .lst-row {
        grid-template-columns: 1fr 1fr;
        gap: 0.4rem;
    }
    .lst-row-name    { grid-column: 1 / -1; }
    .lst-row-actions { grid-column: 1 / -1; justify-content: flex-end; }
}

/* ── INVENTORY TRACKER ───────────────────────────────────────────────────── */

.inv-saved-banner {
    background: #d1fae5;
    color: #065f46;
    border: 1.5px solid #6ee7b7;
    border-radius: 10px;
    padding: 0.75rem 1.1rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.inv-instructions {
    display: flex;
    gap: 0.9rem;
    align-items: flex-start;
    background: var(--gray-50);
    border: 1.5px solid var(--gray-200);
    border-radius: 12px;
    padding: 1rem 1.1rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    color: var(--gray-700);
    line-height: 1.55;
}
.inv-instr-icon { font-size: 1.4rem; flex-shrink: 0; margin-top: 1px; }

/* Quick-jump pills */
.inv-team-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 2rem;
}
.inv-team-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.75rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
    background: var(--gray-100);
    color: var(--gray-700);
    border: 1.5px solid var(--gray-200);
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.inv-team-pill:hover { background: var(--purple-light); border-color: var(--purple); color: var(--purple-dark); }
.inv-team-pill--done { background: #d1fae5; border-color: #6ee7b7; color: #065f46; }
.inv-team-pill-count {
    font-size: 0.7rem;
    background: rgba(0,0,0,0.08);
    border-radius: 20px;
    padding: 0.05rem 0.4rem;
}

/* Team section */
.inv-team-section {
    margin-bottom: 2.25rem;
    scroll-margin-top: 90px;
}
.inv-team-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.7rem 1rem;
    background: var(--purple);
    border-radius: 10px 10px 0 0;
    color: var(--white);
}
.inv-team-name {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    color: var(--white);
}
.inv-team-progress {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-shrink: 0;
}
.inv-progress-label {
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
    opacity: 0.9;
}
.inv-progress-bar {
    width: 80px;
    height: 7px;
    background: rgba(255,255,255,0.25);
    border-radius: 20px;
    overflow: hidden;
}
.inv-progress-fill {
    height: 100%;
    background: #a7f3d0;
    border-radius: 20px;
    transition: width 0.3s ease;
}

/* Item rows */
.inv-item-list {
    border: 1.5px solid var(--gray-200);
    border-top: none;
    border-radius: 0 0 10px 10px;
    overflow: hidden;
}
.inv-item-row {
    display: grid;
    grid-template-columns: 56px 1fr auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.55rem 0.9rem;
    border-bottom: 1px solid var(--gray-100);
    background: var(--white);
    transition: background 0.15s;
}
.inv-item-row:last-child { border-bottom: none; }
.inv-item-row:hover { background: var(--gray-50); }
.inv-item-row--filled { background: #f0fdf4; }
.inv-item-row--filled:hover { background: #dcfce7; }

.inv-item-thumb-link {
    display: block;
    flex-shrink: 0;
    padding: 0;
    border: none;
    background: none;
    cursor: zoom-in;
    border-radius: 8px;
}
.inv-item-thumb {
    width: 52px;
    height: 52px;
    object-fit: cover;
    border-radius: 8px;
    display: block;
    transition: opacity 0.15s, transform 0.15s;
}
.inv-item-thumb-link:hover .inv-item-thumb {
    opacity: 0.85;
    transform: scale(1.05);
}

/* Lightbox */
.inv-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.88);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.5rem;
}
.inv-lightbox--open { display: flex; }
.inv-lightbox-img {
    max-width: min(90vw, 520px);
    max-height: 72vh;
    object-fit: contain;
    border-radius: 12px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.6);
}
.inv-lightbox-caption {
    color: rgba(255,255,255,0.85);
    font-size: 0.95rem;
    font-weight: 500;
    margin: 0;
    text-align: center;
}
.inv-lightbox-close {
    position: absolute;
    top: 1rem;
    right: 1.25rem;
    background: none;
    border: none;
    color: rgba(255,255,255,0.75);
    font-size: 2rem;
    line-height: 1;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    transition: color 0.15s;
}
.inv-lightbox-close:hover { color: #fff; }
.inv-item-thumb-placeholder {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    background: var(--gray-100);
    border-radius: 8px;
    flex-shrink: 0;
}

.inv-item-name {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--gray-800);
}

/* Qty stepper */
.inv-qty-wrap {
    display: flex;
    align-items: center;
    gap: 0;
    flex-shrink: 0;
}
.inv-qty-btn {
    width: 30px;
    height: 36px;
    border: 1.5px solid var(--gray-300);
    background: var(--gray-50);
    color: var(--gray-700);
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    line-height: 1;
    transition: background 0.12s;
    user-select: none;
}
.inv-qty-minus { border-radius: 8px 0 0 8px; border-right: none; }
.inv-qty-plus  { border-radius: 0 8px 8px 0; border-left: none; }
.inv-qty-btn:hover { background: var(--purple-light); color: var(--purple-dark); }
.inv-qty-input {
    width: 58px;
    height: 36px;
    border: 1.5px solid var(--gray-300);
    text-align: center;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--gray-800);
    outline: none;
    -moz-appearance: textfield;
}
.inv-qty-input::-webkit-outer-spin-button,
.inv-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.inv-qty-input:focus { border-color: var(--purple); z-index: 1; }

/* Sticky save bar */
.inv-save-bar {
    position: sticky;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
    background: var(--white);

    padding: 0.9rem 1rem;
    margin-top: 1.5rem;
    z-index: 50;
}
.inv-save-btn {
    padding: 0.65rem 1.5rem;
    background: var(--purple);
    color: var(--white);
    border: none;
    border-radius: 9px;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.15s;
    white-space: nowrap;
}
.inv-save-btn:hover { background: var(--purple-dark); }
.inv-save-hint {
    font-size: 0.8rem;
    color: var(--gray-500);
}

@media (max-width: 560px) {
    .inv-item-row {
        grid-template-columns: 44px 1fr auto;
        gap: 0.5rem;
        padding: 0.5rem 0.6rem;
    }
    .inv-item-thumb, .inv-item-thumb-placeholder { width: 42px; height: 42px; }
    .inv-qty-input { width: 46px; }
    .inv-qty-btn   { width: 26px; }
    .inv-save-hint { display: none; }
    .inv-progress-bar { width: 50px; }
}

/* ── DELEGATION CHECKLIST ────────────────────────────────────────────────── */

/* Toast */
.dc-toast {
    position: fixed;
    bottom: 1.5rem;
    left: 50%;
    transform: translateX(-50%) translateY(0);
    background: #065f46;
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.7rem 1.5rem;
    border-radius: 30px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.25);
    z-index: 9999;
    transition: opacity 0.5s ease, transform 0.5s ease;
    white-space: nowrap;
}
.dc-toast-hide {
    opacity: 0;
    transform: translateX(-50%) translateY(1rem);
}

/* ── Team selector grid ── */
.dc-team-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.85rem;
    margin-top: 0.25rem;
}
.dc-team-card {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 1rem 1.1rem 0.9rem;
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: 12px;
    text-decoration: none;
    color: var(--text);
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.12s;
    position: relative;
    overflow: hidden;
}
.dc-team-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: var(--purple);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.2s ease;
}
.dc-team-card:hover {
    border-color: var(--purple-light);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
    color: var(--text);
}
.dc-team-card:hover::before { transform: scaleX(1); }
.dc-team-name {
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--purple-dark);
}
.dc-team-meta {
    font-size: 0.75rem;
    color: var(--gray-600);
}
.dc-team-arrow {
    position: absolute;
    right: 0.9rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1rem;
    color: var(--gray-200);
    transition: color 0.15s, right 0.15s;
}
.dc-team-card:hover .dc-team-arrow {
    color: var(--purple);
    right: 0.7rem;
}

/* ── Checklist header ── */
.dc-checklist-header {
    margin-bottom: 1.5rem;
}
.dc-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--purple);
    text-decoration: none;
    margin-bottom: 0.75rem;
    opacity: 0.8;
    transition: opacity 0.15s;
}
.dc-back-link:hover { opacity: 1; }
.dc-checklist-title-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}
.dc-tec-badge {
    background: var(--purple);
    color: var(--white);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    white-space: nowrap;
}

/* ── Progress bar ── */
.dc-progress-wrap {
    margin-bottom: 1.75rem;
}
.dc-progress-label {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    font-size: 0.85rem;
    color: var(--gray-600);
    margin-bottom: 0.5rem;
}
.dc-progress-pct {
    margin-left: auto;
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--purple);
}
.dc-progress-track {
    height: 8px;
    background: var(--gray-100);
    border-radius: 10px;
    overflow: hidden;
}
.dc-progress-fill {
    height: 100%;
    background: var(--purple-light);
    border-radius: 10px;
    transition: width 0.3s ease, background 0.3s ease;
    min-width: 0;
}
.dc-progress-fill.dc-progress-mid  { background: #7c3aed; }
.dc-progress-fill.dc-progress-done { background: #059669; }

/* ── Task list ── */
.dc-task-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1.5px solid var(--gray-200);
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 1.25rem;
}
.dc-task-row {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.7rem 1rem;
    background: var(--white);
    border-bottom: 1px solid var(--gray-100);
    transition: background 0.12s;
}
.dc-task-row:last-child { border-bottom: none; }
.dc-task-row:hover { background: var(--gray-50); }

/* Status dot */
.dc-task-dot {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--gray-200);
    border: 2px solid var(--gray-200);
    transition: background 0.2s, border-color 0.2s;
}
.dc-task-filled .dc-task-dot {
    background: #059669;
    border-color: #059669;
}

/* Left accent stripe on filled rows */
.dc-task-row {
    border-left: 3px solid transparent;
    transition: background 0.12s, border-color 0.15s;
}
.dc-task-filled { border-left-color: #059669; }

.dc-task-label {
    flex: 1;
    font-size: 0.9rem;
    color: var(--text);
    cursor: pointer;
    line-height: 1.4;
}
.dc-task-input {
    width: 200px;
    flex-shrink: 0;
    padding: 0.35rem 0.7rem;
    border: 1.5px solid var(--gray-200);
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 0.875rem;
    color: var(--text);
    background: var(--white);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.dc-task-input:focus {
    outline: none;
    border-color: var(--purple-light);
    box-shadow: 0 0 0 3px rgba(114,48,99,0.1);
}
.dc-task-input::placeholder { color: var(--gray-200); }
.dc-task-filled .dc-task-input {
    border-color: #6ee7b7;
    background: #f0fdf4;
}

/* ── Save bar ── */
.dc-save-bar {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0 0.5rem;
}
.dc-unsaved-note {
    font-size: 0.8rem;
    color: #b45309;
    font-weight: 500;
    opacity: 0;
    transition: opacity 0.2s;
}
.dc-unsaved-note.visible { opacity: 1; }


@media (max-width: 700px) {
    .dc-team-grid { grid-template-columns: repeat(2, 1fr); }
    .dc-task-row { gap: 0.5rem; padding: 0.65rem 0.75rem; }
    .dc-task-input { width: 140px; font-size: 0.8rem; }
}
@media (max-width: 480px) {
    .dc-team-grid { grid-template-columns: 1fr; }
    .dc-task-row { flex-wrap: wrap; }
    .dc-task-input { width: 100%; }
    .dc-task-label { flex: 1 1 100%; order: -1; }
    .dc-task-dot { order: -2; }
}

/* ── SUPPORT CHECKLIST ───────────────────────────────────────────────────── */

.sc-flash {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #d1fae5;
    color: #065f46;
    border: 1.5px solid #6ee7b7;
    border-radius: 10px;
    padding: 0.75rem 1.1rem;
    font-weight: 600;
    font-size: 0.92rem;
    margin-bottom: 1.25rem;
}
/* Top bar: save button left, instructions right */
.sc-top-bar {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    margin-bottom: 1.25rem;
}
.sc-top-bar-btn {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    flex-shrink: 0;
    padding-top: 0.1rem; /* optical alignment with first line of text */
}
.sc-instructions {
    font-size: 0.87rem;
    color: var(--gray-600);
    line-height: 1.6;
    margin: 0;
}

/* Scrollable table container */
.sc-table-wrap {
    overflow-x: auto;
    border-radius: 10px;
    border: 1.5px solid var(--gray-200);
    margin-bottom: 1.75rem;
}

/* Table */
.sc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
    min-width: 540px;
}
.sc-table thead {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--purple);
}
.sc-th {
    padding: 0.55rem 0.75rem;
    text-align: left;
    font-family: 'Poppins', sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--white);
    white-space: nowrap;
}
.sc-th-center { text-align: center; }
.sc-th-ro { opacity: 0.75; font-style: italic; cursor: default; }
.sc-th-name { min-width: 160px; }
.sc-th-team { min-width: 110px; }

/* Sort links in headers */
.sc-th-link {
    color: rgba(255,255,255,0.85);
    text-decoration: none;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    transition: color 0.12s;
}
.sc-th-link:hover { color: var(--white); }
.sc-th-active { color: var(--white); }
.sc-sort-arrow { font-size: 0.65rem; margin-left: 0.25rem; }

/* Sort headers are <button>s — strip the native button chrome so they read
   as header labels (the color/typography comes from .sc-th / .sc-th-link) */
.sc-sort-btn {
    background: none;
    border: 0;
    padding: 0;
    margin: 0;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
}

/* Rows */
.sc-row { border-bottom: 1px solid var(--gray-100); }
.sc-row:last-child { border-bottom: none; }
.sc-row:nth-child(even) { background: var(--gray-50); }
.sc-row:hover { background: #f3eeff; }

.sc-td {
    padding: 0.48rem 0.75rem;
    color: var(--gray-700);
    vertical-align: middle;
}
.sc-td-center { text-align: center; }
.sc-td-name { font-weight: 500; color: var(--gray-800); }
.sc-td-team { font-size: 0.82rem; color: var(--gray-600); }
.sc-empty { padding: 1.5rem; text-align: center; color: var(--gray-400); font-style: italic; }

/* Leadership star badge */
.sc-leader-badge {
    color: var(--purple);
    font-size: 0.75rem;
    margin-left: 0.25rem;
    vertical-align: middle;
}

/* Checkboxes */
.sc-check-edit {
    accent-color: var(--purple);
    width: 16px;
    height: 16px;
    cursor: pointer;
}
.sc-check-ro {
    accent-color: var(--purple);
    width: 16px;
    height: 16px;
    pointer-events: none;
    cursor: default;
}

/* Inline AJAX save feedback */
.sc-td-saving .sc-check-edit { opacity: 0.35; }
.sc-td-saved  .sc-check-edit { box-shadow: 0 0 0 3px #4caf5088; transition: box-shadow 1.2s ease; }
.sc-td-error  .sc-check-edit { box-shadow: 0 0 0 3px #f4433688; }

/* Inline save feedback for generic text/number inputs and their containers */
.sc-td-saving input { opacity: 0.5; }
.sc-td-saved  input { box-shadow: 0 0 0 3px #4caf5088; transition: box-shadow 1.2s ease; }
.sc-td-error  input { box-shadow: 0 0 0 3px #f4433688; }

/* Dirty state: text input has been edited but not yet saved (not blurred) */
.dc-input-dirty {
    border-color: #f59e0b !important;
    background-color: #fffdf5 !important;
    box-shadow: 0 0 0 2px #f59e0b44 !important;
}

/* Summary cards grid */
.sc-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.sc-summary-card {
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: 10px;
    padding: 1rem 1.1rem;
}
.sc-summary-hd {
    font-family: 'Poppins', sans-serif;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin: 0 0 0.75rem;
    padding: 0;
}
.sc-summary-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.83rem;
}
.sc-summary-table th {
    text-align: left;
    font-weight: 700;
    color: var(--gray-600);
    padding: 0.2rem 0.5rem 0.35rem 0;
    border-bottom: 1.5px solid var(--gray-200);
    white-space: nowrap;
}
.sc-summary-table td {
    padding: 0.22rem 0.5rem 0.22rem 0;
    color: var(--gray-700);
    border-bottom: 1px solid var(--gray-100);
}
.sc-summary-table tr:last-child td { border-bottom: none; }
.sc-summary-total td {
    font-weight: 700;
    color: var(--gray-800);
    border-top: 1.5px solid var(--gray-300);
    border-bottom: none;
    padding-top: 0.35rem;
}
.sc-summary-note {
    font-size: 0.75rem;
    color: var(--gray-500);
    margin: 0.6rem 0 0;
    line-height: 1.4;
}

/* Bottom save bar */
.sc-save-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1.25rem 0 0.5rem;
}
.sc-save-bar--bottom {
    position: sticky;
    bottom: 0;
    background: var(--white);

    padding: 0.9rem 1rem;
    margin-top: 1.5rem;
    z-index: 50;
}
.sc-save-btn--wide {
    min-width: 200px;
    text-align: center;
}
.sc-save-note {
    font-size: 0.8rem;
    color: #b45309;
    font-weight: 500;
    opacity: 0;
    transition: opacity 0.2s;
}
.sc-unsaved--visible { opacity: 1; }

/* Mobile: Gender hidden; only Name is sticky; every other column shrinks to
   its smallest width and scrolls (behind the pinned Name column) */
@media (max-width: 600px) {
    .sc-col-gender { display: none; }

    /* table-layout: fixed lets us pin exact column widths; the widths sum to
       wider than the viewport so the wrapper's overflow-x: auto kicks in */
    .sc-table {
        table-layout: fixed;
        min-width: 360px;
        width: auto;
    }

    /* Explicit column widths — Name stays readable, the rest are minimal */
    .sc-th-name, .sc-td-name   { width: 140px; }
    .sc-th-team, .sc-td-team   { width: 70px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .sc-col-shirt               { width: 44px; }
    .sc-col-paid                { width: 44px; }
    .sc-col-bgrd                { width: 48px; }
    .sc-col-health              { width: 50px; }

    /* Tighten cell padding to reclaim horizontal space */
    .sc-th, .sc-td { padding-left: 0.45rem; padding-right: 0.45rem; }

    /* Only the Name column is pinned; all other columns scroll behind it */
    .sc-th-name, .sc-td-name {
        position: sticky;
        left: 0;
        z-index: 1;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        box-shadow: 3px 0 5px -1px rgba(0,0,0,0.12);
    }

    /* Name header cell is sticky on both axes → sits above scrolled cells */
    .sc-table thead .sc-th-name { z-index: 3; background: var(--purple); }

    /* Opaque backgrounds so scrolled columns hide behind the pinned Name */
    .sc-td-name { background: var(--white); }
    .sc-row:nth-child(even) .sc-td-name { background: var(--gray-50); }
    .sc-row:hover .sc-td-name { background: #f3eeff; }

    /* Stack the top bar */
    .sc-top-bar { flex-direction: column; gap: 0.75rem; }
}

@media (max-width: 860px) {
    .sc-summary-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
    .sc-summary-grid { grid-template-columns: 1fr; }
}

/* ── Support Checklist — Payment Links send panel ─────────────────────────── */
.pls-view-toggle {
    display: inline-flex;
    margin: 0 0 1.25rem;
    border: 1.5px solid var(--gray-200, #e5e7eb);
    border-radius: 9px;
    overflow: hidden;
}
.pls-tab {
    appearance: none;
    border: 0;
    background: var(--white, #fff);
    color: var(--purple, #723063);
    font: inherit;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 0.5rem 1.1rem;
    cursor: pointer;
}
.pls-tab + .pls-tab { border-left: 1.5px solid var(--gray-200, #e5e7eb); }
.pls-tab-active { background: var(--purple, #723063); color: #fff; }

.pls-intro {
    margin: 0 0 1rem;
    font-size: 0.875rem;
    color: var(--gray-600, #4b5563);
    line-height: 1.55;
}

.pls-filter-bar { margin: 0 0 1rem; }
.pls-filter-bar input {
    width: 100%;
    max-width: 320px;
    box-sizing: border-box;
    padding: 0.5rem 0.75rem;
    border: 1.5px solid var(--gray-200, #e5e7eb);
    border-radius: 8px;
    font: inherit;
    font-size: 0.9rem;
}
.pls-filter-bar input:focus {
    outline: none;
    border-color: #723063;
    box-shadow: 0 0 0 2px rgba(114,48,99,0.15);
}

.pls-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 0.85rem;
}
.pls-card {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 10px;
    overflow: hidden;
    background: var(--white, #fff);
}
.pls-card-hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    background: var(--purple, #723063);
    color: #fff;
    padding: 0.55rem 0.85rem;
}
.pls-name { font-weight: 700; font-size: 0.95rem; }
.pls-card-hd .sc-team-pill { background: rgba(255,255,255,0.22); color: #fff; }
.pls-card-body {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    padding: 0.7rem 0.85rem 0.85rem;
}
.pls-recipients { display: flex; flex-direction: column; gap: 0.5rem; }
.pls-rcpt {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #342e3c;
    cursor: pointer;
}
.pls-rcpt input {
    accent-color: var(--purple);
    width: 16px;
    height: 16px;
    margin-top: 0.1rem;
    flex: 0 0 auto;
    cursor: pointer;
}
.pls-rcpt-text { display: flex; flex-direction: column; line-height: 1.25; }
.pls-rcpt-label { font-weight: 600; }
.pls-email {
    color: var(--gray-500, #6b7280);
    font-size: 0.78rem;
    word-break: break-all;
}
.pls-sent {
    margin-left: auto;
    align-self: center;
    flex: 0 0 auto;
    color: #1f7a32;
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
}
.pls-noemail {
    margin: 0;
    font-size: 0.82rem;
    font-style: italic;
    color: var(--gray-500, #6b7280);
}
.pls-send-btn { align-self: flex-start; padding: 0.4rem 1.1rem; font-size: 0.85rem; }
.pls-all-paid,
.pls-no-results { color: var(--gray-600, #4b5563); font-size: 0.9rem; }

@media (max-width: 600px) {
    .pls-list { grid-template-columns: 1fr; }
    .pls-send-btn { align-self: stretch; text-align: center; }
}

@media (max-width: 480px) {
    .pls-view-toggle { display: flex; flex-wrap: wrap; width: 100%; }
    .pls-tab { flex: 1 1 auto; padding: 0.5rem 0.6rem; font-size: 0.82rem; text-align: center; }
    .pls-tab + .pls-tab { border-left: 1.5px solid var(--gray-200, #e5e7eb); }
}


/* ── SPEAKER REQUEST SHEET (form) ────────────────────────────────────────── */

/* Flash / error banners */
.srs-flash {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background: #d1fae5;
    color: #065f46;
    border: 1.5px solid #6ee7b7;
    border-radius: 10px;
    padding: 0.8rem 1.1rem;
    font-weight: 600;
    font-size: 0.92rem;
    margin-bottom: 1.5rem;
}
.srs-alert {
    background: #fef3c7;
    color: #92400e;
    border: 1.5px solid #fcd34d;
    border-radius: 10px;
    padding: 0.9rem 1.1rem;
    font-size: 0.92rem;
    margin-bottom: 1.5rem;
}

/* Talk info card */
.srs-info-card {
    background: var(--purple);
    border: none;
    border-radius: 10px;
    padding: 1.1rem 1.25rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.srs-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.7rem 1.5rem;
}
.srs-info-item {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
.srs-info-card .srs-info-label {
    color: rgba(255,255,255,0.65);
}
.srs-info-value {
    font-size: 0.92rem;
    font-weight: 600;
    color: #fff;
}
.srs-wheat-notice {
    margin-top: 0.9rem;
    padding: 0.6rem 0.9rem;
    background: #fef3c7;
    border-radius: 7px;
    font-size: 0.88rem;
    color: #92400e;
}

/* Intro paragraphs */
.srs-intro {
    font-size: 0.9rem;
    color: var(--gray-600);
    line-height: 1.6;
    margin-bottom: 0.75rem;
}

/* Form sections */
.srs-section {
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: 10px;
    padding: 1.1rem 1.25rem;
    margin-bottom: 1.25rem;
}
.srs-section-hd {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--purple-dark);
    margin: 0 0 0.4rem;
    padding: 0;
}
.srs-section-desc {
    font-size: 0.88rem;
    color: var(--gray-600);
    line-height: 1.55;
    margin: 0 0 0.85rem;
}
.srs-empty {
    font-size: 0.87rem;
    color: var(--gray-400);
    font-style: italic;
}

/* Checkbox rows */
.srs-check-row {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--gray-100);
    cursor: pointer;
    font-size: 0.88rem;
    color: var(--gray-700);
    line-height: 1.5;
}
.srs-check-row:last-child { border-bottom: none; }
.srs-check-row input[type="checkbox"] {
    accent-color: var(--purple);
    margin-top: 0.2rem;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    cursor: pointer;
}

/* Guest rows */
.srs-guests { display: flex; flex-direction: column; gap: 0.75rem; }
.srs-guest-row {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}
.srs-guest-num {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--purple);
    color: var(--white);
    font-size: 0.75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1.55rem; /* align with input, not label */
}
.srs-guest-fields {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 190px;
    gap: 0.6rem;
}

/* Labelled field group */
.srs-field-group {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.srs-field-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--gray-500);
}

.srs-input {
    padding: 0.52rem 0.75rem;
    border: 1.5px solid var(--gray-400);
    border-radius: 7px;
    font-size: 0.88rem;
    font-family: inherit;
    outline: none;
    width: 100%;
    box-sizing: border-box;
    background: var(--gray-50);
    transition: border-color 0.15s, background 0.15s;
}
.srs-input:focus {
    border-color: var(--purple);
    background: var(--white);
}

/* Textarea */
.srs-textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 0.6rem 0.75rem;
    border: 1.5px solid var(--gray-400);
    border-radius: 7px;
    font-size: 0.88rem;
    font-family: inherit;
    line-height: 1.55;
    resize: vertical;
    outline: none;
    background: var(--gray-50);
    transition: border-color 0.15s, background 0.15s;
}
.srs-textarea:focus {
    border-color: var(--purple);
    background: var(--white);
}

/* Submit bar */
.srs-submit-bar {
    padding: 1rem 0 0.5rem;
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 580px) {
    .srs-guest-fields { grid-template-columns: 1fr; }
    .srs-guest-num { margin-top: 0; align-self: center; }
    .srs-submit-bar { justify-content: stretch; }
    .srs-submit-bar .btn { width: 100%; text-align: center; }
}

/* ── SPEAKER REQUEST SHEETS COMPLETED (view/print) ───────────────────────── */

/* Print button bar */
.src-print-bar {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}
.src-filter-select {
    font-size: 0.88rem;
    padding: 0.35rem 0.6rem;
    border: 1.5px solid var(--gray-300);
    border-radius: 6px;
    color: var(--gray-700);
    background: var(--white);
    cursor: pointer;
}
.src-filter-select:focus { outline: 2px solid var(--purple); outline-offset: 2px; }

.src-tec-label {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--gray-600);
}

/* Individual speaker card */
.src-speaker-card {
    background: var(--white);
    border: 2px solid var(--purple);
    border-radius: 12px;
    margin-bottom: 2.5rem;
    overflow: hidden;
    box-shadow: 0 3px 12px rgba(0,0,0,0.07);
    page-break-after: always;
    break-after: page;
}

/* Card header */
.src-card-hd {
    background: var(--purple);
    padding: 0.85rem 1.25rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}
.src-card-hd-left {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex: 1;
}
.src-logo {
    height: 48px;
    width: auto;
    flex-shrink: 0;
}
.src-card-title {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: rgba(255,255,255,0.75);
    margin-bottom: 0.15rem;
}
.src-card-name {
    font-family: 'Poppins', sans-serif;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--white);
}
.src-talk-title {
    font-size: 0.85rem;
    color: rgba(255,255,255,0.85);
    margin-top: 0.15rem;
}
.src-unassigned {
    font-style: italic;
    opacity: 0.75;
}

/* Talk details row */
.src-details-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.5rem;
    padding: 0.65rem 1.25rem;
    background: var(--gray-50);
    border-bottom: 1px solid var(--gray-200);
    font-size: 0.85rem;
    color: var(--gray-700);
}

/* Guardian Angel fill-in */
.src-angel-row {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    padding: 0.5rem 1.25rem;
    border-bottom: 1px solid var(--gray-200);
    font-size: 0.85rem;
}

.src-angel-line {
    flex: 1;
    border-bottom: 1.5px solid var(--gray-400);
    min-width: 80px;
    margin-top: 2px;
}

/* Three-column personnel row */
.src-personnel-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-bottom: 1px solid var(--gray-200);
}
.src-personnel-col {
    padding: 0.6rem 1.25rem;
    border-right: 1px solid var(--gray-100);
}
.src-personnel-col:last-child { border-right: none; }
.src-personnel-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--gray-500);
    margin-bottom: 0.2rem;
}
.src-personnel-name {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--gray-900);
}

/* Content sections */
.src-section {
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--gray-100);
}
.src-section:last-of-type { border-bottom: none; }
.src-section-hd {
    font-family: 'Poppins', sans-serif;
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--purple-dark);
    margin: 0 0 0.4rem;
    padding: 0;
}
.src-prayup-list {
    margin: 0;
    padding-left: 1.25rem;
    font-size: 0.88rem;
    color: var(--gray-700);
    line-height: 1.6;
}
.src-prayup-list li { margin-bottom: 0.2rem; }
.src-empty {
    font-size: 0.86rem;
    color: var(--gray-400);
    margin: 0;
}

/* Guest grid (2 columns) */
.src-guest-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.35rem 1.5rem;
}
.src-guest-item {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: 0.87rem;
}
.src-guest-name { font-weight: 600; color: var(--gray-800); }
.src-guest-phone { color: var(--gray-500); font-size: 0.82rem; }

/* Body text (Bible verses / prayer requests) */
.src-body-text {
    font-size: 0.88rem;
    color: var(--gray-700);
    line-height: 1.65;
    margin: 0;
}

/* Guardian Angel note footer */
.src-angel-note {
    padding: 0.6rem 1.25rem 0.85rem;
    font-size: 0.82rem;
    color: var(--gray-600);
    background: var(--gray-50);
    border-top: 1px solid var(--gray-200);
    line-height: 1.5;
}

/* Phase dividers (Pray Up / Pray Down labels) */
.src-phase-hd {
    font-family: 'Poppins', sans-serif;
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #fff;
    background: #5b2067;
    padding: 0.3rem 1.25rem;
    margin: 0;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

/* Step / procedural text */
.src-step-text {
    font-size: 0.87rem;
    color: var(--gray-700);
    line-height: 1.65;
    margin: 0.25rem 0;
}
.src-step-list {
    margin: 0.25rem 0;
    padding-left: 1.5rem;
    font-size: 0.87rem;
    color: var(--gray-700);
    line-height: 1.7;
}

/* Checkbox-style checklist */
.src-checklist {
    list-style: none;
    margin: 0.25rem 0;
    padding-left: 0.1rem;
    font-size: 0.87rem;
    color: var(--gray-700);
    line-height: 1.9;
}
.src-checklist li { display: flex; align-items: baseline; gap: 0.5rem; }
.src-checklist li::before { content: '☐'; flex-shrink: 0; color: var(--gray-500); }

/* Read-aloud script blocks */
.src-script-block {
    background: #fffbeb;
    border-left: 3px solid #b45309;
    border-radius: 0 4px 4px 0;
    padding: 0.55rem 0.8rem;
    margin: 0.4rem 0;
    font-style: italic;
    font-size: 0.86rem;
    color: #1a1a1a;
    line-height: 1.65;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}
.src-script-label {
    display: block;
    font-style: normal;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #b45309;
    margin-bottom: 0.2rem;
}

/* Ritual item blocks */
.src-ritual-block {
    border: 1px solid var(--gray-200);
    border-radius: 6px;
    padding: 0.55rem 0.8rem;
    margin-bottom: 0.5rem;
    background: var(--gray-50);
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}
.src-ritual-name {
    font-weight: 700;
    font-size: 0.82rem;
    color: #5b2067;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.2rem;
}
.src-ritual-note {
    font-size: 0.82rem;
    color: var(--gray-600);
    margin-top: 0.35rem;
    line-height: 1.5;
    font-style: italic;
}

/* Selected prayer style blocks */
.src-prayer-block {
    border: 1.5px solid #723063;
    border-radius: 6px;
    padding: 0.5rem 0.8rem;
    margin-bottom: 0.4rem;
    background: #faf5ff;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}
.src-prayer-name {
    font-weight: 700;
    font-size: 0.82rem;
    color: #723063;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.2rem;
}

/* Write-in lines */
.src-write-in-prompt {
    font-size: 0.81rem;
    color: var(--gray-500);
    font-style: italic;
    margin: 0.4rem 0 0.1rem;
}
.src-write-in-line {
    border-bottom: 1px solid var(--gray-400);
    margin: 0.5rem 0;
    min-height: 1.3rem;
}

/* Print styles */
@page { margin: 0.5in; }

@media print {
    .no-print,
    nav, .page-header, .page-subnav, footer,
    .src-print-bar, .photo-strip {
        display: none !important;
    }
    body { font-size: 13pt; color: #000; background: #fff; }
    .src-speaker-card {
        border: 1.5pt solid #723063;
        box-shadow: none;
        margin-bottom: 0;
        break-before: right;
        page-break-before: right;
    }
    .src-card-hd { background: #723063 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .src-logo { height: 36pt; }
    .src-section { padding: 0.4rem 1rem; }
    .src-guest-grid { grid-template-columns: repeat(2, 1fr); }
    section { padding: 0 !important; }
    .section-inner { max-width: 100% !important; padding: 0 !important; }

    /* Pray-Up + Pray-Down Prayer Styles side by side */
    .src-prayer-styles-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        border-bottom: 1px solid var(--gray-100, #f3f4f6);
    }
    .src-prayer-styles-row .src-section {
        border-bottom: none;
        border-right: 1px solid #ccc;
    }
    .src-prayer-styles-row .src-section:last-child {
        border-right: none;
    }

    /* Bible Verses + Prayer Requests side by side */
    .src-verse-prayer-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .src-verse-prayer-row .src-section {
        border-bottom: none;
        border-right: 1px solid #ccc;
    }
    .src-verse-prayer-row .src-section:last-child {
        border-right: none;
    }

    /* Script/guide elements */
    .src-phase-hd { background: #5b2067 !important; }
    .src-script-block { background: #fffbeb !important; page-break-inside: avoid; break-inside: avoid; }
    .src-ritual-block { background: #f9fafb !important; page-break-inside: avoid; break-inside: avoid; }
    .src-prayer-block { background: #faf5ff !important; page-break-inside: avoid; break-inside: avoid; }
    .src-write-in-line { margin: 0.6rem 0; }
}

@media (max-width: 560px) {
    .src-card-hd-left { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
    .src-logo { height: 36px; }
    .src-guest-grid { grid-template-columns: 1fr; }
}

/* ── TABLE COMMISSIONING PLANNER ─────────────────────────────────────────── */

/* Flash banner */
.tcp-flash {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background: #d1fae5;
    color: #065f46;
    border: 1.5px solid #6ee7b7;
    border-radius: 10px;
    padding: 0.75rem 1.1rem;
    font-weight: 600;
    font-size: 0.92rem;
    margin-bottom: 1.5rem;
}

/* Save bars */
.tcp-save-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 1.25rem;
}
.tcp-save-bar--bottom {
    position: sticky;
    bottom: 0;
    background: var(--white);

    padding: 0.9rem 1rem;
    margin-top: 1.5rem;
    margin-bottom: 0;
    z-index: 50;
}
.tcp-save-btn {
    padding: 0.6rem 1.5rem;
    background: var(--purple);
    color: var(--white);
    border: none;
    border-radius: 9px;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    transition: background var(--transition);
    white-space: nowrap;
}
.tcp-save-btn:hover { background: var(--purple-dark); }
.tcp-unsaved-note {
    font-size: 0.8rem;
    color: #b45309;
    font-weight: 500;
    opacity: 0;
    transition: opacity 0.2s;
}
.tcp-unsaved--visible { opacity: 1; }

/* Scrollable table wrapper */
.tcp-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 10px;
    border: 1.5px solid var(--gray-200);
    margin-bottom: 0.5rem;
}

/* Main table */
.tcp-table {
    border-collapse: collapse;
    min-width: 900px;
    width: 100%;
    font-size: 13px;
}

/* Sticky header */
.tcp-thead {
    position: sticky;
    top: 0;
    z-index: 10;
}
.tcp-th {
    background: var(--purple);
    color: var(--white);
    font-weight: 700;
    font-family: 'Poppins', sans-serif;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    padding: 0.6rem 0.75rem;
    text-align: center;
    white-space: nowrap;
    border-right: 1px solid rgba(255,255,255,0.2);
}
.tcp-th:last-child { border-right: none; }
.tcp-th-info {
    text-align: left;
    position: sticky;
    left: 0;
    z-index: 11;
    min-width: 170px;
    border-right: 2px solid rgba(255,255,255,0.35);
}

/* Table info cell */
.tcp-td-info {
    vertical-align: top;
    padding: 10px 12px;
    background: var(--gray-50);
    border-bottom: 1px solid var(--gray-200);
    border-right: 2px solid var(--gray-300);
    min-width: 170px;
    position: sticky;
    left: 0;
    z-index: 2;
}
.tcp-tr:nth-child(even) .tcp-td-info { background: var(--white); }
.tcp-tr:hover .tcp-td-info { background: var(--purple-pale); }

.tcp-info-name {
    font-weight: 700;
    font-size: 14px;
    color: var(--purple-dark);
    line-height: 1.3;
    margin-bottom: 2px;
}
.tcp-info-atl { font-size: 12px; color: var(--gray-700); margin-top: 1px; }
.tcp-info-room,
.tcp-info-phone { font-size: 11px; color: var(--gray-500); margin-top: 1px; }

/* Activity summary list */
.tcp-status-list {
    margin-top: 7px;
    list-style: none;
    padding: 0;
    font-size: 11px;
    line-height: 1.75;
}
.tcp-status-list li { margin: 0; }

/* Step cells (columns 1-6) */
.tcp-td-step {
    vertical-align: top;
    padding: 8px 10px;
    border-right: 1px solid var(--gray-200);
    border-bottom: 1px solid var(--gray-200);
    min-width: 130px;
    background: var(--white);
}
.tcp-tr:nth-child(even) .tcp-td-step { background: var(--gray-50); }
.tcp-tr:hover .tcp-td-step { background: #f9f3ff; }

.tcp-tr:last-child .tcp-td-step,
.tcp-tr:last-child .tcp-td-info,
.tcp-tr:last-child .tcp-td-clean { border-bottom: none; }

/* Step column header label (hidden on desktop, shown on mobile) */
.tcp-step-label {
    display: none;
}

/* Field groups inside step cell */
.tcp-step-field { margin-bottom: 5px; }
.tcp-step-field:last-child { margin-bottom: 0; }
.tcp-field-label {
    display: block;
    font-size: 10px;
    font-weight: 700;
    color: var(--gray-500);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-bottom: 2px;
}
.tcp-select,
.tcp-time-input {
    width: 100%;
    font-size: 12px;
    padding: 4px 6px;
    border: 1.5px solid var(--gray-300);
    border-radius: 5px;
    background: var(--white);
    color: var(--gray-900);
    font-family: 'Inter', sans-serif;
    transition: border-color 0.15s;
}
.tcp-select:focus,
.tcp-time-input:focus {
    outline: none;
    border-color: var(--purple);
    box-shadow: 0 0 0 2px rgba(114,48,99,0.1);
}
.tcp-time-row {
    display: flex;
    align-items: center;
    gap: 4px;
}
.tcp-time-input { flex: 1; min-width: 0; }

/* "Set now" clock button */
.tcp-now-btn {
    background: none;
    border: none;
    padding: 2px 3px;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
    color: var(--gray-400);
    border-radius: 4px;
    position: relative;
    transition: color var(--transition);
    flex-shrink: 0;
}
.tcp-now-btn:hover { color: var(--purple); }

/* Tooltip */
.tcp-now-btn::after {
    content: attr(data-tip);
    position: absolute;
    bottom: 130%;
    left: 50%;
    transform: translateX(-50%);
    background: #333;
    color: #fff;
    padding: 3px 7px;
    border-radius: 4px;
    font-size: 10px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s;
    z-index: 20;
}
.tcp-now-btn:hover::after { opacity: 1; }

/* Live elapsed timer */
.tcp-timer {
    font-size: 11px;
    color: #0d6efd;
    font-variant-numeric: tabular-nums;
    margin-left: 4px;
}

/* Notes textarea */
.tcp-textarea {
    width: 100%;
    font-size: 11px;
    padding: 4px 6px;
    border: 1.5px solid var(--gray-300);
    border-radius: 5px;
    background: var(--white);
    resize: vertical;
    min-height: 42px;
    font-family: 'Inter', sans-serif;
    color: var(--gray-900);
    transition: border-color 0.15s;
}
.tcp-textarea:focus {
    outline: none;
    border-color: var(--purple);
    box-shadow: 0 0 0 2px rgba(114,48,99,0.1);
}

/* Breakout sub-checkboxes */
.tcp-breakout-checks {
    display: none;
    margin-top: 4px;
    padding: 4px 0 2px;
    border-top: 1px dashed var(--gray-200);
}
.tcp-breakout-checks label {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    line-height: 1.7;
    cursor: pointer;
    color: var(--gray-700);
}
.tcp-breakout-checks input[type="checkbox"] {
    accent-color: var(--purple);
    flex-shrink: 0;
}

/* Clean table cell */
.tcp-td-clean {
    vertical-align: middle;
    text-align: center;
    padding: 10px 8px;
    border-bottom: 1px solid var(--gray-200);
    min-width: 56px;
    background: var(--white);
}
.tcp-tr:nth-child(even) .tcp-td-clean { background: var(--gray-50); }
.tcp-tr:hover .tcp-td-clean { background: #f9f3ff; }

.tcp-clean-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--gray-600);
    cursor: pointer;
    font-weight: 600;
}
.tcp-clean-label input[type="checkbox"] {
    accent-color: var(--purple);
    width: 18px;
    height: 18px;
}

/* ── Mobile: card-per-table layout ──────────────────────────────────────── */
@media (max-width: 860px) {
    .tcp-wrap {
        border: none;
        border-radius: 0;
        overflow: visible;
        margin-left: -1.5rem;
        margin-right: -1.5rem;
    }

    .tcp-table {
        display: block;
        min-width: 0;
        width: 100%;
    }
    .tcp-thead { display: none; }
    .tcp-tbody { display: block; }

    /* Each row becomes a card */
    .tcp-tr {
        display: block;
        background: var(--white);
        border: 1.5px solid var(--gray-200);
        border-radius: 12px;
        margin: 0 1.5rem 1.25rem;
        overflow: hidden;
        box-shadow: var(--shadow-sm);
    }

    /* Info cell → purple card header */
    .tcp-td-info {
        display: block;
        position: static;
        background: var(--purple) !important;
        color: var(--white);
        padding: 12px 16px;
        border-right: none;
        border-bottom: none;
        min-width: 0;
        z-index: auto;
    }
    .tcp-info-name { color: var(--white); font-size: 15px; }
    .tcp-info-atl  { color: rgba(255,255,255,0.85); }
    .tcp-info-room,
    .tcp-info-phone { color: rgba(255,255,255,0.7); }

    /* Status summary inline on mobile header */
    .tcp-status-list {
        display: flex;
        flex-wrap: wrap;
        gap: 2px 10px;
        margin-top: 8px;
        font-size: 11px;
        color: rgba(255,255,255,0.9);
    }

    /* Step cells stacked */
    .tcp-td-step {
        display: block;
        background: var(--white) !important;
        border-right: none;
        border-bottom: 1px solid var(--gray-100);
        padding: 10px 16px;
        min-width: 0;
    }

    .tcp-step-label {
        display: block;
        font-size: 11px;
        font-weight: 700;
        color: var(--purple);
        text-transform: uppercase;
        letter-spacing: 0.6px;
        margin: -10px -16px 10px;
        padding: 6px 16px;
        background: #f0e8f5;
        border-bottom: 1px solid #ddd0e8;
    }

    /* On mobile: activity + times side by side */
    .tcp-mobile-row {
        display: flex;
        gap: 8px;
        align-items: flex-start;
        flex-wrap: wrap;
        margin-bottom: 5px;
    }
    .tcp-mobile-activity { flex: 0 0 100%; }
    .tcp-mobile-time     { flex: 1; min-width: 100px; }

    /* Clean cell */
    .tcp-td-clean {
        display: block;
        background: var(--white) !important;
        text-align: left;
        border-bottom: none;
        border-top: 1px solid var(--gray-100);
        padding: 10px 16px;
    }
    .tcp-clean-label {
        flex-direction: row;
        gap: 8px;
        font-size: 13px;
        color: var(--gray-700);
    }
    .tcp-clean-label br { display: none; }
}

/* ── TABLE LEADER EVAL (te-) ─────────────────────────────────────────────── */
.te-instructions {
    color: var(--gray-700);
    margin-bottom: 1.5rem;
    line-height: 1.7;
}
.te-instructions strong { color: var(--text); }

.te-form-card {
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: var(--radius);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: var(--shadow-sm);
}

.te-field-group {
    margin-bottom: 1.25rem;
}
.te-field-label {
    display: block;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--gray-600);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin-bottom: 0.4rem;
}
.te-select {
    width: 100%;
    max-width: 320px;
    padding: 0.5rem 0.75rem;
    border: 1.5px solid var(--gray-400);
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem;
    background: var(--gray-50);
    color: var(--text);
    cursor: pointer;
}
.te-select:focus {
    outline: none;
    border-color: var(--purple);
    box-shadow: 0 0 0 3px rgba(114,48,99,0.12);
}

/* AJAX-loaded member area */
.te-members-wrap {
    margin-top: 0.25rem;
}
.te-no-data {
    color: var(--gray-500);
    font-style: italic;
    padding: 1rem 0;
}
.te-weekender {
    border-top: 1px solid var(--gray-200);
    padding: 1rem 0 0.5rem;
}
.te-weekender:first-child { border-top: none; padding-top: 0; }
.te-weekender-name {
    font-weight: 700;
    font-size: 1rem;
    color: var(--purple-dark);
    margin-bottom: 0.5rem;
}
.te-textarea {
    width: 100%;
    padding: 0.55rem 0.75rem;
    border: 1.5px solid var(--gray-400);
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 0.9rem;
    background: var(--gray-50);
    color: var(--text);
    resize: vertical;
    min-height: 80px;
}
.te-textarea:focus {
    outline: none;
    border-color: var(--purple);
    box-shadow: 0 0 0 3px rgba(114,48,99,0.12);
}
.te-submit-bar {
    display: flex;
    justify-content: center;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--gray-200);
}
.te-submit-btn {
    padding: 0.65rem 2rem;
    background: var(--purple);
    color: var(--white);
    border: none;
    border-radius: 9px;
    font-size: 0.975rem;
    font-weight: 700;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    transition: background var(--transition);
    min-width: 180px;
}
.te-submit-btn:hover { background: var(--purple-dark); }
.te-submit-btn:disabled {
    background: var(--gray-400);
    cursor: default;
}

.te-flash {
    background: #d1fae5;
    border: 1.5px solid #6ee7b7;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    color: #065f46;
    font-weight: 600;
    margin-bottom: 1.5rem;
}
.te-error {
    background: #fef2f2;
    border: 1.5px solid #fca5a5;
    border-radius: 10px;
    padding: 0.85rem 1.25rem;
    color: #991b1b;
    font-weight: 600;
    margin-bottom: 1.25rem;
}
.te-privacy-note {
    font-size: 0.8rem;
    color: var(--gray-600);
    margin-top: 0.5rem;
    font-style: italic;
}

/* ── LEADERSHIP EVAL (tev-) ──────────────────────────────────────────────── */
.tev-flash {
    background: #d1fae5;
    border: 1.5px solid #6ee7b7;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    color: #065f46;
    font-weight: 600;
    margin-bottom: 1.5rem;
}
.tev-error {
    background: #fef2f2;
    border: 1.5px solid #fca5a5;
    border-radius: 10px;
    padding: 0.85rem 1.25rem;
    color: #991b1b;
    font-weight: 600;
    margin-bottom: 1.25rem;
}
.tev-intro {
    color: var(--gray-700);
    margin-bottom: 1.5rem;
    line-height: 1.7;
}
.tev-card {
    background: var(--white);
    border: 1.5px solid var(--gray-200);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    margin-bottom: 1.5rem;
}
.tev-card-hd {
    background: var(--purple);
    border-bottom: 1.5px solid var(--purple-dark);
    padding: 0.85rem 1.25rem;
}
.tev-card-hd h3 {
    margin: 0;
    font-size: 0.975rem;
    font-weight: 700;
    color: var(--white);
}
.tev-card-hd p {
    margin: 0.25rem 0 0;
    font-size: 0.78rem;
    color: rgba(255,255,255,0.8);
}
.tev-card-body {
    padding: 1.25rem;
}
.tev-field-label {
    display: block;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--gray-600);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin-bottom: 0.4rem;
}
.tev-select-lg {
    width: 100%;
    max-width: 340px;
    padding: 0.5rem 0.75rem;
    border: 1.5px solid var(--gray-400);
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem;
    background: var(--gray-50);
    color: var(--text);
}
.tev-select-lg:focus {
    outline: none;
    border-color: var(--purple);
    box-shadow: 0 0 0 3px rgba(114,48,99,0.12);
}
/* Recommendation grid */
.tev-rec-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}
.tev-rec-col-hd {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--purple);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 0.6rem;
}
.tev-rec-col-note {
    font-size: 0.75rem;
    color: var(--gray-500);
    font-style: italic;
    margin-bottom: 0.6rem;
}
.tev-rec-row {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 0.3rem;
}
.tev-rec-num {
    font-size: 0.72rem;
    color: var(--gray-400);
    width: 1.1rem;
    text-align: right;
    flex-shrink: 0;
}
.tev-select {
    flex: 1;
    min-width: 0;
    padding: 0.28rem 0.45rem;
    border: 1.5px solid var(--gray-300);
    border-radius: 6px;
    font-family: 'Inter', sans-serif;
    font-size: 0.82rem;
    background: var(--gray-50);
    color: var(--text);
}
.tev-select:focus {
    outline: none;
    border-color: var(--purple);
    box-shadow: 0 0 0 2px rgba(114,48,99,0.10);
}
/* Textareas */
.tev-desc {
    font-size: 0.875rem;
    color: var(--gray-600);
    line-height: 1.65;
    margin-bottom: 0.85rem;
}
.tev-textarea {
    width: 100%;
    padding: 0.55rem 0.75rem;
    border: 1.5px solid var(--gray-400);
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 0.9rem;
    background: var(--gray-50);
    color: var(--text);
    resize: vertical;
}
.tev-textarea:focus {
    outline: none;
    border-color: var(--purple);
    box-shadow: 0 0 0 3px rgba(114,48,99,0.12);
}
/* General comments */
.tev-comment-box {
    border: 1.5px solid var(--gray-200);
    border-radius: 9px;
    padding: 0.85rem 1rem;
    margin-bottom: 0.75rem;
    background: var(--gray-50);
}
.tev-comment-hd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}
.tev-comment-label {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--gray-700);
}
.tev-comment-del {
    font-size: 0.75rem;
    color: var(--gray-500);
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.15rem 0.5rem;
    border-radius: 5px;
    font-family: 'Inter', sans-serif;
}
.tev-comment-del:hover { color: #991b1b; background: #fef2f2; }
.tev-add-btn {
    margin-top: 0.5rem;
    padding: 0.45rem 1.1rem;
    background: transparent;
    border: 1.5px solid var(--purple);
    color: var(--purple);
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    transition: background var(--transition), color var(--transition);
}
.tev-add-btn:hover { background: var(--purple); color: var(--white); }
/* Submit bar */
.tev-submit-bar {
    display: flex;
    justify-content: center;
    padding: 1.5rem 0 0.5rem;
}
.tev-submit-btn {
    padding: 0.7rem 2.5rem;
    background: var(--purple);
    color: var(--white);
    border: none;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 700;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    transition: background var(--transition);
    min-width: 220px;
}
.tev-submit-btn:hover { background: var(--purple-dark); }

/* 2-column card grid for recommendation pairs */
.tev-cards-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}
.tev-cards-grid .tev-card {
    margin-bottom: 0;
}

@media (max-width: 640px) {
    .tev-rec-grid    { grid-template-columns: 1fr; }
    .tev-cards-grid  { grid-template-columns: 1fr; }
}

/* ── TABLE INFORMATION EDITOR (tie-) ────────────────────────────────────── */
.tie-flash {
    background: #d1fae5;
    border: 1.5px solid #6ee7b7;
    color: #065f46;
    border-radius: 10px;
    padding: 0.75rem 1.1rem;
    font-weight: 600;
    font-size: 0.92rem;
    margin-bottom: 1.5rem;
}
.tie-field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
.tie-field-label {
    display: block;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--gray-500);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 0.3rem;
}
.tie-input {
    width: 100%;
    padding: 0.45rem 0.65rem;
    border: 1.5px solid var(--gray-300);
    border-radius: 7px;
    font-size: 0.92rem;
    font-family: 'Inter', sans-serif;
    color: var(--gray-800);
    background: var(--white);
    box-sizing: border-box;
    transition: border-color var(--transition);
}
.tie-input:focus {
    outline: none;
    border-color: var(--purple);
}
@media (max-width: 480px) {
    .tie-field-row { grid-template-columns: 1fr; }
}


/* ── COMMON TEAMS (ct-) ─────────────────────────────────────────────────── */
.ct-form-card {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e4dfe4;
    box-shadow: 0 2px 8px rgba(114,48,99,.08);
    padding: 1.5rem;
    max-width: 680px;
    margin: 1.5rem auto 0;
}
.ct-people {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1.25rem;
}
.ct-person-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.45rem;
}
.ct-person-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: #6b6578;
}
/* Remove (×) buttons only matter above the two-person minimum. */
.ct-people:not(.ct-removable) .ct-remove-person { display: none; }
.ct-remove-person {
    border: none;
    background: none;
    color: #a05a8f;
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
    padding: 0 0.25rem;
    border-radius: 6px;
}
.ct-remove-person:hover { color: #4e1f44; background: #f3e9f1; }
.ct-add-row { margin-top: 1rem; }
.ct-add-person {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.9rem;
    background: #fff;
    border: 1.5px dashed var(--purple);
    color: var(--purple);
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
}
.ct-add-person:hover { background: #f9f5f9; }
.ct-add-person[hidden] { display: none; }
.ct-filter-row {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
}
.ct-filter-input {
    flex: 1;
    min-width: 0;
    padding: 0.4rem 0.6rem;
    border: 1.5px solid #e4dfe4;
    border-radius: 8px;
    font-size: 0.8rem;
    font-family: 'Inter', sans-serif;
    color: #1a1020;
    box-sizing: border-box;
}
.ct-filter-input:focus { outline: none; border-color: var(--purple); }
.ct-filter-btn {
    padding: 0.45rem 0.7rem;
    background: var(--purple);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    white-space: nowrap;
    flex-shrink: 0;
}
.ct-filter-btn:hover { background: #4e1f44; }
.ct-select {
    width: 100%;
    padding: 0.4rem 0.6rem;
    border: 1.5px solid #e4dfe4;
    border-radius: 8px;
    font-size: 0.8rem;
    font-family: 'Inter', sans-serif;
    color: #1a1020;
    background: #fff;
    box-sizing: border-box;
}
.ct-select:focus { outline: none; border-color: var(--purple); }
.ct-member-count {
    font-size: 0.7rem;
    color: #9b8fa8;
    margin-top: 0.3rem;
}
.ct-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #f2eff2;
    gap: 1rem;
}
.ct-same-team-label {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: #4e1f44;
    cursor: pointer;
}
.ct-same-team-label input[type="checkbox"] {
    accent-color: var(--purple);
}
.ct-search-btn {
    padding: 0.55rem 1.4rem;
    background: var(--purple);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    transition: background 0.2s;
    white-space: nowrap;
}
.ct-search-btn:hover { background: #4e1f44; }

/* Results */
.ct-results-heading {
    font-size: 0.95rem;
    color: #4e1f44;
    margin: 2rem 0 1rem;
    text-align: center;
}
.ct-results-heading em {
    font-style: normal;
    font-weight: 700;
    color: #1a1020;
}
.ct-table-wrap {
    width: fit-content;      /* size to the table's content… */
    max-width: 100%;         /* …but never past the section, then scroll */
    margin: 0 auto;
    overflow-x: auto;
}
.ct-table {
    width: 100%;
    min-width: 860px;        /* floor: the pre-multi-person width */
    border-collapse: collapse;
    font-size: 0.875rem;
}
.ct-table thead tr {
    background: var(--purple);
    color: #fff;
}
.ct-table th {
    padding: 0.6rem 1rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    text-align: left;
    white-space: nowrap;
}
.ct-table tbody tr {
    border-bottom: 1px solid #f0ecf0;
}
.ct-table tbody tr:hover {
    background: #faf7fa;
}
.ct-table td {
    padding: 0.55rem 1rem;
    vertical-align: middle;
}
.ct-col-tec {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 1rem;
    color: var(--purple);
    white-space: nowrap;
}
.ct-col-date {
    white-space: nowrap;
    color: #555;
    font-size: 0.8rem;
}
.ct-team-pill {
    display: inline-block;
    font-size: 0.68rem;
    font-weight: 600;
    padding: 2px 9px;
    border-radius: 99px;
    border: 1.5px solid var(--purple);
    color: var(--purple);
    background: #f9f5f9;
    white-space: nowrap;
    min-width: 6rem;
    text-align: center;
}
.ct-col-church {
    color: #333;
}
.ct-church-city {
    color: #999;
    font-size: 0.8rem;
    margin-left: 0.35rem;
}
.ct-empty {
    text-align: center;
    color: #888;
    font-style: italic;
    padding: 2.5rem 0;
}

@media (max-width: 560px) {
    .ct-people { grid-template-columns: 1fr; }
    .ct-controls { flex-direction: column; align-items: stretch; }
    .ct-search-btn { text-align: center; }

    /* Drop the desktop width floor so the card layout fits the phone. */
    .ct-table-wrap { width: auto; }
    .ct-table { min-width: 0; }

    /* Collapse table into labeled cards */
    .ct-table thead { display: none; }
    .ct-table tbody tr {
        display: block;
        border: 1px solid #e4dfe4;
        border-radius: 10px;
        margin-bottom: 0.75rem;
        padding: 0.5rem 0.75rem;
        box-shadow: 0 1px 4px rgba(114,48,99,.06);
    }
    .ct-table td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.35rem 0;
        border-bottom: 1px solid #f5f2f5;
        font-size: 0.82rem;
    }
    .ct-table td:last-child { border-bottom: none; }
    .ct-table td::before {
        content: attr(data-label);
        font-size: 0.68rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.07em;
        color: #9b8fa8;
        flex-shrink: 0;
        margin-right: 0.75rem;
    }
    .ct-col-tec { font-size: 0.95rem; }
}

/* ── ACCEPTED LEADERSHIP (al-) ───────────────────────────────────────────── */
.al-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
    margin-top: 1.5rem;
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 700px) {
    .al-grid { grid-template-columns: repeat(2, 1fr); }
}

.al-card {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.al-card-header {
    background: var(--purple);
    color: #fff;
    padding: 0.65rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}
.al-card-header h3 {
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.3;
}
.al-badge {
    background: rgba(255,255,255,.22);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 99px;
    white-space: nowrap;
    flex-shrink: 0;
}

.al-members {
    list-style: none;
    margin: 0;
    padding: 0.5rem 0;
    flex: 1;
}
.al-members li {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.35rem 1rem;
    font-size: 0.85rem;
    color: #333;
    line-height: 1.3;
    border-bottom: 1px solid #f0eaf3;
}
.al-members li:last-child {
    border-bottom: none;
}

.al-avatar-icon {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    color: var(--purple);
    opacity: 0.55;
}

.al-summary {
    max-width: 860px;
    margin-top: 1.75rem;
    margin-left: auto;
    margin-right: auto;
    padding: 0.75rem 1.1rem;
    background: #f6f0f5;
    border-left: 4px solid var(--purple);
    border-radius: 0 6px 6px 0;
    font-size: 0.85rem;
    color: #555;
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}
.al-summary strong {
    color: var(--purple);
}

@media (max-width: 480px) {
    .al-grid { grid-template-columns: 1fr; }
}

/* ── AC ELIGIBILITY (acs-) ───────────────────────────────────────────────── */
.acs-criteria {
    background: #f6f0f5;
    border-left: 4px solid var(--purple);
    border-radius: 0 6px 6px 0;
    padding: 1rem 1.25rem;
    margin-bottom: 2rem;
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
}
.acs-criteria-heading {
    margin: 0 0 0.5rem;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--purple);
}
.acs-criteria-list {
    margin: 0 0 0.75rem;
    padding-left: 1.25rem;
    font-size: 0.875rem;
    color: #444;
    line-height: 1.7;
}
.acs-criteria-note {
    margin: 0;
    font-size: 0.8rem;
    color: #666;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.acs-star {
    color: var(--purple);
    font-size: 0.8rem;
    margin-right: 4px;
    vertical-align: middle;
    opacity: 0.75;
}

.acs-section {
    max-width: 860px;
    margin: 0 auto 2rem;
}
.acs-section-heading {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #888;
    margin: 0 0 0.5rem;
    padding-bottom: 0.4rem;
    border-bottom: 2px solid #e8dded;
}

.acs-table-wrap {
    overflow-x: auto;
}
.acs-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}
.acs-table thead th {
    text-align: center;
    padding: 7px 10px;
    background: var(--purple);
    color: #fff;
    font-weight: 600;
    font-size: 0.75rem;
    white-space: nowrap;
}
.acs-th-name {
    text-align: left !important;
}
.acs-table tbody tr {
    border-bottom: 1px solid #f0eaf3;
}
.acs-table tbody tr:last-child {
    border-bottom: none;
}
.acs-table tbody tr:nth-child(even) td {
    background: #faf7fb;
}
.acs-row-exp td {
    background: #fff8f0 !important;
}
.acs-table td {
    padding: 6px 10px;
    vertical-align: middle;
}
.acs-num {
    text-align: center;
    color: #555;
}
.acs-name-link {
    color: inherit;
    text-decoration: none;
}
.acs-name-link:hover {
    text-decoration: underline;
    color: var(--purple);
}
.acs-name-exp {
    font-weight: 600;
}

/* ── TEAM MEMBER PAGE (tm-) ──────────────────────────────────────────────── */

/* Two-column layout */
.tm-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1.5rem 5rem;
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 1.75rem;
    align-items: start;
}

/* Sidebar */
.tm-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    position: sticky;
    top: 76px;
}

/* Cards */
.tm-card {
    background: var(--white);
    border-radius: 12px;
    border: 1px solid #e4dfe4;
    box-shadow: 0 2px 8px rgba(114,48,99,.08);
}
.tm-card-head {
    padding: 0.9rem 1.2rem;
    border-bottom: 1px solid #f2eff2;
    border-radius: 12px 12px 0 0;
}
.tm-card-head h3 {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b6578;
    margin: 0;
}
.tm-card-body {
    padding: 1rem 1.2rem;
}

/* Filter */
.tm-filter-row {
    display: flex;
    gap: 0.5rem;
    width: 100%;
    box-sizing: border-box;
}
.tm-filter-input {
    flex: 1;
    padding: 0.55rem 0.85rem;
    border: 1.5px solid #e4dfe4;
    border-radius: 8px;
    font-size: 0.875rem;
    font-family: 'Inter', sans-serif;
    color: #1a1020;
    transition: border-color 0.22s ease;
}
.tm-filter-input:focus {
    outline: none;
    border-color: var(--purple);
}
.tm-filter-btn {
    padding: 0.55rem 0.85rem;
    background: var(--purple);
    color: var(--white);
    border: none;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.22s ease;
    font-family: 'Inter', sans-serif;
}
.tm-filter-btn:hover { background: #4e1f44; }
.tm-filtered-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: #f5eef3;
    color: #4e1f44;
    border-radius: 20px;
    padding: 0.15rem 0.65rem;
    font-size: 0.75rem;
    font-weight: 600;
    margin-top: 0.5rem;
}
.tm-filtered-tag a {
    color: var(--purple);
    text-decoration: none;
    font-weight: 700;
}

/* Member dropdown */
.tm-member-select {
    width: 100%;
    padding: 0.6rem 0.85rem;
    border: 1.5px solid #e4dfe4;
    border-radius: 8px;
    font-size: 0.875rem;
    font-family: 'Inter', sans-serif;
    color: #1a1020;
    background: var(--white);
    cursor: pointer;
    transition: border-color 0.22s ease;
}
.tm-member-select:focus {
    outline: none;
    border-color: var(--purple);
}
.tm-member-count {
    font-size: 0.75rem;
    color: #6b6578;
    margin-top: 0.4rem;
}

/* Detail panel */
.tm-detail {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Empty state */
.tm-empty {
    background: var(--white);
    border-radius: 12px;
    border: 1px solid #e4dfe4;
    padding: 3.5rem 2rem;
    text-align: center;
    color: #6b6578;
}
.tm-empty-icon { font-size: 2.5rem; margin-bottom: 0.75rem; }
.tm-empty h3 {
    color: #4e1f44;
    margin-bottom: 0.5rem;
    font-family: 'Poppins', sans-serif;
}

/* Profile card */
.tm-profile-body {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
}
.tm-profile-photo {
    width: 150px;
    height: 180px;
    border-radius: 10px;
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
    border: 3px solid #f2eff2;
}
.tm-profile-info { flex: 1; }
.tm-profile-name {
    font-family: 'Poppins', sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    color: #1a1020;
    line-height: 1.2;
    margin-bottom: 0.6rem;
}
.tm-info-row {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
    margin-bottom: 0.35rem;
    font-size: 0.875rem;
    color: #6b6578;
}
.tm-info-row .tm-label {
    font-weight: 600;
    color: #1a1020;
    min-width: 90px;
    flex-shrink: 0;
}
.tm-info-row a { color: var(--purple); text-decoration: none; }
.tm-info-row a:hover { text-decoration: underline; }
.tm-pill {
    display: inline-block;
    background: #f5eef3;
    color: #4e1f44;
    border-radius: 20px;
    padding: 0.15rem 0.7rem;
    font-size: 0.78rem;
    font-weight: 600;
}

/* Stats */
.tm-stats-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}
.tm-stat-box {
    background: var(--white);
    border-radius: 12px;
    border: 1px solid #e4dfe4;
    padding: 1rem;
    text-align: center;
    box-shadow: 0 2px 8px rgba(114,48,99,.08);
}
.tm-sv {
    font-family: 'Poppins', sans-serif;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--purple);
    line-height: 1;
}
.tm-sl {
    font-size: 0.72rem;
    color: #6b6578;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-top: 0.2rem;
}
.tm-stat-warn .tm-sv { color: #b45309; }
.tm-stat-muted .tm-sv { color: #6b6578; }

/* Team badges */
.tm-teams-wrap { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.tm-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
    background: #f3f4f6;
    color: #374151;
}
.tm-badge-count { font-size: 0.78rem; color: #6b6578; margin-right: 0.4rem; }
.tm-badge--filter {
    -webkit-appearance: none;
    appearance: none;
    font-family: inherit;
    border: 2px solid #723063;
    background: #fff;
    color: #723063;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    transition: background 0.15s, color 0.15s;
}
.tm-badge--filter:hover { background: #f5eef3; }
.tm-badge--filter.active { background: #723063; color: #fff; }
.tm-badge-count-inline {
    background: rgba(114,48,99,0.15);
    border-radius: 10px;
    padding: 0 5px;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.4;
}
.tm-badge--filter.active .tm-badge-count-inline { background: rgba(255,255,255,0.25); }
/* Weekend history & Leadership history tables — team badges all purple */
#tm-leadership-table .tm-badge,
#tm-weekend-table .tm-badge {
    background: #f5eef3;
    color: #723063;
}
.tm-badge--support  { background: #e8f4fd; color: #1a6fa8; }
.tm-badge--kitchen  { background: #fef3e2; color: #b45309; }
.tm-badge--wheat    { background: #fefce8; color: #a16207; }
.tm-badge--music    { background: #f0fdf4; color: #166534; }
.tm-badge--ac       { background: #fdf4ff; color: #7e22ce; }
.tm-badge--sd       { background: #fff1f2; color: #9f1239; }
.tm-badge--atl      { background: #eff6ff; color: #1d4ed8; }
.tm-badge--ytl      { background: #f0fdfa; color: #0f766e; }
.tm-badge--rector   { background: #faf5ff; color: #6b21a8; }
.tm-badge--photo    { background: #fff7ed; color: #c2410c; }

/* Data table */
.tm-table-wrap { overflow-x: auto; }
.tm-data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}
.tm-data-table thead th {
    background: #faf9fa;
    color: #6b6578;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
    padding: 0.55rem 0.75rem;
    text-align: left;
    border-bottom: 1px solid #e4dfe4;
    white-space: nowrap;
}
.tm-th-center { text-align: center !important; }
.tm-data-table tbody td {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid #f2eff2;
    vertical-align: middle;
}
.tm-data-table tbody tr:last-child td { border-bottom: none; }
.tm-data-table tbody tr:hover td { background: #faf9fa; }
.tm-row-dimmed td { opacity: 0.4; }
.tm-check { color: var(--purple); font-size: 1rem; }
.tm-tec-num { font-weight: 700; color: #1a1020; }
.tm-tec-year { font-size: 0.75rem; color: #6b6578; display: block; }
.tm-col-location { cursor: pointer; }
.tm-col-location:active { background: #f5eef3; }
.tm-col-short { display: none; }
.tm-footnote {
    font-size: 0.78rem;
    color: #6b6578;
    font-style: italic;
    padding: 0.5rem 1.2rem 1rem;
    margin: 0;
}

/* Location overlay */
#tm-loc-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}
#tm-loc-overlay.open { display: flex; }
#tm-loc-box {
    background: #fff;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    max-width: 320px;
    width: 100%;
    box-shadow: 0 12px 40px rgba(0,0,0,.3);
    font-size: 0.95rem;
    text-align: center;
    line-height: 1.5;
}
.tm-loc-tec {
    font-family: 'Poppins', sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    color: #4e1f44;
    margin-bottom: 0.3rem;
}
.tm-loc-dates { font-size: 0.9rem; color: var(--purple); font-weight: 600; margin-bottom: 0.4rem; }
.tm-loc-place { font-size: 0.9rem; color: #6b6578; }
.tm-loc-dismiss {
    margin-top: 1rem;
    display: inline-block;
    padding: 0.45rem 1.25rem;
    background: var(--purple);
    color: #fff;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    border: none;
    font-family: 'Inter', sans-serif;
}

/* Responsive */
@media (max-width: 1024px) {
    .tm-wrap { grid-template-columns: 1fr; }
    .tm-sidebar { position: static; }
}
@media (max-width: 560px) {
    .tm-wrap { padding: 1rem 1rem 3rem; }
    .tm-profile-body { flex-direction: column; }
    .tm-stats-row { grid-template-columns: 1fr 1fr; }
    .tm-data-table { font-size: 0.78rem; }
    .tm-data-table thead th { font-size: 0.65rem; padding: 0.45rem 0.5rem; }
    .tm-data-table tbody td { padding: 0.45rem 0.5rem; }
    .tm-col-full { display: none; }
    .tm-col-short { display: inline; }
}

/* ── COUNCIL EMAILS (ce-) ────────────────────────────────────────────────── */
.ce-list {
    max-width: 680px;
    margin: 1.75rem auto 1.5rem;
    border: 1px solid #e4dfe4;
    border-radius: 12px;
    overflow: hidden;
}
.ce-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.9rem 1.25rem;
    border-bottom: 1px solid #f0ecf0;
    transition: background var(--transition);
}
.ce-row:last-child { border-bottom: none; }
.ce-row:hover { background: #faf8fa; }

.ce-avatar {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--purple);
    color: var(--white);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ce-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
.ce-name {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ce-position {
    font-size: 0.78rem;
    color: #9b8fa8;
}
.ce-email {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.82rem;
    color: var(--purple);
    text-decoration: none;
    white-space: nowrap;
    transition: color var(--transition);
}
.ce-email:hover { color: var(--dark); }
.ce-email svg { flex-shrink: 0; }

.ce-count {
    max-width: 680px;
    margin: 0 auto;
    text-align: right;
    font-size: 0.78rem;
    color: #b0a4bb;
}

@media (max-width: 560px) {
    .ce-row { flex-wrap: wrap; gap: 0.6rem 1rem; padding: 0.85rem 1rem; }
    .ce-email {
        flex-basis: 100%;
        padding-left: 52px; /* avatar width + gap */
        font-size: 0.78rem;
    }
}

/* ── LEADERSHIP LIST (ld-) ───────────────────────────────────────────────── */
.ld-wrap {
    max-width: 680px;
    margin: 1.75rem auto 0;
    border: 1px solid #e4dfe4;
    border-radius: 12px;
    overflow: hidden;
}
.ld-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

/* Header row */
.ld-table thead tr {
    background: #f7f4f7;
}
.ld-table thead th {
    padding: 0.6rem 0.9rem;
    text-align: left;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #9b8fa8;
    border-bottom: 1px solid #e4dfe4;
    white-space: nowrap;
}
.ld-table thead th a {
    color: inherit;
    text-decoration: none;
    transition: color var(--transition);
}
.ld-table thead th a:hover,
.ld-table thead th.ld-sort-active a { color: var(--purple); }

/* Team section header rows */
.ld-table .ld-team-header td {
    padding: 0.45rem 0.9rem;
    background: var(--purple);
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.ld-table .ld-team-header:first-child td { border-top: none; }

/* Data rows */
.ld-table tbody tr:not(.ld-team-header) {
    border-bottom: 1px solid #f0ecf0;
    transition: background var(--transition);
}
.ld-table tbody tr:not(.ld-team-header):last-child { border-bottom: none; }
.ld-table tbody tr:not(.ld-team-header):hover { background: #faf8fa; }

.ld-table td {
    padding: 0.55rem 0.9rem;
    color: var(--dark);
}

/* Youth (bold) */
.ld-youth td { font-weight: 700; }

/* Inline checkbox + name label */
.ld-first-label {
    display: flex;
    align-items: center;
    gap: 1.1rem;
    cursor: pointer;
}
.ld-check {
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    accent-color: var(--purple);
    cursor: pointer;
}

/* Column widths */
.ld-col-team  { width: 34%; }
.ld-col-first { width: 33%; }
.ld-col-last  { width: 33%; }

/* Summary line */
.ld-summary {
    max-width: 680px;
    margin: 0.5rem auto 0;
    text-align: right;
    font-size: 0.78rem;
    color: #b0a4bb;
}

@media (max-width: 480px) {
    .ld-col-team { display: none; }
    .ld-team-header td { font-size: 0.82rem; }
}

/* ── FIRST-TIME TEAM PHOTOS (ftt-) ──────────────────────────────────────── */
.ftt-count {
    text-align: center;
    font-size: 0.8rem;
    color: var(--gray-400);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin: 1rem 0 1.5rem;
}
.ftt-empty {
    text-align: center;
    color: var(--gray-500);
    padding: 3rem 0;
}

/* Grid of pair-cards */
.ftt-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 1.25rem;
    max-width: 1100px;
    margin: 0 auto 2.5rem;
}

/* Individual pair card */
.ftt-card {
    display: flex;
    align-items: stretch;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--transition);
}
.ftt-card:hover { box-shadow: var(--shadow-md); }

/* Each half of the card */
.ftt-side {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.1rem 0.9rem 1rem;
    gap: 0.15rem;
}
.ftt-side--first  { background: var(--purple-pale); }
.ftt-side--mentor { background: var(--white); }

/* Role label */
.ftt-role-label {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: var(--purple);
    margin-bottom: 0.5rem;
}

/* Photo */
.ftt-photo-wrap {
    width: 140px;
    height: 168px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
    background: var(--gray-100);
    margin-bottom: 0.2rem;
}
.ftt-photo-wrap--sm {
    width: 60px;
    height: 72px;
    border-radius: 6px;
}
.ftt-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

/* Name & meta */
.ftt-name {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--gray-800);
    text-align: center;
}
.ftt-meta {
    font-size: 0.75rem;
    color: var(--gray-500);
    text-align: center;
}
.ftt-team {
    font-size: 0.72rem;
    color: var(--purple);
    font-weight: 600;
}

/* Mentor item — stacked vertically, same as first-timer side */
.ftt-mentor-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
    width: 100%;
}
.ftt-mentor-item + .ftt-mentor-item {
    border-top: 1px solid var(--gray-200);
    margin-top: 0.75rem;
    padding-top: 0.75rem;
}

/* Vertical divider between the two halves */
.ftt-divider {
    width: 1px;
    background: var(--gray-200);
    flex-shrink: 0;
}

@media (max-width: 480px) {
    .ftt-grid { grid-template-columns: 1fr; }
    .ftt-card { flex-direction: column; }
    .ftt-divider { width: auto; height: 1px; }
}

/* ── WEEKENDERS BY TABLE PHOTOS (pwt-) ──────────────────────────────────── */
.pwt-empty {
    text-align: center;
    color: var(--gray-500);
    padding: 3rem 0;
}

/* Table section */
.pwt-section {
    padding: 0;
    margin-bottom: 0.6rem;
    max-width: 824px;
    margin-left: auto;
    margin-right: auto;
}
.pwt-section:first-of-type { margin-top: 1.75rem; }
.pwt-section:last-of-type  { margin-bottom: 2rem; }

/* Section header */
.pwt-section-header {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.55rem 1rem;
    background: var(--purple);
    border-radius: 10px 10px 0 0;
}
.pwt-table-name {
    font-size: 0.95rem;
    font-weight: 700;
    color: #ffffff;
    flex: 1;
}
.pwt-breakout {
    font-size: 0.72rem;
    font-weight: 600;
    color: rgba(255,255,255,0.7);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.pwt-count {
    font-size: 0.75rem;
    font-weight: 700;
    background: rgba(255,255,255,0.2);
    color: #ffffff;
    border-radius: 20px;
    padding: 0.1rem 0.55rem;
}

/* Photo grid */
.pwt-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-top: none;
    border-radius: 0 0 10px 10px;
}
.pwt-person {
    width: 150px;
}

/* Individual person */
.pwt-person {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    flex-shrink: 0;
}
.pwt-photo-wrap {
    width: 100%;
    aspect-ratio: 3 / 4;
    border-radius: 8px;
    overflow: hidden;
    background: var(--gray-100);
}
.pwt-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}
.pwt-name {
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--gray-700);
    text-align: center;
    line-height: 1.3;
}
.pwt-name a {
    color: inherit;
    text-decoration: none;
}
.pwt-name a:hover { color: var(--purple); }
.pwt-leader { font-weight: 700; color: var(--purple); }
.pwt-photo-wrap a { display: block; width: 100%; height: 100%; }
.pwt-photo-wrap a:hover img { opacity: 0.85; }

@media (max-width: 480px) {
    .pwt-grid { gap: 0.65rem; }
    .pwt-person { width: 90px; }
}

/* ── PRAYER PARTNERS (pp-) ───────────────────────────────────────────────── */

/* ── Team selection ── */
.pp-select-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: #9b8fa8;
    max-width: 720px;
    margin: 1.75rem auto 0.6rem;
}
.pp-select-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.65rem;
    max-width: 720px;
    margin: 0 auto 2.5rem;
}
.pp-select-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
    padding: 0.85rem 1rem;
    background: var(--white);
    border: 1px solid #e4dfe4;
    border-radius: 10px;
    text-decoration: none;
    transition: border-color var(--transition), box-shadow var(--transition);
}
.pp-select-card:hover {
    border-color: var(--purple);
    box-shadow: 0 2px 8px rgba(114,48,99,.12);
}
.pp-select-name {
    font-weight: 700;
    font-size: 1rem;
    color: var(--purple);
}
.pp-select-sub {
    font-size: 0.75rem;
    color: #9b8fa8;
}

@media (max-width: 560px) {
    .pp-select-cards { grid-template-columns: repeat(2, 1fr); }
}

/* ── Results: back link ── */
.pp-back-row {
    max-width: 680px;
    margin: 1.25rem auto 0.75rem;
}
.pp-back {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--purple);
    text-decoration: none;
    opacity: 0.7;
    transition: opacity var(--transition);
}
.pp-back:hover { opacity: 1; }

/* ── Results: card grid ── */
.pp-cards-wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.65rem;
    max-width: 720px;
    margin: 0 auto;
}
.pp-card {
    background: var(--white);
    border: 1px solid #e4dfe4;
    border-radius: 10px;
    padding: 0.65rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}
.pp-card-trio {
    border-top: 3px solid var(--purple);
}

/* Each member row within a card */
.pp-member {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}
.pp-member + .pp-member {
    padding-top: 0.45rem;
    border-top: 1px solid #f2eef2;
}

/* Initials avatar */
.pp-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #ece4f0;
    color: var(--purple);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    flex-shrink: 0;
}
.pp-member-new .pp-avatar {
    background: var(--purple);
    color: var(--white);
}

/* Name + tag */
.pp-info {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}
.pp-name {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2;
}
.pp-member-new .pp-name { font-weight: 700; }
.pp-new-tag {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--purple);
    line-height: 1;
}

/* Empty / summary */
.pp-empty {
    max-width: 720px;
    margin: 2rem auto;
    text-align: center;
    color: #9b8fa8;
    font-size: 0.9rem;
}
.pp-summary {
    max-width: 720px;
    margin: 0.5rem auto 2rem;
    text-align: right;
    font-size: 0.78rem;
    color: #b0a4bb;
}

@media (max-width: 560px) {
    .pp-cards-wrap { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 360px) {
    .pp-cards-wrap { grid-template-columns: 1fr; }
}


/* ── REGISTRATIONS (reg-) ────────────────────────────────────────────────── */

/* Toolbar */
.reg-toolbar {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
    margin: 1.75rem auto 0.75rem;
    max-width: 820px;
}

/* TEC selector */
.reg-tec-form { display: flex; align-items: center; gap: 0.4rem; }
.reg-tec-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #9b8fa8;
}
.reg-tec-sel {
    padding: 0.35rem 0.6rem;
    border: 1.5px solid #d9cfdf;
    border-radius: 7px;
    font-size: 0.88rem;
    color: var(--dark);
    background: var(--white);
    cursor: pointer;
}
.reg-tec-sel:focus { outline: 2px solid var(--purple); border-color: transparent; }

/* Filter buttons */
.reg-filters { display: flex; gap: 0.4rem; }
.reg-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    border: 1.5px solid #d9cfdf;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #7a6b88;
    text-decoration: none;
    background: var(--white);
    transition: background var(--transition), border-color var(--transition), color var(--transition);
}
.reg-filter-btn:hover { border-color: var(--purple); color: var(--purple); }
.reg-filter-btn.active {
    background: var(--purple);
    border-color: var(--purple);
    color: var(--white);
}
.reg-count {
    font-size: 0.7rem;
    font-weight: 700;
    background: rgba(255,255,255,.25);
    border-radius: 10px;
    padding: 0.05rem 0.35rem;
}
.reg-filter-btn:not(.active) .reg-count {
    background: #ede8f0;
    color: #9b8fa8;
}

/* Table */
.reg-table-wrap {
    border: 1px solid #e4dfe4;
    border-radius: 12px;
    overflow: hidden;
    overflow-x: auto;
    margin-bottom: 2rem;
    max-width: 820px;
    margin-left: auto;
    margin-right: auto;
}
.reg-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}
.reg-table thead tr { background: #f7f4f7; }
.reg-table thead th {
    padding: 0.6rem 0.9rem;
    text-align: left;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #9b8fa8;
    border-bottom: 1px solid #e4dfe4;
    white-space: nowrap;
}
.reg-table thead th a {
    color: inherit;
    text-decoration: none;
    transition: color var(--transition);
}
.reg-table thead th a:hover,
.reg-table thead th a.active { color: var(--purple); }

.reg-table tbody tr {
    border-bottom: 1px solid #f0ecf0;
    transition: background var(--transition);
}
.reg-table tbody tr:last-child { border-bottom: none; }
.reg-table tbody tr:hover { background: #faf8fa; }
.reg-table td { padding: 0.5rem 0.9rem; color: var(--dark); vertical-align: middle; }
.reg-table td a { color: var(--purple); text-decoration: none; }
.reg-table td a:hover { text-decoration: underline; }

/* Fixed-layout table so columns always align */
.reg-table { table-layout: fixed; }

/* Column widths */
.reg-col-type    { width: 50px; }
.reg-col-date    { width: 76px; white-space: nowrap; font-size: 0.8rem; color: #9b8fa8; }
.reg-col-name    { overflow: hidden; }
.reg-col-choices { width: 230px; }
.reg-date-mobile { display: none; font-size: 0.72rem; color: #9b8fa8; margin-top: 0.15rem; }

/* Pills */
.reg-pills-desktop,
.reg-pills-mobile { display: flex; flex-wrap: wrap; gap: 0.25rem; }
.reg-pills-mobile { display: none; margin-top: 0.3rem; }

.reg-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.6rem;
    padding: 0.15rem 0.25rem;
    border-radius: 4px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    background: #ede8f2;
    color: #6b4f82;
}
/* Per-team colours */
.reg-pill-ac      { background: #f0e8f5; color: var(--purple); }
.reg-pill-sd      { background: #e8f0f5; color: #3a6b8f; }
.reg-pill-kitchen,
.reg-pill-k       { background: #fef3e2; color: #a06020; }
.reg-pill-support,
.reg-pill-s       { background: #eaf5ea; color: #2d7a3a; }
.reg-pill-wheat,
.reg-pill-w       { background: #fdf6e3; color: #8a7020; }
.reg-pill-music,
.reg-pill-m       { background: #e8eaf8; color: #3a45a0; }
.reg-pill-atl     { background: #fce8f0; color: #a03060; }
.reg-pill-ytl     { background: #fce8f0; color: #a03060; }

/* Type badge */
.reg-type-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: 0.7rem;
    font-weight: 800;
}
.reg-type-youth { background: #eaf0fb; color: #3a6abf; }
.reg-type-adult { background: #f0ebf7; color: var(--purple); }

/* Empty state */
.reg-empty {
    margin: 2rem 0;
    text-align: center;
    color: #9b8fa8;
    font-size: 0.9rem;
}

@media (max-width: 540px) {
    .reg-toolbar { gap: 0.75rem; }
    .reg-col-choices { width: 130px; }
    .reg-col-date { display: none; }
    .reg-col-name { overflow: hidden; }
    .reg-date-mobile { display: block; }
    .reg-pills-mobile { display: none; }
}

/* Weekender-specific columns */
.reg-col-name-wknd { width: 200px; overflow: hidden; }
.reg-col-city      { width: 140px; overflow: hidden; }
.reg-col-flag      { width: 40px; text-align: center; }
.reg-col-cb        { text-align: center; }

/* Canceled rows */
.reg-row-canceled td { opacity: 0.45; }

/* Count badges */
.reg-counts { display: flex; align-items: center; gap: 0.5rem; }
.reg-count-badge {
    display: inline-block;
    padding: 0.25rem 0.65rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 700;
    background: #f0ebf7;
    color: var(--purple);
}
.reg-count-canceled {
    background: #fdf0f0;
    color: #b03030;
}

/* Parent two-column layout inside rc-card-wide */
.rc-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}
.reg-mobile-meta {
    display: none;
    font-size: 0.75rem;
    color: #9b8fa8;
    margin-top: 0.15rem;
}
.reg-mobile-date {
    margin-left: 0.4rem;
    opacity: 0.75;
}

@media (max-width: 540px) {
    .rc-two-col { grid-template-columns: 1fr; }
    .reg-col-city { display: none; }
    .reg-mobile-meta { display: block; }
}

/* ── REGISTRATION FORM (rform-) ─────────────────────────────────────────── */
.rform-dev-banner {
    background: #fff3cd;
    border: 1.5px solid #f0c040;
    border-radius: 8px;
    padding: 0.6rem 1rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: #7a5c00;
    margin-bottom: 1.25rem;
}
.rform-notice {
    background: #fdf0f0;
    border: 1.5px solid #f0c0c0;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    font-size: 0.88rem;
    color: #8b1a1a;
    margin-bottom: 1.25rem;
}
.rform-intro {
    font-size: 0.9rem;
    color: #6b5b78;
    margin-bottom: 1.5rem;
}

/* Cards */
.rform-card {
    background: var(--white);
    border: 1.5px solid #e4dfe4;
    border-radius: 14px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}
.rform-card-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--purple);
    margin: 0 0 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.rform-card-desc {
    font-size: 0.85rem;
    color: #6b5b78;
    margin: 0 0 1.1rem;
}

/* Grids */
.rform-grid { display: grid; gap: 1rem; }
.rform-grid-1 { grid-template-columns: 1fr; }
.rform-grid-2 { grid-template-columns: 1fr 1fr; }
.rform-grid-3 { grid-template-columns: 1fr 1fr 1fr; }
.rform-grid-2-1-1 { grid-template-columns: 2fr 1fr 1fr; }
.rform-grid-city { grid-template-columns: 1fr auto auto; }
.rform-span-2 { grid-column: span 2; }

/* Fields */
.rform-field { display: flex; flex-direction: column; gap: 0.3rem; }
.rform-label {
    font-size: 0.78rem;
    font-weight: 600;
    color: #5a4a66;
}
.rform-optional { font-weight: 400; color: #9b8fa8; }
.rform-input,
.rform-select,
.rform-textarea {
    padding: 0.5rem 0.7rem;
    border: 1.5px solid #d9cfdf;
    border-radius: 8px;
    font-size: 0.88rem;
    font-family: inherit;
    color: var(--dark);
    background: var(--white);
    transition: border-color 0.15s;
}
.rform-input:focus,
.rform-select:focus,
.rform-textarea:focus {
    outline: none;
    border-color: var(--purple);
}
.rform-textarea { resize: vertical; }

/* Team descriptions */
.rform-team-descs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid #ede8ed;
}
.rform-team-desc {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 0.1rem 0.5rem;
    background: #faf8fc;
    border-radius: 8px;
    padding: 0.65rem 0.8rem;
}
.rform-team-name {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--purple);
}
.rform-team-count {
    font-size: 0.72rem;
    color: #9b8fa8;
    white-space: nowrap;
    text-align: right;
}
.rform-team-text {
    grid-column: 1 / -1;
    font-size: 0.8rem;
    color: #5a4a66;
    line-height: 1.4;
}

/* Agreement blocks */
.rform-agreement-block { margin-bottom: 1.5rem; }
.rform-agreement-block:last-child { margin-bottom: 0; }
.rform-content-box {
    border: 1.5px solid #e4dfe4;
    border-radius: 10px;
    padding: 1rem 1.1rem;
    margin-bottom: 0.75rem;
    font-size: 0.83rem;
    line-height: 1.55;
    color: #3a3040;
}
.rform-content-box h3.rform-content-title {
    font-size: 0.88rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--purple);
    margin: 0 0 0.6rem;
}
.rform-content-box h4 { font-size: 0.83rem; margin: 0.75rem 0 0.25rem; }
.rform-content-box h5 { font-size: 0.8rem;  margin: 0.6rem 0 0.2rem; }
.rform-content-box p  { margin: 0.4rem 0; }
.rform-content-box ol,
.rform-content-box ul { margin: 0.4rem 0; padding-left: 1.4rem; }
.rform-content-box li { margin-bottom: 0.25rem; }

.rform-check-row {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    flex-wrap: wrap;
}
.rform-check-link {
    font-size: 0.82rem;
    white-space: nowrap;
    color: var(--purple);
}
.rform-check-link:hover { text-decoration: underline; }
.rform-check-label {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    font-size: 0.85rem;
    color: var(--dark);
    cursor: pointer;
    line-height: 1.5;
}
.rform-check-label input[type="checkbox"] {
    margin-top: 0.15rem;
    accent-color: var(--purple);
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    cursor: pointer;
}

/* Submit card */
.rform-submit-card p { font-size: 0.88rem; color: #5a4a66; margin: 0 0 0.6rem; }
.rform-notice-inline { color: #5a1a1a !important; }

/* Page-level h2 above cards */
.rform-page-title { margin: 0 0 1.25rem; font-size: 1.25rem; color: #3d2a52; }

/* Small hint text under a label */
.rform-field-hint { font-size: 0.78rem; color: #9b8fa8; margin: 0; }

/* Inset nested card (e.g. parent 1/2 inside parent card) */
.rform-card-inset {
    background: #f9f7fb;
    border: 1px solid #e8e0f0;
    padding: 1rem 1.25rem;
    margin: 0;
}

@media (max-width: 768px) {
    .rform-grid-city  { grid-template-columns: 1fr; }
    .rform-span-2   { grid-column: span 1; }
}

@media (max-width: 600px) {
    .rform-grid-2   { grid-template-columns: 1fr; }
    .rform-grid-3     { grid-template-columns: 1fr; }
    .rform-grid-2-1-1 { grid-template-columns: 1fr; }
    .rform-team-descs { grid-template-columns: 1fr; }
    .rform-card { padding: 1rem; }
}

/* ── YOUTH LEADERSHIP (yl-) ─────────────────────────────────────────────── */
/* Toolbar */
.yl-toolbar {
    display: flex;
    align-items: center;
    gap: 1rem;
    max-width: 520px;
    margin: 1.75rem auto 0.75rem;
}
.yl-filter-form { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.yl-filter-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #9b8fa8;
}
.yl-filter-select {
    padding: 0.35rem 0.6rem;
    border: 1.5px solid #d9cfdf;
    border-radius: 7px;
    font-size: 0.88rem;
    color: var(--dark);
    background: var(--white);
    cursor: pointer;
    margin-right: 0.5rem;
}
.yl-filter-select:focus { outline: 2px solid var(--purple); border-color: transparent; }
.yl-filter-count {
    font-size: 0.78rem;
    color: #9b8fa8;
    white-space: nowrap;
}

/* Card grid */
.yl-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
    max-width: 520px;
    margin: 0 auto 0.5rem;
}

.yl-card {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.9rem;
    padding: 0.75rem;
    border-radius: 12px;
    border: 1px solid #e4dfe4;
    background: #fff;
    text-decoration: none;
    color: var(--dark);
    transition: box-shadow 0.15s, border-color 0.15s;
}
.yl-card:hover { box-shadow: 0 3px 12px rgba(114,48,99,0.1); border-color: #c4a8bc; }
.yl-tier-2 { background: #f5f0fb; border-left: 4px solid #9b4a87; }
.yl-tier-3 { background: #edf2fb; border-left: 4px solid #3a6abf; }
.yl-tier-4 { background: #fdf0f0; border-left: 4px solid #b83030; }

.yl-card-photo {
    width: 70px;
    height: 84px;
    border-radius: 8px;
    background-size: cover;
    background-position: center;
    border: 2px solid #f2eff2;
    flex-shrink: 0;
}
.yl-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}
.yl-card-name {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--purple-dark);
    line-height: 1.3;
    margin-bottom: 0.2rem;
}
.yl-card-total {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--purple);
    line-height: 1;
}
.yl-card-total-label {
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #9b8fa8;
    margin-top: 0.15rem;
    margin-bottom: 0.5rem;
}
.yl-card-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.yl-badge {
    font-size: 0.68rem;
    font-weight: 700;
    padding: 0.18rem 0.5rem;
    border-radius: 999px;
    white-space: nowrap;
    letter-spacing: 0.03em;
}
.yl-badge-overall { background: #f0e8f5; color: var(--purple-dark); }
.yl-badge-support { background: #e6f0fb; color: #2a5f9e; }
.yl-badge-wheat   { background: #fdf5e0; color: #8a6200; }
.yl-badge-kitchen { background: #e8f5ec; color: #2a6e3f; }
.yl-badge-music   { background: #fce8ef; color: #8a2040; }

.yl-empty {
    padding: 2rem;
    text-align: center;
    color: #9b8fa8;
    font-size: 0.9rem;
}
.yl-note {
    font-size: 0.78rem;
    color: #9b8fa8;
    margin-bottom: 2rem;
}

/* ── WEEKENDS WORKED (ww-) ──────────────────────────────────────────────── */
.ww-toolbar {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 1.75rem auto 1rem;
    max-width: 680px;
}
.ww-filter-form { display: flex; align-items: center; gap: 0.4rem; }
.ww-filter-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #9b8fa8;
}
.ww-filter-select {
    padding: 0.35rem 0.6rem;
    border: 1.5px solid #d9cfdf;
    border-radius: 7px;
    font-size: 0.88rem;
    color: var(--dark);
    background: var(--white);
    cursor: pointer;
}
.ww-filter-select:focus { outline: 2px solid var(--purple); border-color: transparent; }
.ww-count {
    font-size: 0.78rem;
    color: #9b8fa8;
}

/* Card grid */
.ww-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
    gap: 0.75rem;
    max-width: 720px;
    margin: 0 auto 2rem;
}

.ww-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem 0.75rem 0.85rem;
    border-radius: 12px;
    border: 1px solid #e4dfe4;
    background: #fff;
    text-decoration: none;
    color: var(--dark);
    position: relative;
    transition: box-shadow 0.15s, border-color 0.15s;
}
.ww-card:hover { box-shadow: 0 3px 12px rgba(114,48,99,0.1); border-color: #c4a8bc; }

.ww-card-rank {
    position: absolute;
    top: 0.5rem;
    left: 0.6rem;
    font-size: 0.65rem;
    font-weight: 700;
    color: #b8a8b8;
}
.ww-card-name {
    font-size: 0.84rem;
    font-weight: 600;
    text-align: center;
    color: var(--purple-dark);
    margin-bottom: 0.6rem;
    line-height: 1.3;
}
.ww-card-count {
    font-size: 2.1rem;
    font-weight: 800;
    color: var(--purple);
    line-height: 1;
}
.ww-card-label {
    font-size: 0.63rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #9b8fa8;
    margin-top: 0.2rem;
}

.ww-rank-1 { background: #fffbea; border-color: #ddc84a; }
.ww-rank-2 { background: #f7f7f9; border-color: #b8b8c8; }
.ww-rank-3 { background: #fff5ee; border-color: #d4a882; }
.ww-rank-1 .ww-card-count { color: #a07808; }
.ww-rank-2 .ww-card-count { color: #707080; }
.ww-rank-3 .ww-card-count { color: #a86030; }
.ww-rank-1 .ww-card-rank  { color: #c8a020; }
.ww-rank-2 .ww-card-rank  { color: #909090; }
.ww-rank-3 .ww-card-rank  { color: #b87848; }

.ww-empty {
    padding: 2rem;
    text-align: center;
    color: #9b8fa8;
    font-size: 0.9rem;
}

/* ── TEAM LEADERSHIP HISTORY (tlh-) ─────────────────────────────────────── */
.tlh-wrap {
    margin: 1.75rem 0 0.5rem;
    border: 1px solid #e4dfe4;
    border-radius: 12px;
    overflow: hidden;
    overflow-x: auto;
}
.tlh-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
    min-width: 640px;
}
.tlh-table thead tr {
    background: var(--purple);
    color: var(--white);
}
.tlh-table thead th {
    padding: 0.55rem 0.75rem;
    text-align: left;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    white-space: nowrap;
}
.tlh-table tbody tr {
    border-bottom: 1px solid #f0ecf0;
}
.tlh-table tbody tr:last-child { border-bottom: none; }
.tlh-stripe { background: #faf7fa; }
.tlh-table td {
    padding: 0.3rem 0.75rem;
    color: var(--dark);
    vertical-align: top;
}
.tlh-col-tec {
    width: 52px;
    font-weight: 700;
    font-size: 0.8rem;
    color: var(--purple);
    white-space: nowrap;
}
.tlh-incomplete {
    font-size: 0.65rem;
    color: #b0a4bb;
    vertical-align: super;
    margin-left: 1px;
}
.tlh-note {
    font-size: 0.75rem;
    color: #b0a4bb;
    margin: 0.4rem 0 2rem;
}

/* ── REGISTRATION COMPLETE / VIEW (rc-) ──────────────────────────────────── */

/* Back row */
.rc-back-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 1.5rem 0 1rem;
    flex-wrap: wrap;
}
.rc-back {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--purple);
    text-decoration: none;
    opacity: 0.75;
    transition: opacity var(--transition);
}
.rc-back:hover { opacity: 1; }
.rc-tec-badge {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #9b8fa8;
    background: #f2eef7;
    border-radius: 20px;
    padding: 0.2rem 0.65rem;
}

/* Card grid layout */
.rc-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 2rem;
}
.rc-card {
    background: var(--white);
    border: 1px solid #e4dfe4;
    border-radius: 12px;
    padding: 1.1rem 1.25rem;
}
.rc-card-wide { grid-column: 1 / -1; }
.rc-section-title {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: #9b8fa8;
    margin: 0 0 0.85rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0ecf0;
}

/* Field list */
.rc-fields { display: flex; flex-direction: column; gap: 0.45rem; }
.rc-field {
    display: flex;
    gap: 0.75rem;
    font-size: 0.86rem;
    line-height: 1.4;
}
.rc-label {
    flex-shrink: 0;
    width: 120px;
    font-weight: 600;
    color: #9b8fa8;
    font-size: 0.78rem;
    padding-top: 0.05rem;
}
.rc-value { color: var(--dark); }

/* Team choices */
.rc-choices {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.rc-choice-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.88rem;
}
.rc-choice-num {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--purple);
    color: var(--white);
    font-size: 0.65rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.rc-choice-name { color: var(--dark); font-weight: 500; }

/* Subsections (prose blocks) */
.rc-subsection { margin-top: 0.85rem; }
.rc-sub-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #9b8fa8;
    margin: 0 0 0.35rem;
}
.rc-prose {
    font-size: 0.86rem;
    color: var(--dark);
    line-height: 1.6;
    margin: 0;
    white-space: pre-wrap;
}
.rc-empty-field { font-size: 0.85rem; color: #b0a4bb; margin: 0; }

/* Talks */
.rc-talks { display: flex; flex-direction: column; gap: 0.45rem; }
.rc-talk {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.86rem;
    color: #9b8fa8;
}
.rc-talk-checked { color: var(--dark); }
.rc-talk-indicator {
    width: 20px;
    text-align: center;
    font-weight: 700;
    color: #ccc;
    flex-shrink: 0;
}
.rc-talk-checked .rc-talk-indicator { color: #4a9a5a; }
.rc-talk a { color: var(--purple); text-decoration: none; }
.rc-talk a:hover { text-decoration: underline; }

/* Agreements */
.rc-agreements { display: flex; flex-direction: column; gap: 0.55rem; }
.rc-agreement {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    font-size: 0.86rem;
    color: var(--dark);
}
.rc-yes { color: #4a9a5a; font-weight: 700; font-size: 0.82rem; flex-shrink: 0; }
.rc-no  { color: #c05050; font-weight: 700; font-size: 0.82rem; flex-shrink: 0; }

@media (max-width: 640px) {
    .rc-layout { grid-template-columns: 1fr; }
    .rc-card-wide { grid-column: 1; }
}

.rc-error {
    max-width: 480px;
    margin: 3rem auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
}
.rc-error-msg {
    font-size: 0.95rem;
    color: #7a6b88;
    line-height: 1.6;
    margin: 0;
}

/* ══════════════════════════════════════════════════════════════════════════
   UPCOMING RETREATS PAGE
   ══════════════════════════════════════════════════════════════════════════ */
/* ── RETREAT CARD ────────────────────────────────────────────────────────── */
.retreat-card {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow-md);
    margin-bottom: 2.5rem;
    overflow: hidden;
    border: 1px solid var(--gray-200);
    transition: box-shadow var(--transition), transform var(--transition);
}
.retreat-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-2px);
}

.retreat-card-header {
    background: linear-gradient(120deg, var(--purple-dark), var(--purple));
    padding: 1.6rem 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.retreat-tec-number {
    font-family: 'Poppins', sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(255,255,255,0.55);
    margin-bottom: 0.2rem;
}
.retreat-dates {
    font-family: 'Poppins', sans-serif;
    font-size: clamp(1.2rem, 3vw, 1.6rem);
    font-weight: 700;
    color: var(--white);
    line-height: 1.2;
}
.retreat-year {
    color: var(--pink-light);
    font-size: 1rem;
    font-weight: 400;
}

.retreat-card-body { padding: 2rem; }

/* Church info */
.church-info {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    padding: 1rem 1.2rem;
    background: var(--purple-pale);
    border-radius: 10px;
    margin-bottom: 1.8rem;
}
.church-icon { font-size: 1.4rem; flex-shrink: 0; margin-top: 0.1rem; }
.church-icon svg { width: 1.4rem; height: 1.4rem; color: var(--purple-dark); }
.church-name { font-weight: 700; color: var(--purple-dark); font-size: 1rem; }
.church-address { font-size: 0.875rem; color: var(--gray-600); margin-top: 0.15rem; }
.church-address a { color: var(--purple); text-decoration: none; font-weight: 500; }
.church-address a:hover { text-decoration: underline; }

/* Arrival grid */
.arrival-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 2rem;
}
.arrival-item {
    text-align: center;
    padding: 1rem 0.75rem;
    border-radius: 10px;
    background: var(--gray-100);
    border: 1px solid var(--gray-200);
}
.arrival-day {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--purple);
    margin-bottom: 0.25rem;
}
.arrival-date { font-size: 0.95rem; font-weight: 600; color: var(--text); margin-bottom: 0.15rem; }
.arrival-time { font-size: 0.8rem; color: var(--gray-600); }

/* Schedule list */
.schedule-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--gray-600);
    margin-bottom: 0.75rem;
}
.schedule-list {
    list-style: none;
    border: 1px solid var(--gray-200);
    border-radius: 10px;
    overflow: hidden;
}
.schedule-list li {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1.2rem;
    border-bottom: 1px solid var(--gray-100);
    font-size: 0.9rem;
    background: var(--gray-50);
}
.schedule-list li:last-child { border-bottom: none; }
.schedule-event { font-weight: 600; color: var(--text); }
.schedule-time { color: var(--gray-600); font-size: 0.83rem; white-space: nowrap; }
.schedule-date { color: var(--purple); font-weight: 600; font-size: 0.83rem; white-space: nowrap; text-align: right; }
.schedule-date.multi-date { display: flex; flex-direction: column; align-items: flex-end; gap: 0.2rem; }

/* Empty state */
.empty-state { text-align: center; padding: 4rem 2rem; color: var(--gray-600); }
.empty-state h2 { color: var(--purple-dark); margin-bottom: 0.75rem; }

/* ── RESPONSIVE ──────────────────────────────────────────────────────────── */
@media (max-width: 700px) {
    .retreat-card-header { flex-direction: column; align-items: flex-start; }
    .retreat-card-body { padding: 1.25rem; }
    .arrival-grid { grid-template-columns: 1fr; }
    .schedule-list li { grid-template-columns: 1fr; gap: 0.2rem; }
}

/* Church combobox — shared by adult.php, team.php, assign_churches.php */
.church-combo { position: relative; width: 100%; }
.church-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid var(--gray-200);
    border-top: none;
    border-radius: 0 0 6px 6px;
    max-height: 220px;
    overflow-y: auto;
    z-index: 100;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.church-dropdown-item {
    padding: 0.45rem 0.75rem;
    cursor: pointer;
    font-size: 0.875rem;
    border-bottom: 1px solid var(--gray-100);
}
.church-dropdown-item:last-child { border-bottom: none; }
.church-dropdown-item:hover,
.church-dropdown-item.active { background: var(--gray-50, #f9fafb); }
.church-dropdown-name { font-weight: 600; color: var(--text); }
.church-dropdown-location { font-size: 0.78rem; color: var(--gray-500); }
.church-not-listed {
    display: inline-block;
    margin-top: 0.4rem;
    font-size: 0.8rem;
    color: var(--gray-500);
    text-decoration: underline;
}
.church-not-listed:hover { color: var(--text); }
.church-unlisted-section {
    background: var(--gray-50, #f9fafb);
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    padding: 1rem 1rem 0.25rem;
}


/* ── teamonly/weekender_guardian_angel_forms.php (wga-) ─────────────────── */
.wga-print-bar {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
}
.wga-print-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--purple);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 0.65rem 1.5rem;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
}
.wga-print-btn:hover { opacity: 0.88; }
.wga-count {
    font-size: 0.9rem;
    color: var(--gray-500);
}
.wga-form {
    background: #fff;
    border: 1.5px solid #e8dfe6;
    border-radius: 12px;
    padding: 2rem 2.25rem;
    margin-bottom: 2rem;
}
.wga-form-title {
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--purple);
    margin: 0 0 1.25rem;
    padding-bottom: 0.6rem;
    border-bottom: 2px solid #f0ebee;
}
.wga-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
}
.wga-info-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--purple);
    margin-bottom: 0.2rem;
}
.wga-info-value { color: var(--gray-800); line-height: 1.5; }
.wga-section-hd {
    font-size: 1rem;
    font-weight: 700;
    color: var(--gray-800);
    margin: 1.5rem 0 0.5rem;
}
.wga-body-text {
    font-size: 0.9rem;
    color: var(--gray-700);
    line-height: 1.65;
    margin-bottom: 0.75rem;
}
.wga-checklist {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
}
.wga-checklist li {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    font-size: 0.9rem;
    color: var(--gray-700);
    line-height: 1.6;
    margin-bottom: 0.5rem;
}
.wga-checklist li input[type="checkbox"] {
    margin-top: 0.3rem;
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    accent-color: var(--purple);
}
.wga-checklist li span { flex: 1; min-width: 0; }
.wga-script {
    background: #f9f5f8;
    border-left: 4px solid var(--purple);
    border-radius: 0 8px 8px 0;
    padding: 1rem 1.25rem;
    font-size: 0.9rem;
    color: var(--gray-700);
    line-height: 1.7;
    margin-bottom: 0.75rem;
}
.wga-script ul {
    margin: 0.75rem 0 0 1rem;
    padding: 0;
}
.wga-script ul li { margin-bottom: 0.6rem; }
.wga-yn {
    display: inline-flex;
    gap: 0.75rem;
    margin-left: 0.5rem;
}
.wga-yn label {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.85rem;
}
@media print {
    .wga-print-bar { display: none; }
    .wga-form {
        border: none;
        border-radius: 0;
        padding: 0.3in 0.5in;
        margin: 0;
        page-break-after: always;
        break-after: page;
    }
    .wga-form:last-child {
        page-break-after: avoid;
        break-after: avoid;
    }
    body, .wga-body-text, .wga-checklist li,
    .wga-script, .wga-info-value { font-size: 9.5pt; color: #000; line-height: 1.4; }
    .wga-form-title  { font-size: 12pt; color: #723063; margin-bottom: 0.6rem; }
    .wga-section-hd  { font-size: 10pt; margin: 0.6rem 0 0.2rem; }
    .wga-info-label  { font-size: 7.5pt; }
    .wga-info-grid   { margin-bottom: 0.6rem; gap: 0.5rem; }
    .wga-checklist li { margin-bottom: 0.2rem; gap: 0.35rem; }
    .wga-script      { padding: 0.4rem 0.6rem; }
    .wga-script ul   { margin-top: 0.3rem; }
    .wga-script ul li { margin-bottom: 0.3rem; }
}
@media (max-width: 600px) {
    .wga-info-grid { grid-template-columns: 1fr 1fr; }
    .wga-form { padding: 1.25rem; }
}

/* ── teamonly/vendor_info_entry.php (vie-) ──────────────────────────────── */
.vie-flash      { background:#d1fae5; border:1.5px solid #6ee7b7; color:#065f46; border-radius:8px; padding:0.75rem 1rem; margin-bottom:1.5rem; font-weight:600; }
.vie-flash--del { background:#fee2e2; border-color:#fca5a5; color:#991b1b; }
.vie-error      { background:#fee2e2; border:1.5px solid #fca5a5; color:#991b1b; border-radius:8px; padding:0.75rem 1rem; margin-bottom:1.5rem; }
.vie-label      { display:block; font-size:0.8rem; font-weight:600; color:var(--gray-600); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:0.35rem; }
.vie-input,
.vie-select     { width:100%; padding:0.55rem 0.8rem; border:1.5px solid #ddd6e8; border-radius:8px; font-size:0.95rem; font-family:inherit; color:var(--gray-800); background:#fff; }
.vie-input:focus,
.vie-select:focus { outline:none; border-color:var(--purple); }
.vie-textarea   { width:100%; padding:0.55rem 0.8rem; border:1.5px solid #ddd6e8; border-radius:8px; font-size:0.95rem; font-family:inherit; color:var(--gray-800); resize:vertical; }
.vie-textarea:focus { outline:none; border-color:var(--purple); }
.vie-grid       { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.vie-field      { display:flex; flex-direction:column; }
.vie-submit-bar {
    position: sticky;
    bottom: 0;
    display: flex;
    justify-content: center;
    background: var(--white);
    padding: 0.9rem 1rem;
    margin-top: 1.5rem;
    z-index: 50;
}
.vie-submit-btn { background:var(--purple); color:#fff; border:none; border-radius:8px; padding:0.7rem 2.5rem; font-size:1rem; font-weight:700; cursor:pointer; }
.vie-submit-btn:hover { opacity:0.88; }
@media (max-width:640px) {
    .vie-grid { grid-template-columns:1fr; }
}

/* ── teamonly/theme_verse_song_history.php (tvsh-) ──────────────────────── */
.tvsh-search-wrap { margin-bottom: 1.5rem; }
.tvsh-search {
    width: 100%;
    max-width: 380px;
    padding: 0.55rem 1rem;
    border: 1.5px solid #ddd6e8;
    border-radius: 8px;
    font-size: 0.95rem;
    font-family: inherit;
    color: var(--gray-800);
    background: #fff;
    transition: border-color 0.2s;
}
.tvsh-search:focus { outline: none; border-color: var(--purple); }
.tvsh-table-wrap {
    overflow-x: auto;
    border-radius: 12px;
    border: 1.5px solid #e8dfe6;
}
.tvsh-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.tvsh-table thead th {
    background: var(--purple);
    color: #fff;
    font-weight: 600;
    font-size: 0.75rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    padding: 0.75rem 1rem;
    text-align: left;
    white-space: nowrap;
}
.tvsh-table thead th:first-child { width: 5.5rem; }
.tvsh-table tbody tr { border-bottom: 1px solid #f0ebee; transition: background 0.15s; }
.tvsh-table tbody tr:last-child  { border-bottom: none; }
.tvsh-table tbody tr:hover       { background: #faf7fb; }
.tvsh-table tbody tr.tvsh-hidden { display: none; }
.tvsh-table td { padding: 0.85rem 1rem; vertical-align: top; color: var(--gray-800); line-height: 1.55; }
.tvsh-tec { font-weight: 700; font-size: 1rem; color: var(--purple); white-space: nowrap; }
.tvsh-year { display: block; margin-top: 0.1rem; font-size: 0.78rem; color: var(--gray-500); }
.tvsh-ref { margin-bottom: 0.25rem; font-weight: 600; font-size: 0.82rem; color: var(--purple); text-transform: uppercase; letter-spacing: 0.05em; }
.tvsh-verse-text { font-style: italic; font-size: 0.88rem; color: var(--gray-700); }
.tvsh-song-title { font-weight: 600; color: var(--gray-800); }
.tvsh-artist { margin-top: 0.15rem; font-size: 0.82rem; color: var(--gray-500); }
.tvsh-empty { font-style: italic; font-size: 0.85rem; color: var(--gray-400); }
.tvsh-no-results { display: none; padding: 2rem; text-align: center; font-style: italic; color: var(--gray-500); }
.tvsh-count { margin-top: 0.9rem; font-size: 0.8rem; color: var(--gray-400); }
@media (max-width: 560px) {
    .tvsh-table thead th:nth-child(3),
    .tvsh-table td:nth-child(3) { display: none; }
}

/* ── teamonly/support_checklist.php (sc- additions) ────────────────────── */
.sc-filter-bar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
.sc-filter-bar input[type="search"] {
    flex: 1;
    max-width: 320px;
    box-sizing: border-box;
    padding: 0.5rem 0.75rem;
    font: inherit;
    font-size: 0.9rem;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
}
.sc-filter-bar input[type="search"]:focus {
    outline: none;
    border-color: #723063;
    box-shadow: 0 0 0 2px rgba(114,48,99,0.15);
}
.sc-filter-count { font-size: 0.82rem; color: #888; }
#sc-no-results { display: none; padding: 1rem 0; color: #888; font-style: italic; }
.sc-team-pill {
    display: inline-block;
    background: #f3e8f0;
    color: #723063;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.18rem 0.65rem;
    border-radius: 999px;
    white-space: nowrap;
}
.sc-team-toggles {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.6rem;
    align-items: center;
}
.sc-team-toggle {
    display: inline-block;
    background: #f3e8f0;
    color: #723063;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.22rem 0.75rem;
    border-radius: 999px;
    border: 2px solid transparent;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s, border-color 0.15s;
    user-select: none;
    font-family: inherit;
}
.sc-team-toggle:hover { background: #e8d0e5; }
.sc-team-toggle.sc-toggle-active { background: #723063; color: #fff; border-color: #723063; }
.sc-top-bar { align-items: center; }
@media (max-width: 600px) {
    .sc-top-bar-btn .btn { width: 100%; text-align: center; }
}

/* ── teamonly/servicemusic/index.php (sm-) ──────────────────────────────── */
.sm-card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,.1);
    overflow: hidden;
    max-width: 600px;
    margin: 0 auto;
}
.sm-card-title {
    background: #723063;
    color: #fff;
    padding: 0.75rem 1.25rem;
    font-size: 1rem;
    font-weight: 600;
}
.sm-empty { padding: 1.25rem; color: #888; font-style: italic; }

/* ── teamlist/index.php (tl-) ───────────────────────────────────────────── */
.tl-wrap { max-width: 824px; margin-left: auto; margin-right: auto; }
.tl-table th { cursor: pointer; user-select: none; white-space: nowrap; }
.tl-table th .tl-th-inner { display: flex; align-items: center; gap: 0.35rem; }
.tl-table th .tl-sort-arrow { font-size: 0.65rem; opacity: 0.8; }
.tl-table th:hover .tl-th-inner { text-decoration: underline; }
.tl-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 824px;
    margin: 0.6rem auto 0;
    font-size: 0.85rem;
    color: #666;
}
.tl-unavailable { padding: 2rem; color: #666; text-align: center; font-style: italic; }
/* Override the shared .tlh-table min-width so the 3 short columns fit narrow
   screens instead of being clipped; .tl-wrap still scrolls if needed. */
.tl-table { min-width: 0; border-collapse: collapse; border-spacing: 0; }
/* Paint the purple on the cells (not just the row) and drop cell borders so no
   vertical dividers show between the header columns. */
.tl-table thead th { background: var(--purple); border: 0; }
@media (max-width: 540px) {
    .tl-table { font-size: 0.78rem; }
    .tl-table thead th { padding: 0.5rem 0.45rem; font-size: 0.6rem; letter-spacing: 0.03em; }
    .tl-table td { padding: 0.3rem 0.45rem; }
}

/* ── registrations/index.php (reg-) ─────────────────────────────────────── */
.reg-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-top: 1.5rem;
}
.reg-card {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    background: #fff;
    border: 1px solid #e0d4e8;
    border-radius: 10px;
    padding: 1.4rem 1.25rem 1.2rem;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    transition: box-shadow 0.18s, transform 0.18s, background 0.18s;
}
.reg-card:hover {
    box-shadow: 0 6px 22px rgba(114,48,99,0.13);
    transform: translateY(-2px);
    background: #fdf8fc;
}
.reg-card-icon {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0e8ef;
    border-radius: 9px;
    color: #723063;
    flex-shrink: 0;
    margin-bottom: 0.1rem;
}
.reg-card-body { flex: 1; }
.reg-card-title { font-size: 1rem; font-weight: 700; color: #723063; margin: 0 0 0.25rem; }
.reg-card-desc { font-size: 0.875rem; color: #666; margin: 0; line-height: 1.45; }
.reg-card-arrow { display: none; }
.reg-card-featured {
    grid-column: span 2;
    background: #f9f5f8;
    border: 1px solid #c9a8c0;
    padding: 1.6rem 1.5rem 1.4rem;
    flex-direction: row;
    align-items: center;
    gap: 1.2rem;
}
.reg-card-featured:hover { background: #f5eef3; }
.reg-card-featured .reg-card-icon {
    width: 52px;
    height: 52px;
    background: #e8d6e4;
    border-radius: 11px;
    flex-shrink: 0;
}
.reg-card-featured .reg-card-icon svg { width: 28px; height: 28px; }
.reg-card-featured .reg-card-eyebrow {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #a07090;
    margin: 0 0 0.3rem;
}
.reg-card-featured .reg-card-title { font-size: 1.2rem; }
.reg-card-featured .reg-card-desc  { font-size: 0.9rem; }
.reg-card-featured-arrow {
    font-size: 1.4rem;
    color: #c0a0b8;
    flex-shrink: 0;
    margin-left: auto;
}
@media (max-width: 600px) {
    .reg-grid { grid-template-columns: 1fr; }
    .reg-card-featured { grid-column: span 1; flex-direction: column; }
    .reg-card-featured-arrow { display: none; }
}


/* ── registrations/health_form_completed.php ────────────────────────────── */
.med-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; margin-top: 0.5rem; }
.med-table th {
    text-align: left;
    padding: 6px 8px;
    border-bottom: 2px solid #e0d4e8;
    color: #723063;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.med-table td { padding: 6px 8px; border-bottom: 1px solid #f0e8f0; vertical-align: top; }
.cond-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 0.25rem; }
.cond-tag { background: #f0e8f0; color: #5a2452; border-radius: 4px; padding: 3px 10px; font-size: 0.85rem; }
.no-print-actions { margin-bottom: 1.5rem; display: flex; gap: 0.75rem; flex-wrap: wrap; }
.auth-text { font-size: 0.85rem; color: #555; line-height: 1.6; margin: 0 0 0.6rem; }
@media print {
    .no-print-actions,
    .page-header,
    nav, .subnav, footer { display: none !important; }
}

/* ── registrations/health_form.php ─────────────────────────────────────── */
.conditions-grid { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0.5rem 0 1rem; }
.conditions-grid .cond-item { display: flex; align-items: center; gap: 6px; }
.medication-entry { margin-bottom: 0.5rem; }
.medication-entry + hr { margin: 0.75rem 0; border: none; border-top: 1px solid #e0d8e8; }
#add-medication-button { margin-top: 0.75rem; margin-bottom: 1.5rem; }
.radio-group { display: flex; flex-direction: column; gap: 0.4rem; margin: 0.5rem 0 1rem; }
.radio-group label { display: flex; align-items: center; gap: 8px; font-size: 0.95rem; }

/* ── recommendations/index.php (recs-) ──────────────────────────────────── */
.recs-legend {
    background: #f9f5f8; border: 1px solid #e2d7e7; border-radius: 10px;
    padding: 1rem 1.25rem; margin-bottom: 1.5rem;
}
.recs-legend ul {
    margin: 0; padding-left: 1.25rem; display: flex; flex-direction: column;
    gap: 0.6rem; font-size: 0.875rem; color: #444; list-style: disc;
}
.recs-legend li { line-height: 1.6; }
.recs-selector { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; margin-bottom: 1.5rem; width: 100%; }
.recs-selector label { font-size: 0.85rem; font-weight: 600; color: #723063; }
.recs-selector select { padding: 0.35rem 0.65rem; border: 1px solid #c4b2cd; border-radius: 6px; font-size: 0.9rem; background: #fff; cursor: pointer; color: #1a1020; }
.recs-team-tabs { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.recs-expand-toggle { display: none; margin-left: auto; align-items: center; gap: 0.4rem; cursor: pointer; user-select: none; }
@media (min-width: 601px) { .recs-expand-toggle { display: flex; } }
.recs-expand-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.recs-toggle-track { position: relative; width: 32px; height: 18px; background: #ccc; border-radius: 999px; transition: background 0.2s; flex-shrink: 0; }
.recs-toggle-thumb { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; background: #fff; border-radius: 50%; transition: left 0.2s; }
.recs-expand-toggle input:checked ~ .recs-toggle-track { background: #723063; }
.recs-expand-toggle input:checked ~ .recs-toggle-track .recs-toggle-thumb { left: 16px; }
.recs-toggle-label { font-size: 0.78rem; color: #723063; white-space: nowrap; }
.teams-expanded .team-history { display: inline-flex; position: static; border: none; box-shadow: none; padding: 0; background: none; }
.teams-expanded .teams-toggle { display: none; }
.legend-teams-expanded { display: none; }
.teams-expanded .legend-teams-collapsed { display: none; }
.teams-expanded .legend-teams-expanded { display: list-item; }
.legend-teams-collapsed .teams-toggle { display: inline-flex; }
.recs-team-tab {
    padding: 0.4rem 0.9rem; border: 1.5px solid var(--gray-300, #d1d5db); border-radius: 8px;
    background: #fff; color: #4b5563; font-size: 0.88rem; font-weight: 600; cursor: pointer;
    transition: background 0.14s, border-color 0.14s, color 0.14s; white-space: nowrap; font-family: 'Inter', sans-serif;
}
.recs-team-tab:hover { border-color: #723063; color: #4e1f44; }
.recs-team-tab--active, .recs-team-tab--active:hover { background: #723063; border-color: #723063; color: #fff; }
@media (max-width: 700px) { .recs-team-tab { flex: 0 0 calc(33.333% - 0.24rem); } }
.rec-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border: 1px solid #4e1f44; border-radius: 5px;
    background: #4e1f44; color: #fff; font-size: 0.8rem; font-weight: 700;
    cursor: pointer; padding: 0; line-height: 1; transition: background 0.15s, border-color 0.15s;
}
.rec-btn:hover { background: #723063; border-color: #723063; }
.rec-btn-empty { color: transparent; cursor: default; }
.rec-btn-empty:hover { background: #4e1f44; color: transparent; }
a.person-link { color: inherit; text-decoration: none; font-weight: 500; }
a.person-link:hover { text-decoration: underline; }
.eligible a.person-link { color: #b91c1c; }
.eligible .grad-year { color: #b91c1c; }
/* Overall only: already served as Rector/a -- teal instead of the eligible red.
   Listed after .eligible so it wins when both classes are present. */
.served-overall a.person-link { color: #0e7490; }
.served-overall .grad-year { color: #0e7490; }
sup.leadership-sup { font-size: 0.6rem; color: #723063; vertical-align: super; letter-spacing: 0; }
.team-history { display: none; position: absolute; z-index: 20; background: #fff; border: 1.5px solid #ddd6e8; border-radius: 8px; padding: 5px 7px; box-shadow: 0 4px 12px rgba(0,0,0,0.12); flex-wrap: wrap; gap: 3px; }
.team-history.th-open { display: flex; }
.teams-toggle { display: inline-flex; align-items: center; justify-content: center; margin-left: 3px; padding: 0 4px; height: 15px; font-size: 0.62rem; background: #f5f0f5; border: 1px solid #c4b2cd; border-radius: 4px; cursor: pointer; color: #723063; vertical-align: middle; line-height: 1; font-family: inherit; font-weight: 600; gap: 2px; }
.teams-toggle:hover { background: #ede5f0; border-color: #723063; }
a.team-count-link {
    display: inline-flex; align-items: center; font-size: 0.65rem; color: #555;
    text-decoration: none; border: 1px solid #bbb; border-radius: 4px; padding: 0 3px;
    height: 16px; line-height: 1; white-space: nowrap; background: transparent;
}
a.team-count-link:hover { color: #723063; border-color: #723063; }
.photo-tooltip { position: relative; display: inline-block; vertical-align: middle; margin-right: 4px; }
.camera-icon { display: block; }
.photo-tip {
    display: none; position: absolute; z-index: 100; left: 50%;
    transform: translateX(-50%); top: 20px; width: 120px; height: 144px;
}
.photo-tip-img {
    display: block; width: 100%; height: 100%; border-radius: 8px;
    background-size: cover; background-position: center; box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}
.photo-tooltip:hover .photo-tip { display: block; }
.recs-team-card { background: #fff; border: 1px solid #e2d7e7; border-radius: 10px; padding: 1rem 1.25rem; margin-bottom: 1.5rem; }
/* Pinned just under the sticky nav + subnav so the team stays labeled while
   scrolling its list. Each h2 sticks within its own .recs-team-card, so the
   next team's header pushes the previous one out instead of stacking.
   --subnav-h is published by JS from the subnav's live height (it wraps to
   extra rows on narrow screens); 3rem is a sane fallback before it runs. */
.recs-team-card > h2 {
    font-size: 0.95rem; font-weight: 700; color: #fff; background: #723063;
    text-transform: uppercase; letter-spacing: 0.07em; margin: -1rem -1.25rem 1rem;
    padding: 0.55rem 1.25rem; border-radius: 9px 9px 0 0;
    position: sticky; top: calc(var(--nav-height) + var(--subnav-h, 3rem)); z-index: 15;
}
/* align-items: start keeps each gender column only as tall as its own content.
   With the default stretch both columns share the taller one's height, and the
   shorter column's sticky h3 would keep hanging around under an empty area. */
.recs-gender-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: start; }
@media (max-width: 700px) { .recs-gender-grid { grid-template-columns: 1fr; } }
/* Pins directly under its team's h2. --recs-team-hd-h is published by JS from
   that header's live height; 2.3rem is the fallback before the script runs. The
   white background and the padding/negative-margin pair give the pinned band
   something opaque to cover the rows scrolling beneath it without changing the
   spacing it had before. */
.recs-gender-section > h3 {
    font-size: 0.8rem; font-weight: 700; color: #555; text-transform: uppercase;
    letter-spacing: 0.05em; margin: -0.2rem 0 0.2rem; padding: 0.2rem 0;
    position: sticky; z-index: 14; background: #fff;
    top: calc(var(--nav-height) + var(--subnav-h, 3rem) + var(--recs-team-hd-h, 2.3rem));
}
.recs-table { border-collapse: collapse; font-size: 0.85rem; width: 100%; }
.recs-table th { font-size: 0.72rem; font-weight: 600; color: #999; text-align: center; padding: 2px 4px; border-bottom: 1px solid #e2d7e7; text-decoration: underline; }
.recs-table td { vertical-align: middle; padding: 2px 2px; }
.recs-table td.td-rec { text-align: center; width: 30px; padding-left: 1px; padding-right: 1px; }
.recs-table td.td-person { position: relative; }
.recs-table td.td-photo { width: 24px; text-align: center; padding: 0; }
.recs-table tr:hover td { background: #faf6fb; }
.recs-table .no-data { color: #bbb; font-size: 0.8rem; font-style: italic; }
.grad-year { font-size: 0.75rem; color: #4c4c4c; margin-left: 1px; vertical-align: middle; }
.legend-rec-samples { display: inline-flex; gap: 3px; vertical-align: middle; margin-left: 4px; }
.legend-rec-sample {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border: 1px solid #4e1f44; border-radius: 5px;
    background: #4e1f44; color: #fff; font-size: 0.8rem; font-weight: 700;
}
.legend-rec-sample.empty { color: transparent; }
.recs-modal-overlay {
    display: none; position: fixed; inset: 0; background: rgba(30,10,28,0.55);
    z-index: 1000; align-items: center; justify-content: center; padding: 1rem;
    overflow-y: auto;
}
.recs-modal-overlay.open { display: flex; }
.recs-modal {
    background: #fff; border-radius: 12px; box-shadow: 0 8px 40px rgba(0,0,0,0.28);
    width: calc(100vw - 2rem); max-width: 480px;
    max-height: 90vh; max-height: 90dvh;
    display: flex; flex-direction: column; overflow: hidden;
}
#recsModalContent { overflow-y: auto; flex: 1; min-height: 0; }
.recs-modal-header {
    background: #4e1f44; color: #fff; padding: 1rem 1.25rem; border-radius: 12px 12px 0 0;
    display: flex; justify-content: space-between; align-items: flex-start; gap: 0.75rem;
}
.recs-modal-header h3 { margin: 0; font-size: 1rem; font-weight: 700; line-height: 1.3; }
.recs-modal-header p { margin: 0.2rem 0 0; font-size: 0.78rem; opacity: 0.75; }
.recs-modal-close { background: none; border: none; color: #fff; font-size: 1.4rem; line-height: 1; cursor: pointer; padding: 0; opacity: 0.8; flex-shrink: 0; }
.recs-modal-close:hover { opacity: 1; }
.recs-modal-body { padding: 1rem 1.25rem; display: flex; gap: 1rem; align-items: flex-start; }
.recs-modal-photo { width: 100px; height: 120px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.recs-modal-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.recs-modal-table th { text-align: left; font-size: 0.72rem; font-weight: 700; color: #888; text-transform: uppercase; letter-spacing: 0.05em; padding: 0 0.5rem 0.4rem 0; border-bottom: 1px solid #e2d7e7; }
.recs-modal-table td { padding: 0.3rem 0.5rem 0.3rem 0; vertical-align: top; border-bottom: 1px solid #f2ecf6; color: #1a1020; }
.recs-modal-table tr:last-child td { border-bottom: none; }
.recs-modal-empty { padding: 1rem 1.25rem; color: #aaa; font-size: 0.875rem; font-style: italic; }
.recs-modal-loading { padding: 1.5rem 1.25rem; text-align: center; color: #888; font-size: 0.875rem; }
.recs-modal-section-heading { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: #723063; margin: 0.75rem 1.25rem 0.4rem; }
@media (max-width: 600px) {
    .recs-team-card { padding: 0.5rem; margin-bottom: 1rem; }
    .recs-team-card > h2 { margin-bottom: 0.5rem; }
    .recs-gender-grid { gap: 0.75rem; }
    .recs-gender-section > h3 { margin-bottom: 0.25rem; }
    .recs-legend { padding: 0.6rem 0.75rem; }
    .td-photo { display: none; }

}

/* ── recommendations/completed_evals.php (ce-) ──────────────────────────── */
.ce-selector-form { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1.5rem; }
.ce-selector-form label { font-weight: 600; color: #4b2342; }
.ce-selector-form select { padding: 0.3rem 0.5rem; border: 1px solid #ccc; border-radius: 4px; font-size: 0.95rem; }
.ce-card { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,.1); overflow: hidden; margin-bottom: 1.5rem; }
.ce-card-title { background: #723063; color: #fff; padding: 0.75rem 1.25rem; font-size: 1rem; font-weight: 600; }
.ce-table { width: 100%; border-collapse: collapse; }
.ce-table th { background: #f3e8f0; color: #4b2342; text-align: left; padding: 0.6rem 1rem; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.03em; }
.ce-table td { padding: 0.65rem 1rem; border-top: 1px solid #eee; vertical-align: middle; }
.ce-table tr:hover td { background: #faf5f9; }
.ce-name { font-weight: 600; color: #2d2d2d; }
.ce-team { color: #666; font-size: 0.9rem; }
.ce-actions { text-align: right; }
.ce-view-btn { padding: 0.35rem 0.85rem; background: #4e1f44; color: #fff; border: none; border-radius: 4px; font-size: 0.85rem; cursor: pointer; }
.ce-view-btn:hover { background: #6b2d5e; }
.ce-empty { padding: 1.5rem 1.25rem; color: #888; font-style: italic; }
.modal-overlay {
    display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5);
    z-index: 1000; align-items: flex-start; justify-content: center; padding-top: 2rem;
}
.modal-overlay.open { display: flex; }
.modal-box { background: #fff; border-radius: 10px; width: 92%; max-width: 700px; max-height: 85vh; display: flex; flex-direction: column; box-shadow: 0 8px 30px rgba(0,0,0,.25); }
.modal-header { background: #723063; color: #fff; padding: 0.9rem 1.25rem; border-radius: 10px 10px 0 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.modal-title { font-size: 1rem; font-weight: 600; line-height: 1.35; }
.modal-close { background: none; border: none; color: #fff; font-size: 1.5rem; cursor: pointer; line-height: 1; flex-shrink: 0; }
.modal-sort-bar { display: flex; gap: 0.5rem; padding: 0.75rem 1.25rem; border-bottom: 1px solid #eee; background: #faf5f9; }
.sort-btn { padding: 0.3rem 0.9rem; border: 2px solid #723063; border-radius: 4px; background: #fff; color: #723063; font-size: 0.85rem; font-weight: 600; cursor: pointer; }
.sort-btn.active { background: #723063; color: #fff; }
.modal-body { overflow-y: auto; padding: 1rem 1.25rem; flex: 1; }
.modal-loading { text-align: center; color: #888; padding: 2rem; }
.ce-recs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 1rem; }
.ce-group-sep { grid-column: 1 / -1; background: #682d5a; color: #fff; font-weight: 600; font-size: 0.95rem; padding: 0.4rem 0.75rem; border-radius: 4px; }
.ce-rec-item { text-align: center; }
.ce-photo { width: 130px; height: 156px; object-fit: cover; border-radius: 8px; display: block; margin: 0 auto 0.4rem; }
.ce-rec-name { font-weight: 600; font-size: 0.85rem; color: #2d2d2d; }
.ce-rec-team { font-size: 0.8rem; color: #666; }
.ce-no-recs { color: #888; font-style: italic; }
@media (max-width: 600px) {
    .ce-table .ce-team-col { display: none; }
    .ce-recs-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── forms/ shared styles (.printable-content) ──────────────────────────── */
.printable-content {
    font-size: 1rem; line-height: 1.7;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 2rem 2.25rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
}
.printable-content p { margin-bottom: 0.9rem; }
.printable-content ul,
.printable-content ol { padding-left: 1.75rem; margin: 0.25rem 0 1rem; }
.printable-content ol { list-style: decimal; }
.printable-content ul ul { margin: 0.25rem 0 0.5rem; }
.printable-content li { margin-bottom: 0.5em; }
.printable-content em { color: #555; }
.printable-content .rform-content-title { margin-top: 0; margin-bottom: 1rem; }
.printable-content h4 {
    margin-top: 1.75rem; margin-bottom: 0.5rem; padding: 0.4rem 0.8rem;
    background: var(--purple-pale, #f5eef3); border-left: 4px solid var(--purple, #723063);
    border-radius: 0 4px 4px 0; font-size: 1.05rem;
}
.printable-content h5 {
    margin-top: 1.1rem; margin-bottom: 0.3rem; color: var(--purple, #723063);
    font-size: 0.95rem; text-transform: uppercase; letter-spacing: 0.05em;
    border-bottom: 1px solid var(--purple-pale, #f5eef3); padding-bottom: 0.2rem;
}
.printable-content h3 {
    margin-top: 1.75rem; margin-bottom: 0.5rem; padding: 0.4rem 0.8rem;
    background: var(--purple-pale, #f5eef3); border-left: 4px solid var(--purple, #723063);
    border-radius: 0 4px 4px 0; font-size: 1.05rem;
}
.printable-content .pc-callout {
    background: var(--white, #fff);
    border: 1px solid var(--gray-200, #e4dfe4);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: var(--shadow-md, 0 6px 24px rgba(114,48,99,0.14));
    margin: 1.75rem 0;
}
.printable-content .pc-callout h4 {
    background: var(--purple-dark, #4e1f44);
    color: var(--white, #fff);
    margin: 0;
    padding: 0.55rem 1.1rem;
    font-size: 0.95rem;
    border-left: none; border-radius: 0;
}
.printable-content .pc-callout p {
    padding: 0 1.1rem;
    margin-bottom: 0.6rem;
}
.printable-content .pc-callout p:first-of-type { padding-top: 1rem; }
.printable-content .pc-callout p:last-child { padding-bottom: 1rem; margin-bottom: 0; }
.page-break { display: none; }
@media print {
    nav, .page-header, .subnav, footer, .no-print { display: none !important; }
    .printable-content { font-size: 10pt; line-height: 1.5; background: none; border: none; box-shadow: none; padding: 0; border-radius: 0; }
    .printable-content h3,
    .printable-content h4 { background: none; border-left: 3px solid #723063; }
    .printable-content h5 { color: #723063; }
    .printable-content .pc-callout { box-shadow: none; border-color: #cfc8d0; }
    .printable-content .pc-callout h4 { background: #4e1f44; }
    .page-break { display: block; page-break-before: always; break-before: page; }
    section { padding: 0 !important; }
}

/* ── forms/song_lyrics_template.php (slt-) ──────────────────────────────── */
.slt-instructions { background: #f9f5f8; border: 1px solid #e2d7e7; border-radius: 10px; padding: 1rem 1.25rem; font-size: 0.9rem; margin-bottom: 1.5rem; color: #3a2040; }
.slt-copy-area { border: 2px dashed #c4b2cd; border-radius: 10px; padding: 1.5rem 2rem; background: #fff; margin-bottom: 1.5rem; }
.slt-talk-block { text-align: center; font-family: Arial, sans-serif; margin-bottom: 1.5rem; }
.slt-talk-title { font-weight: bold; font-size: 1.15em; line-height: 1.2; }
.slt-talk-speakers { font-size: 1em; line-height: 1.3; margin-top: 0.15em; }
.slt-talk-song { font-style: italic; font-size: 1em; line-height: 1.3; margin-top: 0.1em; }
.slt-page-break-hint { font-size: 0.85em; color: #666; margin-top: 0.5em; margin-bottom: 0.75em; }
.slt-divider { border: none; border-top: 2px solid #e2d7e7; margin: 0.5rem 0 1.5rem; }
.slt-copy-marker { text-align: center; font-size: 0.85rem; color: #888; margin: 0.5rem 0; }

/* ── emaillist/weekenders.php (wl-) ─────────────────────────────────────── */
.wl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 1rem; }
@media (max-width: 700px) { .wl-grid { grid-template-columns: 1fr; } }
.wl-row-label { grid-column: 1 / -1; margin: 1.5rem 0 .25rem; padding-bottom: .4rem; border-bottom: 2px solid #e8d5e4; font-size: 1.05rem; font-weight: 700; color: #4e1f44; }
.wl-row-label:first-child { margin-top: 0; }
.wl-section { display: flex; flex-direction: column; }
.wl-section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: .25rem; }
.wl-section-header h3 { margin: 0; font-size: .95rem; color: #4e1f44; }
.btn-wl-copy { padding: .3rem .85rem; background: #723063; color: #fff; border: none; border-radius: 4px; font-size: .82rem; cursor: pointer; white-space: nowrap; flex-shrink: 0; }
.btn-wl-copy:hover { background: #5a2350; }

/* ── emaillist/index.php (el-) ──────────────────────────────────────────── */
.el-mode-nav { display: flex; gap: .5rem; flex-wrap: wrap; margin: 1rem 0 1.5rem; }
.el-mode-nav a { padding: .4rem 1.1rem; border-radius: 4px; font-size: .9rem; text-decoration: none; border: 1px solid #723063; color: #723063; transition: background .15s, color .15s; }
.el-mode-nav a.active, .el-mode-nav a:hover { background: #723063; color: #fff; }
.el-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 1rem; }
@media (max-width: 700px) { .el-grid { grid-template-columns: 1fr; } }
.el-full { grid-column: 1 / -1; }
.el-section { display: flex; flex-direction: column; }
.el-section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: .25rem; }
.el-section-header h3 { margin: 0; font-size: 1rem; color: #4e1f44; }
.btn-el-copy { padding: .3rem .85rem; background: #723063; color: #fff; border: none; border-radius: 4px; font-size: .82rem; cursor: pointer; white-space: nowrap; flex-shrink: 0; }
.btn-el-copy:hover { background: #5a2350; }
.wl-section textarea, .el-section textarea {
    width: 100%; font-family: monospace; font-size: .82rem; border: 1px solid #ccc;
    border-radius: 4px; padding: .4rem; resize: vertical; background: #fafafa; box-sizing: border-box;
}

/* ── attendance/index.php (att-) ────────────────────────────────────────── */
.att-wrap { overflow-x: auto; border-radius: 10px; border: 1.5px solid #e4dfe4; margin-bottom: 1.75rem; }
.att-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.att-table thead { position: sticky; top: 0; z-index: 2; background: #723063; }
.att-table th {
    text-align: left; padding: 0.55rem 0.75rem; font-family: 'Poppins', sans-serif;
    font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: #fff; white-space: nowrap;
}
.att-table td { padding: 0.48rem 0.75rem; border-bottom: 1px solid #f2eff2; vertical-align: middle; color: #4e4858; }
.att-table tbody tr:last-child td { border-bottom: none; }
.att-table tbody tr:nth-child(even) td { background: #faf9fa; }
.att-table tbody tr:hover td { background: #f3eeff; }
.att-table select { width: 54px; padding: 0.2rem 0.15rem; font-size: 0.85rem; border: 1px solid #d1d5db; border-radius: 4px; background: #fff; }
.att-table input[type="text"] { width: 100%; min-width: 180px; padding: 0.25rem 0.4rem; font-size: 0.85rem; border: 1px solid #d1d5db; border-radius: 4px; }
.att-table input[type="text"]:focus,
.att-table select:focus { outline: none; border-color: #723063; box-shadow: 0 0 0 2px rgba(114,48,99,0.15); }
.att-team-pill { display: inline-block; background: #f3e8f0; color: #723063; font-size: 0.78rem; font-weight: 600; padding: 0.18rem 0.65rem; border-radius: 999px; white-space: nowrap; }
.att-ldr-star { color: #723063; font-size: 0.85em; opacity: 0.75; vertical-align: middle; margin-left: 2px; }
.att-filter-bar { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.att-filter-bar input[type="search"] { flex: 1; max-width: 280px; padding: 0.35rem 0.6rem; font-size: 0.9rem; border: 1px solid #d1d5db; border-radius: 6px; background: #fff; }
.att-filter-bar input[type="search"]:focus { outline: none; border-color: #723063; box-shadow: 0 0 0 2px rgba(114,48,99,0.15); }
.att-filter-count { font-size: 0.82rem; color: #888; }
#att-no-results { display: none; padding: 1rem 0; color: #888; font-style: italic; }
.att-team-toggles { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.6rem; align-items: center; }
.att-team-toggle {
    display: inline-block; background: #f3e8f0; color: #723063; font-size: 0.8rem; font-weight: 600;
    padding: 0.22rem 0.75rem; border-radius: 999px; border: 2px solid transparent; cursor: pointer;
    white-space: nowrap; transition: background 0.15s, border-color 0.15s; user-select: none; font-family: inherit;
}
.att-team-toggle:hover { background: #e8d0e5; }
.att-team-toggle.att-toggle-active { background: #723063; color: #fff; border-color: #723063; }
.att-actions {
    position: sticky; bottom: 0; display: flex; justify-content: center;
    background: var(--white); padding: 0.9rem 1rem; margin-top: 1.5rem; z-index: 50;
}
.att-actions .btn { min-width: 280px; text-align: center; }
@media (max-width: 640px) {
    .att-wrap { overflow-x: visible; }
    .att-table, .att-table tbody { display: block; }
    .att-table thead { display: none; }
    .att-table tbody tr {
        display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem 0.6rem;
        border: 1px solid #e5e7eb; border-radius: 8px; padding: 0.7rem 0.85rem;
        margin-bottom: 0.6rem; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    }
    .att-table tbody tr:hover td { background: transparent; }
    .att-table td { display: inline-flex; align-items: center; gap: 0.3rem; border: none; padding: 0.1rem 0; font-size: 0.88rem; }
    .att-td-name { flex: 1 1 auto; min-width: calc(100% - 90px); font-weight: 600; font-size: 0.95rem; }
    .att-td-team { flex: 0 0 auto; }
    .att-td-ldr { display: none; }
    .att-td-ldr.att-has-ldr { display: inline-flex; }
    .att-td-ldr.att-has-ldr::before { content: "Ldr"; color: #888; font-size: 0.75rem; }
    .att-td-first::before  { content: "1st"; color: #888; font-size: 0.75rem; }
    .att-td-second::before { content: "2nd"; color: #888; font-size: 0.75rem; }
    .att-td-third::before  { content: "3rd"; color: #888; font-size: 0.75rem; }
    .att-td-talk { display: none; }
    .att-td-talk.att-has-talk { display: inline-flex; }
    .att-td-talk.att-has-talk::before { content: "Talk"; color: #888; font-size: 0.75rem; }
    .att-td-notes { flex: 1 1 100%; display: flex; flex-direction: column; gap: 0.2rem; }
    .att-td-notes::before { content: "Notes"; color: #888; font-size: 0.75rem; }
    .att-td-notes input[type="text"] { min-width: 0; width: 100%; }
    .att-table select { width: 50px; }
    .att-actions .btn { width: 100%; text-align: center; }
}

/* ── admin/index.php (al-) ──────────────────────────────────────────────── */
.al-list { list-style: none; padding: 0.6rem 1.1rem 0.9rem; margin: 0; }
.al-list li { font-size: 1.05rem; line-height: 1.45; margin-bottom: 0.4rem; display: flex; align-items: flex-start; flex-wrap: wrap; }
.al-list li a { color: #3b1d52; text-decoration: none; display: flex; align-items: flex-start; flex: 1; min-width: 0; }
.al-list li a:hover { color: #723063; text-decoration: underline; }
.al-list li.al-demo-item { background: rgba(251,191,36,0.18); border-radius: 5px; }
.al-link-icon { width: 0.85em; height: 0.85em; margin-top: 0.22em; margin-right: 0.35em; flex-shrink: 0; color: #9080b0; }
/* per-category icon colors */
.al-link-icon.lucide-list,
.al-link-icon.lucide-file-text,
.al-link-icon.lucide-printer,
.al-link-icon.lucide-tag          { color: #5580b8; } /* steel blue  — lists, docs, printables, nametags */
.al-link-icon.lucide-external-link,
.al-link-icon.lucide-folder-open  { color: #3a90c8; } /* sky blue    — external links, Drive */
.al-link-icon.lucide-map-pin      { color: #4a9060; } /* forest green — maps */
.al-link-icon.lucide-mail         { color: #3a8878; } /* teal        — email */
.al-link-icon.lucide-camera       { color: #c07830; } /* amber       — photos */
.al-link-icon.lucide-calendar-days { color: #b87030; } /* amber-gold — schedule */
.al-link-icon.lucide-landmark     { color: #a08030; } /* gold        — church */
.al-link-icon.lucide-heart-pulse  { color: #c04545; } /* red         — health/medical */
.al-link-icon.lucide-lock         { color: #9a3535; } /* dark red    — security */
.al-link-icon.lucide-bar-chart-2  { color: #6050b8; } /* indigo      — charts/metrics */
.al-link-icon.lucide-music        { color: #9840a8; } /* magenta     — music/songs */
.al-link-icon.lucide-heart        { color: #8058b0; } /* warm purple — prayer */
.al-link-icon.lucide-shield-check { color: #6068b8; } /* blue-purple — guardian angel */
.al-link-icon.lucide-pin          { color: #c05040; } /* coral red   — trackers/planners */
.al-link-icon.lucide-check-square { color: #458858; } /* green       — checklists/attendance */
.al-link-icon.lucide-package      { color: #9a7040; } /* brown       — inventory */
.al-link-icon.lucide-utensils     { color: #c07030; } /* orange      — recipes */
.al-link-icon.lucide-settings     { color: #7080a0; } /* gray-blue   — admin/system */
.al-link-icon.lucide-image        { color: #7060a8; } /* soft purple — assets/logos */
.al-link-icon.lucide-pencil       { color: #408888; } /* dark teal   — entry/registration */
.al-link-icon.lucide-message-square { color: #9a7858; } /* warm tan  — comments/evals */
.al-list li.al-sub { padding-left: 1rem; font-size: 0.82rem; }
.al-divider { height: 1px; background: #ede5f2; margin: 0.55rem 0 0.5rem; border: none; }
.al-tier { display: inline-block; font-size: 0.6rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; padding: 0.1rem 0.4rem; border-radius: 3px; vertical-align: middle; }
.al-tier-council { background: #e8dfef; color: #723063; }
.al-tier-admin { background: #723063; color: #fff; }
/* Per-link team badges (admin Team Links). Colors keyed to the TeamNumber table. */
/* Link name + team pills share a flex label. The name keeps its own column; pills
   anchor to the right (margin-left:auto). One pill: label is nowrap so the pill is
   pinned top-right and the NAME wraps in the remaining width. 2+ pills: label may
   wrap, so the pills stay on the name's line when everything fits and only drop to
   a second line (right-justified, row-gap spacing) when they don't. */
.al-link-label { display: flex; flex-wrap: nowrap; align-items: baseline; flex: 1; min-width: 0; column-gap: 0.5rem; }
.al-link-label-multi { flex-wrap: wrap; row-gap: 0.25rem; }
.al-link-name { flex: 1 1 auto; min-width: 0; }
.al-team-tags { display: flex; flex-wrap: wrap; gap: 0.3rem; justify-content: flex-end; margin-left: auto; }
.al-team-tags-1 { flex: 0 0 auto; }       /* single: same line, pinned right */
.al-team-tags-multi { flex: 0 0 auto; }   /* 2+: same line if it fits, else wraps right-justified */
.al-team { display: inline-block; font-size: 0.58rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.08rem 0.4rem; border-radius: 10px; line-height: 1.4; white-space: nowrap; }
.al-team-1 { background: #ede7f3; color: #5b4080; } /* Overall */
.al-team-2 { background: #fdecd8; color: #9a5a1e; } /* Kitchen */
.al-team-3 { background: #d8efe6; color: #1e7a5a; } /* Support */
.al-team-4 { background: #f6eccf; color: #8a6a1e; } /* Wheat   */
.al-team-5 { background: #f3e0f0; color: #9a3a8a; } /* Music   */
.al-team-6 { background: #dde7f6; color: #3a5a9a; } /* AC      */
/* The viewer's own team: a clear ring in the team color + a leading dot so it
   reads as "this one's yours" at a glance. */
.al-team-mine { outline: 1.5px solid currentColor; outline-offset: 1.5px; font-weight: 800; }
.al-team-mine::before { content: "\2605"; margin-right: 0.25em; }
/* Wholesale team filter bar. Team buttons inherit their tint from the .al-team-N
   colors above; the active one gets a ring in its own color. */
.al-team-filter { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; margin: -0.4rem 0 1.4rem; }
.al-team-filter-label { font-size: 0.72rem; font-weight: 700; color: #6b5578; text-transform: uppercase; letter-spacing: 0.05em; margin-right: 0.1rem; }
.al-teamf { font-size: 0.72rem; font-weight: 600; padding: 0.3rem 0.7rem; border-radius: 6px; border: 1.5px solid transparent; cursor: pointer; font-family: inherit; line-height: 1.3; opacity: 0.72; transition: opacity 0.12s, box-shadow 0.12s; }
.al-teamf[data-team="0"] { background: #ece3f2; color: #3b1d52; }
.al-teamf:hover { opacity: 1; }
.al-teamf.active { opacity: 1; box-shadow: inset 0 0 0 1.5px currentColor; }
.al-team-filter-note { font-size: 0.72rem; color: #8a7a98; font-style: italic; }
.al-level-bar { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; padding: 0.55rem 0.9rem; background: #f2eaf6; border: 1px solid #ddd2e6; border-radius: 8px; margin-bottom: 1.25rem; font-size: 0.82rem; color: #3b1d52; }
.al-level-bar strong { color: #723063; }
.al-search-wrap { position: relative; margin-bottom: 1.5rem; }
.al-search-icon { position: absolute; left: 0.85rem; top: 50%; transform: translateY(-50%); font-size: 0.95rem; pointer-events: none; color: #9b8fa8; line-height: 1; }
.al-search-icon svg { width: 0.95rem; height: 0.95rem; }
.al-search-wrap input[type="search"] { width: 100%; box-sizing: border-box; padding: 0.7rem 1rem 0.7rem 2.6rem; font-size: 1rem; font-family: inherit; border: 2px solid #e2d7e7; border-radius: 8px; outline: none; background: #fff; color: #3b1d52; transition: border-color 0.15s, box-shadow 0.15s; }
.al-search-wrap input[type="search"]:focus { border-color: #723063; box-shadow: 0 0 0 3px rgba(114,48,99,0.08); }
.al-search-wrap input[type="search"]::-webkit-search-cancel-button,
.al-search-wrap input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
.al-search-clear { position: absolute; right: 0.75rem; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; font-size: 1rem; line-height: 1; color: #9b8fa8; padding: 0.2rem 0.3rem; border-radius: 4px; display: none; }
.al-search-clear:hover { color: #723063; }
.al-search-clear.visible { display: block; }
.al-search-none { text-align: center; color: #9b8fa8; font-size: 0.9rem; padding: 2.5rem 0 1rem; }
.al-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; align-items: stretch; }
.al-card { background: #fff; border: 1px solid #e2d7e7; border-radius: 10px; padding: 0; overflow: hidden; }
.al-card.al-council { border-color: #c4adcf; }
.al-card.al-admin { border-color: #723063; background: #fdf8fc; }
.al-card-title { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: #fff; margin: 0; padding: 0.6rem 1.1rem; background: linear-gradient(120deg, var(--purple-dark), var(--purple)); border-bottom: none; display: flex; align-items: center; gap: 0.4rem; }
.al-card.al-admin .al-card-title { background: linear-gradient(120deg, var(--purple-deeper), var(--purple-dark)); }.al-card-title .al-tier { margin-left: auto; }
@media (max-width: 900px) { .al-card-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .al-card-grid { grid-template-columns: 1fr; } }
.al-tabs { display: flex; gap: 0.35rem; margin-bottom: 1.25rem; flex-wrap: wrap; }
.al-tab { background: #f2eaf6; border: 1.5px solid #e2d7e7; color: #3b1d52; font-size: 0.8rem; font-weight: 600; padding: 0.45rem 1.1rem; border-radius: 6px; cursor: pointer; font-family: inherit; transition: background 0.15s, border-color 0.15s; }
.al-tab:hover { background: #e8dff0; border-color: #c4adcf; }
.al-tab.active { background: linear-gradient(120deg, var(--purple-dark), var(--purple)); color: #fff; border-color: transparent; }
.al-list-2col { column-count: 2; column-gap: 0; }
.al-list-2col li { break-inside: avoid; }
.al-list-2col .al-divider { column-span: all; }
.al-card-icon { font-size: 1em; line-height: 1; flex-shrink: 0; }
.al-card-icon svg { width: 1em; height: 1em; vertical-align: -0.125em; }
.al-list li { position: relative; padding-right: 1.6rem; }
.al-fav-btn { position: absolute; right: 0; top: 0; background: none; border: none; cursor: pointer; font-size: 0.82rem; line-height: 1.35; color: #c8b8d8; padding: 0; opacity: 0.25; transition: opacity 0.12s, color 0.12s; font-family: inherit; }
.al-list li:hover .al-fav-btn { opacity: 1; }
.al-fav-btn.al-fav-on { opacity: 1; color: #e8a800; }
@media (hover: hover) { .al-fav-btn:hover { color: #f5c430; } }
@media (hover: none) { .al-fav-btn { opacity: 0.55; font-size: 1rem; padding: 0 0.1rem; } }
.al-tab-favs { border-style: dashed; }
.al-tab-favs.active { border-style: solid; }
.al-fav-empty { grid-column: 1 / -1; text-align: center; color: #9b8fa8; padding: 3rem 1rem; font-size: 0.92rem; line-height: 1.7; }
.al-fav-empty-star { font-size: 1.8rem; display: block; margin-bottom: 0.4rem; color: #d4c4de; }
.al-list li.al-fav-li { display: flex; align-items: center; gap: 0.35rem; padding-right: 0.4rem !important; }
.al-fav-li .al-fav-btn { position: static; opacity: 1; }
.al-fav-li a { flex: 1; min-width: 0; }
.al-fav-handle { cursor: grab; color: #c8b8d8; font-size: 1.1rem; line-height: 1; flex-shrink: 0; user-select: none; touch-action: none; padding: 0.3rem 0.1rem; }
.al-fav-handle:active { cursor: grabbing; }
.al-fav-li.al-fav-dragging { opacity: 0.35; }
.al-fav-sep-li .al-divider { flex: 1; margin: 0 0.25rem; }
.al-fav-sep-li .al-fav-btn { color: #c8b8d8; font-size: 0.75rem; }
.al-fav-add-sep { display: block; width: 100%; background: none; border: none; border-top: 1px dashed #e0d4ec; color: #a890be; font-size: 0.78rem; padding: 0.45rem 1.1rem; text-align: left; cursor: pointer; font-family: inherit; }
.al-fav-add-sep:hover { color: #7c5295; }
.al-hint { font-size: 0.8rem; color: #9b8fa8; margin: -0.5rem 0 1rem; }

/* Tap-to-expand link descriptions (mobile-friendly replacement for hover tooltips) */
.al-desc-btn { background: none; border: none; cursor: pointer; padding: 0 0.15rem; margin-left: 0.1rem; color: #b6a8cc; line-height: 1; flex-shrink: 0; align-self: flex-start; margin-top: 0.25em; -webkit-tap-highlight-color: transparent; }
.al-desc-icon { width: 0.92em; height: 0.92em; vertical-align: -0.14em; }
.al-desc-btn.al-desc-active { color: #7c5295; }
@media (hover: hover) { .al-desc-btn:hover { color: #7c5295; } }
.al-desc { display: none; margin: 0.2rem 0 0.25rem 1.2rem; font-size: 0.82rem; line-height: 1.4; color: #6b6076; width: 100%; }
.al-desc.al-desc-on { display: block; }

/* ── admin shared: item-card, item-field, btn-save, btn-del ─────────────── */
.item-card { background: #fff; border: 1.5px solid #e4dfe4; border-radius: 10px; padding: 1rem 1.1rem; margin-bottom: 1rem; }
.item-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; padding-bottom: 0.5rem; border-bottom: 1px solid #f2eff2; }
.item-card-name { font-weight: 600; font-size: 0.95rem; color: #2d2438; }
.item-card-active { display: flex; align-items: center; gap: 0.4rem; font-size: 0.8rem; color: #555; cursor: pointer; white-space: nowrap; }
.item-card-active input[type="checkbox"] { accent-color: var(--purple); width: 16px; height: 16px; cursor: pointer; }
.item-card-top { display: flex; gap: 0.75rem; margin-bottom: 0.6rem; align-items: flex-start; }
.item-card-id { font-size: 0.75rem; color: #999; margin-bottom: 0.5rem; }
.item-card-row { display: flex; gap: 0.75rem; margin-bottom: 0.6rem; flex-wrap: wrap; }
.item-field { display: flex; flex-direction: column; gap: 0.2rem; flex: 1; min-width: 120px; }
.item-field-wide { flex: 2; }
.item-field-sort { flex: 0 0 80px; }
.item-field-num  { flex: 0 0 90px; }
.item-field label { font-family: 'Poppins', sans-serif; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: #723063; }
.item-field input[type="text"],
.item-field input[type="date"],
.item-field input[type="number"],
.item-field select,
.item-field textarea { width: 100%; padding: 0.3rem 0.5rem; font-size: 0.875rem; border: 1px solid #d1d5db; border-radius: 4px; background: #fff; box-sizing: border-box; font-family: inherit; }
.item-field input[type="text"]:focus,
.item-field input[type="date"]:focus,
.item-field input[type="number"]:focus,
.item-field select:focus,
.item-field textarea:focus { outline: none; border-color: #723063; box-shadow: 0 0 0 2px rgba(114,48,99,0.15); }
.item-field textarea { resize: vertical; min-height: 60px; }
.item-card-actions { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 0.75rem; border-top: 1px solid #f2eff2; padding-top: 0.75rem; }
.btn-save { background: var(--purple); color: #fff; border: none; border-radius: 4px; cursor: pointer; font-size: 0.85rem; padding: 0.35rem 0.9rem; }
.btn-save:hover { background: var(--purple-dark); }
.btn-del { background: transparent; color: #888; border: 1.5px solid #d1d5db; border-radius: 4px; cursor: pointer; font-size: 0.85rem; padding: 0.35rem 0.9rem; }
.btn-del:hover { background: #fef2f2; color: #b91c1c; border-color: #fca5a5; }

/* ── admin/council_member_tracker.php (cmt-) ────────────────────────────── */
.cmt-filter-bar { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.cmt-filter-bar input[type="search"] { flex: 1; max-width: 280px; padding: 0.35rem 0.6rem; font-size: 0.9rem; border: 1px solid #d1d5db; border-radius: 6px; background: #fff; font-family: inherit; }
.cmt-filter-bar input[type="search"]:focus { outline: none; border-color: #723063; box-shadow: 0 0 0 2px rgba(114,48,99,0.15); }
.cmt-filter-count { font-size: 0.82rem; color: #888; white-space: nowrap; }
#cmt-no-results { display: none; padding: 1rem 0; color: #888; font-style: italic; }
@media (max-width: 600px) {
    .cmt-filter-bar input[type="search"] { max-width: none; width: 100%; }
}

/* ── admin/update_teconnect_dev.php (dct-) ──────────────────────────────── */
.dct-banner { display: flex; align-items: flex-start; gap: 0.75rem; background: #fef3c7; border: 1px solid #f59e0b; border-radius: 8px; padding: 0.9rem 1.1rem; margin-bottom: 2rem; font-size: 0.88rem; color: #78350f; line-height: 1.5; }
.dct-banner-icon { font-size: 1.1rem; flex-shrink: 0; padding-top: 0.05rem; }
.dct-banner code { font-family: 'Courier New', monospace; font-weight: 700; background: rgba(0,0,0,0.08); padding: 0.1em 0.4em; border-radius: 3px; }
.dct-all { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 2rem; flex-wrap: wrap; }
.dct-log-wrap { display: none; margin-bottom: 2rem; }
.dct-log-wrap.visible { display: block; }
.dct-log-label { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #6b7280; margin-bottom: 0.4rem; }
.dct-log { background: #1e1e2e; color: #d4d4d8; font-family: 'Courier New', monospace; font-size: 0.82rem; line-height: 1.6; padding: 1rem 1.25rem; border-radius: 8px; white-space: pre-wrap; word-break: break-all; max-height: 460px; overflow-y: auto; margin: 0; }
.dct-list { border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; }
.dct-list-header { display: flex; justify-content: space-between; align-items: center; background: #f9fafb; padding: 0.6rem 1rem 0.6rem 2.75rem; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #6b7280; border-bottom: 1px solid #e5e7eb; }
.dct-list-meta { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #6b7280; margin-bottom: 0.85rem; }
.dct-group-header-row { display: flex; align-items: center; gap: 0.75rem; background: #f3effa; padding: 0.7rem 1rem; border-bottom: 1px solid #e5e7eb; }
.dct-group-name { flex: 1; font-size: 0.95rem; font-weight: 700; color: #4e1f44; }
.dct-group-count { display: inline-block; background: #723063; color: #fff; font-size: 0.7rem; font-weight: 700; border-radius: 999px; padding: 0.1rem 0.5rem; margin-left: 0.35rem; vertical-align: middle; }
.dct-hidden { display: none !important; }
.dct-filter { position: relative; margin-bottom: 1rem; max-width: 420px; }
.dct-filter-input { width: 100%; box-sizing: border-box; padding: 0.55rem 2.2rem 0.55rem 0.85rem; font-size: 0.9rem; border: 1px solid #d1d5db; border-radius: 6px; outline: none; transition: border-color 0.15s, box-shadow 0.15s; }
.dct-filter-input:focus { border-color: #723063; box-shadow: 0 0 0 3px rgba(114,48,99,0.12); }
.dct-filter-clear { display: none; position: absolute; top: 50%; right: 0.5rem; transform: translateY(-50%); background: none; border: none; font-size: 1.25rem; line-height: 1; color: #9ca3af; cursor: pointer; padding: 0 0.25rem; }
.dct-filter-clear:hover { color: #4e1f44; }
.dct-check input[type="checkbox"]:indeterminate + .dct-toggle { background: #b48aa9; }
.dct-check input[type="checkbox"]:indeterminate + .dct-toggle::after { transform: translateX(0.5rem); }
.dct-row { display: flex; align-items: center; padding: 0.55rem 1rem; border-bottom: 1px solid #f3f4f6; gap: 0.75rem; }
.dct-row:last-child { border-bottom: none; }
.dct-row:hover { background: #fafafa; }
.dct-check { display: flex; align-items: center; flex-shrink: 0; }
.dct-check input[type="checkbox"] { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.dct-check .dct-toggle { display: inline-block; width: 2.2rem; height: 1.2rem; background: #d1d5db; border-radius: 999px; position: relative; cursor: pointer; transition: background 0.2s; flex-shrink: 0; }
.dct-check .dct-toggle::after { content: ''; position: absolute; top: 0.17rem; left: 0.17rem; width: 0.86rem; height: 0.86rem; background: #fff; border-radius: 50%; transition: transform 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.25); }
.dct-check input[type="checkbox"]:checked + .dct-toggle { background: #723063; }
.dct-check input[type="checkbox"]:checked + .dct-toggle::after { transform: translateX(1rem); }
.dct-check input[type="checkbox"]:disabled + .dct-toggle { opacity: 0.5; cursor: not-allowed; }
.dct-tname { font-size: 1rem; color: #1e1e2e; flex: 1; }
.dct-btn { flex-shrink: 0; width: 18rem; height: 2.5rem; text-align: center; background: #723063; color: #fff; border: none; border-radius: 5px; padding: 0.3rem 0.8rem; font-size: 0.78rem; font-weight: 600; cursor: pointer; transition: background 0.15s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dct-btn:hover:not(:disabled) { background: #5a2450; }
.dct-btn.dct-btn-group { background: transparent; border: 2px solid #723063; color: #723063; }
.dct-btn.dct-btn-group:hover:not(:disabled) { background: #723063; color: #fff; }
.dct-btn:disabled, .btn.btn-purple:disabled, .btn.btn-outline-purple:disabled { opacity: 0.5; cursor: not-allowed; }
.dct-empty { color: #6b7280; font-style: italic; }
.dct-list--grouped .dct-row { padding-left: 2.75rem; }
.dct-log .dct-line-error   { color: #f87171; background: rgba(248,113,113,0.12); display: block; border-left: 3px solid #f87171; padding-left: 0.5rem; margin-left: -0.5rem; }
.dct-log .dct-line-success { color: #4ade80; display: block; }
.dct-log .dct-line-warning { color: #fbbf24; display: block; }
.dct-log-label-errors { color: #f87171; font-weight: 800; margin-left: 0.5rem; }
.dct-completion { margin-top: 0.75rem; padding: 0.75rem 1rem; border-radius: 6px; font-weight: 600; font-size: 0.88rem; display: flex; align-items: center; gap: 0.6rem; }
.dct-completion.dct-comp-success { background: #dcfce7; border: 1px solid #4ade80; color: #166534; }
.dct-completion.dct-comp-error   { background: #fee2e2; border: 1px solid #f87171; color: #991b1b; }
.dct-jump-btn { background: none; border: 1px solid currentColor; border-radius: 4px; padding: 0.2rem 0.65rem; font-size: 0.8rem; font-weight: 700; cursor: pointer; margin-left: auto; white-space: nowrap; }
.dct-jump-btn:hover { background: rgba(0,0,0,0.06); }
.dct-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.45); display: flex; align-items: center; justify-content: center; z-index: 1000; opacity: 0; pointer-events: none; transition: opacity 0.15s; }
.dct-modal-overlay.visible { opacity: 1; pointer-events: all; }
.dct-modal { background: #fff; border-radius: 10px; padding: 1.75rem 2rem 1.5rem; max-width: 400px; width: 90%; box-shadow: 0 20px 60px rgba(0,0,0,0.3); transform: translateY(-12px); transition: transform 0.15s; }
.dct-modal-overlay.visible .dct-modal { transform: translateY(0); }
.dct-modal-title { font-size: 1.05rem; font-weight: 700; color: #1e1e2e; margin: 0 0 0.5rem; }
.dct-modal-msg { margin: 0 0 0.35rem; font-size: 0.9rem; line-height: 1.6; color: #374151; }
.dct-modal-detail { margin: 0 0 1.5rem; font-size: 0.82rem; color: #6b7280; line-height: 1.5; }
.dct-modal-btns { display: flex; gap: 0.65rem; justify-content: flex-end; }
.dct-modal-btns .btn { min-width: 90px; }

/* ── admin/picture200_list.php (pl-) ────────────────────────────────────── */
.pl-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
@media (max-width: 900px) { .pl-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .pl-grid { grid-template-columns: repeat(2, 1fr); } }
.pl-item { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; }
.pl-thumb { width: 100%; aspect-ratio: 1 / 1; border-radius: 10px; object-fit: cover; display: block; background: #e5e7eb; }
.pl-filename { font-size: 0.75rem; color: #6b7280; text-align: center; word-break: break-all; }
.pl-empty { color: #6b7280; font-style: italic; padding: 2rem 0; }

/* ── admin/delegation_task_input.php (team-group-heading) ───────────────── */
.team-group-heading { font-family: 'Poppins', sans-serif; font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: #fff; background: #723063; margin: 1.5rem 0 0.5rem; padding: 0.5rem 0.75rem; border-radius: 6px; }
.team-group-heading:first-of-type { margin-top: 0; }

/* ── admin/medical_conditions_input.php (admin-table) ──────────────────── */
.admin-wrap { border-radius: 10px; border: 1.5px solid #e4dfe4; margin-bottom: 1.75rem; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.admin-table thead { background: #723063; }
.admin-table th { text-align: left; padding: 0.55rem 0.75rem; font-family: 'Poppins', sans-serif; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: #fff; white-space: nowrap; }
.admin-table td { padding: 0.48rem 0.75rem; border-bottom: 1px solid #f2eff2; vertical-align: middle; color: #4e4858; }
.admin-table tbody tr:last-child td { border-bottom: none; }
.admin-table tbody tr:nth-child(even) td { background: #faf9fa; }
.admin-table tbody tr:hover td { background: #f3eeff; }
.admin-table input[type="text"] { width: 100%; padding: 0.25rem 0.4rem; font-size: 0.85rem; border: 1px solid #d1d5db; border-radius: 4px; background: #fff; box-sizing: border-box; }
.admin-table input[type="text"]:focus { outline: none; border-color: #723063; box-shadow: 0 0 0 2px rgba(114,48,99,0.15); }
.col-id { width: 60px; color: #888; font-size: 0.8rem; }
.col-condition { width: 100%; }
.actions-cell { white-space: nowrap; text-align: center; width: 90px; }

/* ── groceries/grocery_list.php (gl-) ───────────────────────────────────── */
.gl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; margin-bottom: 1.5rem; }
.gl-card { background: #fff; border: 1px solid #e2d7e7; border-radius: 10px; padding: 1.1rem 1.25rem; }
.gl-card h3 { font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: #723063; margin: 0 0 0.75rem; padding-bottom: 0.5rem; border-bottom: 1px solid #e2d7e7; }
.gl-card ul { list-style: disc; padding-left: 1.2rem; margin: 0; font-size: 0.9rem; line-height: 1.8; color: #2a1a36; }
.gl-card ul li { margin-bottom: 0.1rem; }
.gl-card .gl-empty { font-size: 0.85rem; color: #9b8fa8; font-style: italic; }
.gl-item-for { display: block; font-size: 0.72rem; color: #9b8fa8; font-style: italic; padding-left: 0.6rem; margin-top: 0.05rem; margin-bottom: 0.2rem; }
.gl-summary { background: #f9f5f8; border: 1px solid #e2d7e7; border-radius: 10px; padding: 1rem 1.25rem; margin-bottom: 1.5rem; font-size: 0.875rem; }
.gl-summary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.5rem; }
.gl-summary table { width: 100%; border-collapse: collapse; }
.gl-summary td { padding: 0.2rem 0.75rem 0.2rem 0; vertical-align: top; line-height: 1.6; }
.gl-summary td:first-child { font-weight: 600; color: #723063; white-space: nowrap; width: 1%; }
.gl-summary-footer { margin-top: 0.4rem; padding-top: 0.4rem; border-top: 1px solid #e2d7e7; }
.gl-actions { display: flex; gap: 1rem; align-items: center; margin-bottom: 1.5rem; }
.gl-print-header { display: none; margin-bottom: 1rem; }
.gl-print-header h2 { margin: 0 0 0.25rem; font-size: 14pt; }
.gl-print-header p { margin: 0; font-size: 9pt; color: #555; }
@media print {
    .no-print { display: none !important; }
    nav, .subnav, .page-header, footer { display: none !important; }
    .gl-print-header { display: block !important; }
    body { font-size: 10pt; }
    .gl-grid { grid-template-columns: 1fr 1fr; gap: 0.5rem; }
    .gl-card { border: 1px solid #ccc; padding: 0.5rem 0.75rem; border-radius: 4px; }
    .gl-card h3 { font-size: 8pt; margin-bottom: 0.3rem; padding-bottom: 0.2rem; }
    .gl-card ul { font-size: 9pt; line-height: 1.5; }
    .gl-summary { border: 1px solid #ccc; }
    section { padding: 0 !important; }
    .section-inner { padding: 0 !important; }
}
@media (max-width: 600px) {
    .gl-grid { grid-template-columns: 1fr; }
    .gl-summary-grid { grid-template-columns: 1fr; }
    .gl-summary-footer { border-top: none; margin-top: 0; padding-top: 0; }
}

/* ── admin/links_admin.php — icon picker (la-) ───────────────────────────── */
/* ── links_admin confirm modal ───────────────────────────────────────────── */
.la-confirm-box { background: #fff; border-radius: 14px; box-shadow: 0 12px 40px rgba(114,48,99,0.22); width: min(380px, 92vw); padding: 2rem 1.75rem 1.5rem; text-align: center; }
.la-confirm-icon { width: 48px; height: 48px; background: #fef2f2; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; }
.la-confirm-icon i { width: 22px; height: 22px; color: #dc2626; }
.la-confirm-title { margin: 0 0 0.5rem; font-family: 'Poppins', sans-serif; font-size: 1rem; font-weight: 700; color: #2a1a36; }
.la-confirm-msg { margin: 0 0 1.5rem; font-size: 0.85rem; color: #6b5578; line-height: 1.5; }
.la-confirm-actions { display: flex; gap: 0.6rem; justify-content: center; }
/* Neutral (non-destructive) variant — purple icon instead of the red delete look. */
.la-confirm-box--neutral .la-confirm-icon   { background: var(--purple-pale); }
.la-confirm-box--neutral .la-confirm-icon i { color: var(--purple); }

/* ── links_admin icon picker (la-) ──────────────────────────────────────── */
.la-icon-trigger { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.3rem 0.7rem; border: 1.5px solid #c9b8d0; border-radius: 6px; background: #fff; cursor: pointer; font-size: 0.82rem; color: #4e1f44; transition: border-color 0.15s, background 0.15s; white-space: nowrap; }
.la-icon-trigger:hover { border-color: #723063; background: #fdf8fc; }
.la-icon-trigger svg, .la-icon-trigger i { width: 16px; height: 16px; flex-shrink: 0; }
.la-icon-trigger .la-icon-name { font-family: 'Inter', sans-serif; font-size: 0.78rem; color: #6b5578; }

.la-picker-overlay { position: fixed; inset: 0; background: rgba(30,10,40,0.35); z-index: 1000; display: flex; align-items: center; justify-content: center; }
.la-picker-overlay[hidden] { display: none; }
.la-picker-box { background: #fff; border-radius: 12px; box-shadow: 0 12px 40px rgba(114,48,99,0.22); width: min(640px, 96vw); max-height: 80vh; display: flex; flex-direction: column; overflow: hidden; }
.la-picker-head { padding: 0.85rem 1rem 0; display: flex; gap: 0.6rem; align-items: center; border-bottom: 1px solid #ede8f0; flex-shrink: 0; }
.la-picker-head h3 { margin: 0; font-family: 'Poppins', sans-serif; font-size: 0.9rem; font-weight: 700; color: #4e1f44; flex: 1; }
.la-picker-search { flex: 1; padding: 0.35rem 0.65rem; border: 1.5px solid #c9b8d0; border-radius: 6px; font-size: 0.82rem; font-family: 'Inter', sans-serif; outline: none; }
.la-picker-search:focus { border-color: #723063; box-shadow: 0 0 0 2px rgba(114,48,99,0.12); }
.la-picker-close { background: none; border: none; cursor: pointer; font-size: 1.3rem; line-height: 1; color: #9b8fa8; padding: 0 0.2rem; }
.la-picker-close:hover { color: #4e1f44; }

.la-picker-body { overflow-y: auto; padding: 0.75rem 1rem 1rem; }
.la-picker-group { margin-bottom: 1rem; }
.la-picker-group-label { font-size: 0.67rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #9b8fa8; margin: 0 0 0.4rem; }
.la-picker-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 4px; }
.la-picker-item { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 0.45rem 0.2rem; border: 1.5px solid transparent; border-radius: 7px; cursor: pointer; transition: border-color 0.12s, background 0.12s; background: none; }
.la-picker-item:hover { border-color: #c9b8d0; background: #fdf8fc; }
.la-picker-item.la-picker-selected { border-color: #723063; background: #fdf0f9; }
.la-picker-item i, .la-picker-item svg { width: 20px; height: 20px; color: #4e1f44; }
.la-picker-item span { font-size: 0.6rem; color: #6b5578; text-align: center; line-height: 1.2; word-break: break-all; }
.la-picker-none { padding: 2rem; text-align: center; color: #9b8fa8; font-size: 0.85rem; font-style: italic; }
.la-picker-search-result { margin-bottom: 0.5rem; }
.la-picker-search-result .la-picker-group-label { color: #723063; }

/* ── links_admin card/link editor rows ───────────────────────────────────── */
.la-filter-wrap { position: relative; display: flex; align-items: center; margin-bottom: 1.5rem; }
.la-filter-icon { position: absolute; left: 0.65rem; width: 15px; height: 15px; color: #a070b0; pointer-events: none; flex-shrink: 0; }
.la-filter-input { width: 100%; padding: 0.45rem 0.75rem 0.45rem 2.1rem; border: 1.5px solid #8a3870; border-radius: 8px; font-size: 0.88rem; font-family: 'Inter', sans-serif; outline: none; background: #fff; }
.la-filter-input:focus { border-color: #5a1f4a; box-shadow: 0 0 0 2px rgba(114,48,99,0.18); }
.la-filter-count { margin-left: 0.75rem; font-size: 0.78rem; color: #7a5898; white-space: nowrap; }

.la-section-head { display: flex; align-items: center; gap: 0.75rem; margin: 1.5rem 0 0.6rem; }
.la-section-head h2 { margin: 0; font-family: 'Poppins', sans-serif; font-size: 1rem; font-weight: 700; color: #4e1f44; }
.la-section-head .la-count { font-size: 0.75rem; color: #9b8fa8; }
.la-add-btn { margin-left: auto; }

.la-card-row { background: #fff; border: 1.5px solid #8a3870; border-radius: 10px; margin-bottom: 0.55rem; transition: border-color 0.15s, box-shadow 0.15s; overflow: hidden; }
.la-card-row.la-inactive { opacity: 0.55; }
.la-card-row.la-open { border-color: #5a1f4a; box-shadow: 0 3px 16px rgba(114,48,99,0.22); }
.la-card-head { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; cursor: pointer; user-select: none; background: #f0e4f5; transition: background 0.15s; }
.la-card-row.la-open .la-card-head { background: #e4d0ee; }
.la-card-handle { color: #a070b0; cursor: grab; font-size: 1rem; flex-shrink: 0; }
.la-card-summary { flex: 1; display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem; font-weight: 600; color: #2a1a36; }
.la-card-summary i { width: 16px; height: 16px; color: #723063; flex-shrink: 0; }
.la-card-tab-badge { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; padding: 0.1rem 0.45rem; border-radius: 99px; background: #ddc8f0; color: #4e1070; }
.la-card-tier-badge { font-size: 0.65rem; padding: 0.1rem 0.45rem; border-radius: 99px; background: #fde68a; color: #78350f; }
.la-card-chevron { margin-left: auto; color: #a070b0; transition: transform 0.2s; }
.la-card-row.la-open .la-card-chevron { transform: rotate(180deg); color: #723063; }
.la-card-body { display: none; border-top: none; padding: 0.75rem 0.85rem 0.85rem; background: #fdf8ff; border-radius: 0 0 8px 8px; }
.la-card-row.la-open .la-card-body { display: block; }
.la-card-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem 1rem; margin-bottom: 0.75rem; }
.la-field { display: flex; flex-direction: column; gap: 0.2rem; }
.la-field label { font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: #7a5898; }
.la-field input, .la-field select { padding: 0.3rem 0.5rem; border: 1.5px solid #c8a8dc; border-radius: 6px; font-size: 0.83rem; font-family: 'Inter', sans-serif; outline: none; background: #fff; }
.la-field input:focus, .la-field select:focus { border-color: #723063; box-shadow: 0 0 0 2px rgba(114,48,99,0.18); }
.la-card-actions { display: flex; gap: 0.5rem; align-items: center; margin-top: 0.25rem; }
.la-del-btn { margin-left: auto; }

.la-card-config { border: 1.5px solid #b8a060; border-radius: 8px; margin-bottom: 1rem; overflow: hidden; }
.la-card-config-head { display: flex; align-items: center; gap: 0.5rem; padding: 0.42rem 0.7rem; cursor: pointer; user-select: none; background: #f0e8c8; transition: background 0.15s; }
.la-card-config.la-cfg-open .la-card-config-head { background: #e8ddb0; }
.la-card-config-head svg, .la-card-config-head i { width: 14px; height: 14px; color: #7a6030; flex-shrink: 0; }
.la-card-config-label { flex: 1; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #4a3810; }
.la-card-config-chevron { color: #7a6030; transition: transform 0.2s; flex-shrink: 0; }
.la-card-config.la-cfg-open .la-card-config-chevron { transform: rotate(180deg); }
.la-card-config-body { display: none; padding: 0.75rem 0.8rem 0.8rem; background: #faf7ec; border-top: 1px solid #cfc080; }
.la-card-config.la-cfg-open .la-card-config-body { display: block; }

.la-links-area { margin-top: 1rem; padding-top: 0.85rem; border-top: 2px solid #c0a0d4; }
.la-links-area h4 { margin: 0 0 0.45rem; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: #7a5898; }
.la-link-row { background: #fff; border: 1px solid #8a3870; border-radius: 7px; margin-bottom: 0.35rem; transition: border-color 0.15s, box-shadow 0.15s; overflow: hidden; }
.la-link-row.la-inactive { opacity: 0.5; }
.la-link-row.la-sep-row { background: #f8f2fc; }
.la-link-row.la-open { border-color: #5a1f4a; border-width: 1.5px; box-shadow: 0 2px 8px rgba(114,48,99,0.18); }
.la-link-head { display: flex; align-items: center; gap: 0.5rem; padding: 0.4rem 0.65rem; cursor: pointer; background: #f0e4f5; transition: background 0.15s; }
.la-link-row.la-open .la-link-head { background: #e4d0ee; }
.la-link-handle { color: #a070b0; cursor: grab; font-size: 0.9rem; flex-shrink: 0; }
.la-link-summary { flex: 1; font-size: 0.8rem; color: #3d2250; display: flex; align-items: center; gap: 0.4rem; overflow: hidden; }
.la-link-summary i { width: 14px; height: 14px; color: #723063; flex-shrink: 0; }
.la-link-summary .la-link-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.la-link-summary .la-sep-label { font-style: italic; color: #8860a8; font-size: 0.75rem; }
.la-link-vis { font-size: 0.65rem; color: #7a5898; white-space: nowrap; flex-shrink: 0; }
.la-link-chevron { color: #a070b0; transition: transform 0.2s; flex-shrink: 0; }
.la-link-row.la-open .la-link-chevron { transform: rotate(180deg); color: #723063; }
.la-link-body { display: none; border-top: 1px solid #c8a8dc; padding: 0.6rem 0.7rem 0.7rem; background: #fdf8ff; border-radius: 0 0 6px 6px; }
.la-link-row.la-open .la-link-body { display: block; }
.la-link-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0.4rem 0.8rem; margin-bottom: 0.5rem; }
.la-link-fields .la-full { grid-column: 1 / -1; }
.la-link-fields textarea { width: 100%; padding: 0.3rem 0.5rem; border: 1.5px solid #c8a8dc; border-radius: 6px; font-size: 0.82rem; font-family: 'Inter', sans-serif; resize: vertical; min-height: 52px; outline: none; box-sizing: border-box; background: #fff; }
.la-link-fields textarea:focus { border-color: #723063; box-shadow: 0 0 0 2px rgba(114,48,99,0.18); }
.la-link-actions { display: flex; gap: 0.4rem; align-items: center; }
.la-add-link-btn { width: 100%; margin-top: 0.45rem; padding: 0.35rem; font-size: 0.78rem; background: none; border: 1.5px dashed #b090c8; border-radius: 7px; color: #7a5898; cursor: pointer; transition: border-color 0.15s, color 0.15s; }
.la-add-link-btn:hover { border-color: #723063; color: #723063; }

/* ============================================================
   Closing Service outline (teamonly/closing_service.php)
   ============================================================ */
.cs-note { padding: 0.8rem 1rem; margin: 0 0 0.7rem; background: #f7f4f9; border-left: 4px solid #cbb8d6; border-radius: 6px; font-size: 0.92rem; color: #3d2a48; transition: background 0.15s ease, border-color 0.15s ease; }
.cs-note p { margin: 0 0 0.5rem; }
.cs-note p:last-child { margin-bottom: 0; }

.cs-section-heading { margin: 2rem 0 1rem; padding-bottom: 0.4rem; border-bottom: 2px solid #723063; color: #4e1f44; font-family: 'Poppins', sans-serif; font-weight: 800; font-size: 1.3rem; }
.cs-section-heading:first-of-type { margin-top: 1rem; }

.cs-divider { margin: 1.6rem 0 0.6rem; font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #8a7a98; }

.cs-cue { border-left: 4px solid #e4dfe4; border-radius: 6px; padding: 0.75rem 1rem; margin: 0 0 0.6rem; background: transparent; transition: background 0.15s ease, border-color 0.15s ease; }
.cs-cue-head { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.3rem; }
.cs-cue-title { font-weight: 700; color: #2e1029; }
.cs-cue p { margin: 0 0 0.5rem; }
.cs-cue p:last-child { margin-bottom: 0; }
.cs-cue ul { margin: 0.2rem 0 0.5rem; padding-left: 1.2rem; }
.cs-cue li { margin-bottom: 0.3rem; }

.cs-pill { display: inline-block; font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.08rem 0.45rem; border-radius: 10px; line-height: 1.5; white-space: nowrap; }
.cs-pill-overall      { background: #ede7f3; color: #5b4080; }
.cs-pill-kitchen       { background: #fdecd8; color: #9a5a1e; }
.cs-pill-support       { background: #d8efe6; color: #1e7a5a; }
.cs-pill-wheat         { background: #f6eccf; color: #8a6a1e; }
.cs-pill-music         { background: #f3e0f0; color: #9a3a8a; }
.cs-pill-ac            { background: #dde7f6; color: #3a5a9a; }
.cs-pill-sd            { background: #d6eef2; color: #1e6a7a; }
.cs-pill-photographer  { background: #faedcf; color: #8a6410; }
.cs-pill-council       { background: #e3e0f6; color: #463a8a; }

.cs-script-line { border-left: 4px solid transparent; border-radius: 4px; padding: 0.35rem 0.6rem; margin: 0 0 0.35rem; transition: background 0.15s ease, border-color 0.15s ease; }
.cs-script-line p { margin: 0 0 0.35rem; }
.cs-script-line p:last-child { margin-bottom: 0; }
.cs-script-line .cs-cue-head { margin-bottom: 0.2rem; }

.cs-read { background: #f4eef9; border: 1px solid #ddccea; border-radius: 10px; padding: 0.8rem 1.1rem; margin: 0.55rem 0; font-style: italic; color: #3d2a48; }
.cs-read p { margin: 0 0 0.5rem; }
.cs-read p:last-child { margin-bottom: 0; }

.cs-blank { color: #b0a8b8; font-weight: 600; }

.cs-tl-lead { font-weight: 600; margin: 0.4rem 0 0.3rem; }
.cs-cue ul.cs-tl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.4rem 1rem; margin: 0 0 0.3rem; padding: 0; list-style: none; }
.cs-tl-grid li { font-weight: 600; color: #2e1029; }

.cs-filter { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.cs-filter-label { font-size: 0.72rem; font-weight: 700; color: #6b5578; text-transform: uppercase; letter-spacing: 0.05em; margin-right: 0.1rem; }
.cs-teamf { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.78rem; font-weight: 600; padding: 0.32rem 0.7rem; border-radius: 7px; border: 1.5px solid #ccc; background: #fff; color: #888; cursor: pointer; font-family: inherit; line-height: 1.3; transition: background 0.12s, color 0.12s, border-color 0.12s; }
.cs-teamf:hover { filter: brightness(0.97); }
.cs-swatch { display: inline-block; width: 11px; height: 11px; border-radius: 3px; flex-shrink: 0; }
.cs-clear-btn { font-size: 0.78rem; font-weight: 600; padding: 0.32rem 0.7rem; border-radius: 7px; border: 1.5px solid #cfc8d0; background: #fff; color: #6b6578; cursor: pointer; font-family: inherit; }
.cs-clear-btn:hover { border-color: #723063; color: #723063; }

.report-controls:has(.cs-filter) { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.8rem; }

.cs-hint { display: flex; align-items: flex-start; gap: 0.6rem; margin: 0 0 1rem; padding: 0.6rem 0.85rem; background: #f2ecf6; border: 1px solid #ddd0e6; border-radius: 8px; font-size: 0.82rem; color: #55415f; line-height: 1.5; }
.cs-hint strong { color: #4e1f44; font-weight: 700; }
.cs-hint-x { flex-shrink: 0; margin-left: auto; background: none; border: none; font-size: 1.15rem; line-height: 1; color: #8a7a98; cursor: pointer; padding: 0 0.15rem; font-family: inherit; }
.cs-hint-x:hover { color: #723063; }

@media print {
    .cs-hint { display: none !important; }
    .cs-cue, .cs-script-line, .cs-note {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}

@media (max-width: 640px) {
    .cs-cue ul.cs-tl-grid { grid-template-columns: 1fr 1fr; gap: 0.35rem 0.6rem; }
    .cs-teamf { padding: 0.26rem 0.55rem; font-size: 0.74rem; gap: 0.32rem; }
    .cs-swatch { width: 9px; height: 9px; }
    .cs-clear-btn { padding: 0.26rem 0.55rem; font-size: 0.74rem; }
}

@media (max-width: 640px) {
    .la-card-fields { grid-template-columns: 1fr; }
    .la-link-fields { grid-template-columns: 1fr; }
    .la-picker-grid { grid-template-columns: repeat(auto-fill, minmax(60px, 1fr)); }
}

/* ==========================================================
   shared-tools.css
   Shared patterns across tracker / commissioning / misc tool pages.
   Loaded LAST in global.css so these grouped selectors override
   any remaining duplicates in the individual tool files via cascade.
   ========================================================== */

/* ----------------------------------------------------------
   Flash banners – SUCCESS
   ---------------------------------------------------------- */
.ppt-flash--ok,
.lst-flash--ok,
.inv-saved-banner,
.sc-flash,
.srs-flash,
.te-flash,
.tev-flash,
.tie-flash,
.vie-flash {
    background: #d1fae5;
    color: #065f46;
    border: 1.5px solid #6ee7b7;
}

/* ----------------------------------------------------------
   Flash banners – WARNING
   ---------------------------------------------------------- */
.lst-flash--warn,
.srs-alert {
    background: #fef3c7;
    color: #92400e;
    border: 1.5px solid #fcd34d;
}

/* ----------------------------------------------------------
   Flash banners – ERROR
   ---------------------------------------------------------- */
.lst-flash--err,
.vie-flash--del,
.vie-error,
.te-error,
.tev-error {
    background: #fee2e2;
    color: #991b1b;
    border: 1.5px solid #fca5a5;
}

/* ----------------------------------------------------------
   Numbered circles (28×28 purple)
   ---------------------------------------------------------- */
.ppt-group-num,
.srs-guest-num {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    background: var(--purple);
    color: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
}

/* ----------------------------------------------------------
   Instructions boxes
   ---------------------------------------------------------- */
.ppt-instructions,
.inv-instructions {
    display: flex;
    gap: 0.9rem;
    align-items: flex-start;
    background: var(--gray-50);
    border: 1.5px solid var(--gray-200);
    border-radius: 12px;
    padding: 1rem 1.1rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    color: var(--gray-700);
    line-height: 1.55;
}

/* ----------------------------------------------------------
   Sticky save bars
   ---------------------------------------------------------- */
.ppt-save-bar,
.inv-save-bar,
.sc-save-bar--bottom,
.vie-submit-bar {
    position: sticky;
    bottom: 0;
    background: var(--white);
    padding: 0.9rem 1rem;
    margin-top: 1.5rem;
    z-index: 50;
}

/* ----------------------------------------------------------
   Save / submit buttons  (mirror of .btn-purple)
   ---------------------------------------------------------- */
.ppt-save-btn,
.inv-save-btn,
.te-submit-btn,
.tev-submit-btn,
.vie-submit-btn {
    background: var(--purple);
    color: var(--white);
    border: none;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.15s;
}

.ppt-save-btn:hover,
.inv-save-btn:hover,
.te-submit-btn:hover,
.tev-submit-btn:hover,
.vie-submit-btn:hover {
    background: var(--purple-dark);
}

/* ----------------------------------------------------------
   Field labels  (uppercase small caps style)
   ---------------------------------------------------------- */
.ppt-select-label,
.lst-label,
.srs-field-label,
.srs-info-label,
.te-field-label,
.tev-field-label,
.tie-field-label,
.field-label-plain {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--gray-600);
}

/* ==========================================================================
   payments.css — Team application fee & background check payment pages
   Used by: payments/index.php, payments/payment_complete.php
   ========================================================================== */

/* -- Payment card layout -------------------------------------------------- */

.payment-cards-row {
    display: flex;
    gap: 1.75rem;
    align-items: stretch;
}
.payment-cards-row .payment-card { flex: 1; margin-bottom: 0; }
@media (max-width: 700px) {
    .payment-cards-row { flex-direction: column; }
}
/* When only the team card renders (no background check card), don't let it
   stretch the full 1100px — center it at a comfortable single-card width. */
.payment-cards-row--single { max-width: 560px; margin-left: auto; margin-right: auto; }

.payment-card {
    background: #fff;
    border: 1px solid var(--gray-200);
    border-top: 4px solid var(--purple);
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(114,48,99,0.07);
    padding: 2rem 2.25rem 2.25rem;
    margin-bottom: 2.5rem;
    display: flex;
    flex-direction: column;
}

/* Team card: form grows to fill remaining space; button anchors to bottom */
.payment-card--team .payment-form {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.payment-card--team .payment-form .btn {
    margin-top: auto;
}

/* Background check card: push entire form (label + input + button) to bottom */
.payment-card--bgcheck .payment-form {
    margin-top: auto;
}
.payment-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}
.payment-card-header .section-title { margin-bottom: 0; }
.payment-card p {
    color: var(--gray-600);
    margin-bottom: 1.75rem;
    line-height: 1.65;
}
.payment-card .payment-form { max-width: 100%; }
.payment-card .payment-form .btn { width: 100%; }

.fee-badge {
    background: linear-gradient(135deg, var(--purple-dark), var(--purple));
    color: #fff;
    font-size: 1.35rem;
    font-weight: 800;
    font-family: 'Poppins', sans-serif;
    padding: 0.3rem 1rem;
    border-radius: 50px;
    white-space: nowrap;
    flex-shrink: 0;
    letter-spacing: 0.01em;
    box-shadow: 0 2px 8px rgba(114,48,99,0.25);
}

.payment-divider {
    border: none;
    border-top: 2px dashed var(--gray-200);
    margin: 0 0 2.5rem;
}

/* -- Inline notices ------------------------------------------------------- */

.payment-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    color: #b91c1c;
    padding: 0.85rem 1.1rem;
    margin-bottom: 1.25rem;
    font-size: 0.95rem;
}
.no-members-notice {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 8px;
    color: #166534;
    padding: 0.85rem 1.1rem;
    font-size: 0.95rem;
}

/* -- Toggle switch -------------------------------------------------------- */

.manual-toggle-row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 1.1rem;
    cursor: pointer;
    color: var(--gray-600);
    font-size: 0.9rem;
    user-select: none;
    width: fit-content;
}
.toggle-switch {
    position: relative;
    width: 40px;
    height: 22px;
    flex-shrink: 0;
}
.toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}
.toggle-slider {
    position: absolute;
    inset: 0;
    background: var(--gray-300, #d1d5db);
    border-radius: 22px;
    transition: background 0.2s;
}
.toggle-slider::before {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    left: 3px;
    top: 3px;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.2s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.toggle-switch input:checked + .toggle-slider { background: var(--purple); }
.toggle-switch input:checked + .toggle-slider::before { transform: translateX(18px); }

/* -- Manual name row ------------------------------------------------------ */

.manual-name-row {
    display: flex;
    gap: 0.75rem;
}
.manual-name-row .form-row { flex: 1; margin-bottom: 0; }

.form-row-2col {
    display: flex;
    gap: 1rem;
}

.form-row-2col .form-row {
    flex: 1;
}

/* -- Match-confirmed banner ----------------------------------------------- */

.match-confirmed {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    background: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 8px;
    padding: 0.6rem 0.9rem;
    margin-bottom: 1rem;
    font-size: 0.9rem;
    color: #166534;
}
.match-confirmed strong { font-weight: 600; }
.already-paid-notice {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    background: #eff6ff;
    border: 1px solid #93c5fd;
    border-radius: 8px;
    padding: 0.6rem 0.9rem;
    margin-bottom: 1rem;
    font-size: 0.9rem;
    line-height: 1.4;
    color: #1e40af;
}
.already-paid-notice strong { font-weight: 600; }
.already-paid-notice a { color: #1e40af; text-decoration: underline; }
.already-paid-notice .match-clear-btn { color: #1d4ed8; }
.already-paid-notice .match-clear-btn:hover { color: #1e3a8a; }
/* These use display:flex, which would otherwise override the `hidden` attribute. */
.match-confirmed[hidden],
.already-paid-notice[hidden] { display: none !important; }
.match-clear-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: #15803d;
    font-size: 1rem;
    line-height: 1;
    padding: 0 0.15rem;
    flex-shrink: 0;
}
.match-clear-btn:hover { color: #166534; text-decoration: underline; }

/* -- Fuzzy-match modal ---------------------------------------------------- */

.fuzzy-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 9998;
}
.fuzzy-backdrop.visible { display: block; }

.fuzzy-toast {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.92);
    opacity: 0;
    background: #fff;
    border: 1px solid var(--gray-200);
    border-top: 5px solid var(--purple);
    border-radius: 12px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.22);
    padding: 2rem 2.25rem 1.75rem;
    width: 360px;
    max-width: 92vw;
    z-index: 9999;
    transition: transform 0.2s ease, opacity 0.2s ease;
    text-align: center;
    pointer-events: none;
}
.fuzzy-toast.visible {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
    pointer-events: auto;
}
.fuzzy-toast-icon {
    font-size: 2.25rem;
    margin-bottom: 0.5rem;
    display: block;
}
.fuzzy-toast h3 {
    margin: 0 0 0.4rem;
    font-size: 1.1rem;
    color: var(--gray-900, #111827);
}
.fuzzy-toast p {
    margin: 0 0 1.25rem;
    color: var(--gray-600, #4b5563);
    font-size: 0.95rem;
    line-height: 1.5;
}
.fuzzy-toast p strong { color: var(--purple, #723063); font-weight: 700; }
.fuzzy-toast-btns {
    display: flex;
    gap: 0.6rem;
    justify-content: center;
}
.fuzzy-toast-btns .btn-yes {
    background: var(--purple, #723063);
    color: #fff;
    border: none;
    border-radius: 7px;
    padding: 0.55rem 1.5rem;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    flex: 1;
}
.fuzzy-toast-btns .btn-yes:hover { opacity: 0.88; }
.fuzzy-toast-btns .btn-no {
    background: none;
    color: var(--gray-600, #4b5563);
    border: 1px solid var(--gray-300, #d1d5db);
    border-radius: 7px;
    padding: 0.55rem 1.5rem;
    font-size: 0.95rem;
    cursor: pointer;
    flex: 1;
}
.fuzzy-toast-btns .btn-no:hover { background: var(--gray-50, #f9fafb); }

/* -- Payment complete confirmation card ----------------------------------- */

.confirm-card {
    background: #fff;
    border: 1px solid var(--gray-200);
    border-top: 4px solid var(--purple);
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(114,48,99,0.07);
    padding: 2.5rem 2.25rem;
    text-align: center;
}
.confirm-icon {
    font-size: 3rem;
    margin-bottom: 1rem;
    display: block;
}
.confirm-card p {
    color: var(--gray-600);
    line-height: 1.7;
    margin-bottom: 1rem;
}
.confirm-card .btn { margin-top: 1rem; }

/* ── CHART PAGES ─────────────────────────────────────────────────────────── */
.chart-page .section-inner { max-width: 95vw; }

.chart-card {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow-md);
    padding: 24px;
}

.chart-note {
    text-align: center;
    font-size: 13px;
    color: var(--gray-500);
    margin-top: 12px;
}

/* ── CHART FILTER CONTROLS ───────────────────────────────────────────────── */
.chart-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    margin-bottom: 16px;
}

.chart-filters form {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.chart-filters label {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--purple);
    white-space: nowrap;
}

.chart-filters select {
    padding: 0.35rem 0.65rem;
    border: 1px solid #c4b2cd;
    border-radius: 6px;
    font-size: 0.9rem;
    font-family: inherit;
    background: #fff;
    color: var(--text);
    cursor: pointer;
}

.chart-filters select:focus {
    outline: 2px solid var(--purple);
    border-color: transparent;
}

.chart-filters input[type="text"] {
    padding: 0.35rem 0.65rem;
    border: 1px solid #c4b2cd;
    border-radius: 6px;
    font-size: 0.9rem;
    font-family: inherit;
    background: #fff;
    color: var(--text);
    box-sizing: border-box;
}

.chart-filters input[type="text"]:focus {
    outline: 2px solid var(--purple);
    border-color: transparent;
}

/*
 * reports.css
 * Consolidated styles for all PHP report pages in teamonly/reports/
 * Linked via global.css — do not use @import here.
 *
 * Sections:
 *   1.  Shared report controls bar
 *   2.  Shared report table base (.report-table)
 *   3.  Shared group / section separator rows
 *   4.  Shared utility columns (col-center, col-ldr, col-count, col-tec)
 *   5.  Shared print title utility
 *   6.  Shared report total / note / summary footers
 *   7.  Shared print styles — standard report-table
 *   8.  Health / medical table (.health-table, .table-wrap)
 *   9.  Health toolbar & filter controls
 * 10.  Sensitive-column reveal
 * 10b. Health / medical print styles (toolbar hide, column widths, sens-cell reveal)
 * 11.  Shared toolbar buttons (.filter-btn, .reveal-btn, .print-btn)
 * 12.  Shared empty state
 * 13.  Shared table footer (.table-footer)
 * 14.  Comments report (comments.php, comments_test.php)
 * 15.  Council member timeline (council_member_timeline.php)
 * 16.  Meal / table card grid (meal_calling_order.php, table_list.php)
 * 17.  Talk / song list (talk_song_list.php)
 * 18.  Team registration audit (team_registration_audit.php)
 * 19.  TEC weekend metrics (tec_weekend_metrics.php)
 * 20.  TEConnect log (teconnect_log.php)
 * 21.  Communication metrics / timeline (weekender_list_communication_metrics.php)
 * 22.  Addressed-letters print page (weekender_list_addressed_letters_to_self.php)
 * 23.  Weekender support checklist (weekender_support_checklist.php)
 * 24.  Closing check-in list (weekender_list_closing_checkin.php)
 * 25.  Team shirt checklist (team_shirt_checklist.php)
 * 26.  File-unique per-report tweaks
 */


/* ============================================================
   0.  REPORT BODY WRAPPER (anchors right-aligned chrome to the table)
   ============================================================ */

/*
 * report_header.php / report_footer.php wrap the page body in .report-body.
 * On a narrow viewport a bare .report-table is wider than the screen, and the
 * .section-inner:has(.report-table) scroll container (see components.css) lets
 * it overflow. Without this rule the right-aligned .report-controls (Print) and
 * .report-total size to the scroll container's content box (the viewport), so
 * they pin to the screen's right edge — far to the left of the table's actual
 * right edge — and drift as you scroll.
 *
 * Sizing the wrapper to max-content (with min-width:100% so narrow tables still
 * fill the page on desktop) makes the wrapper as wide as the table, so its
 * right-aligned children line up with the table's right edge on every viewport.
 *
 * Scoped to a direct .report-table child so reports that scroll the table inside
 * their own .table-wrap (overflow-x:auto) are left untouched — those already
 * keep the page from going sideways.
 */
.report-body:has(> .report-table) {
    width: -webkit-max-content;
    width: max-content;
    min-width: 100%;
}

/*
 * Tighten the empty band between the subnav and the controls row. The global
 * rule (.page-subnav + section) pads the section 2rem at the top, which — added
 * to the controls' own margin — pushes the table needlessly far down when the
 * controls row only holds a Print button. Scoped to report pages via .report-body.
 */
section:has(> .section-inner > .report-body) { padding-top: 0.85rem; }
.report-body > .report-controls { margin-bottom: 0.75rem; }


/* ============================================================
   1.  SHARED REPORT CONTROLS BAR
   ============================================================ */

/* Default: print button on the right only */
.report-controls {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1.25rem;
}

/* Variant used on several reports that also have a left side */
.report-controls.ctrl-spaced {
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.report-controls .ctrl-left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.report-controls label {
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-700, #444);
}

.report-controls select.ctrl-select,
.ctrl-select {
    padding: 6px 10px;
    font-size: 13px;
    border: 1px solid var(--gray-300, #ccc);
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
}

.report-controls-right { display: flex; gap: 0.5rem; align-items: center; }
.report-controls-left  { display: flex; align-items: center; gap: 0.5rem; }


/* ============================================================
   2.  SHARED REPORT TABLE BASE (.report-table)
   ============================================================ */

.report-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Inter', 'Segoe UI', sans-serif;
    font-size: 12px;
}

/* Default header — purple fill */
.report-table thead th {
    background: var(--purple, #6b4fa0);
    color: #fff;
    padding: 7px 8px;
    text-align: left;
    font-weight: 600;
    white-space: nowrap;
}

/* Default body cells */
.report-table tbody td {
    padding: 4px 8px;
    border-bottom: 1px solid var(--gray-200, #e5e5e5);
    white-space: nowrap;
}

/* Alternating rows — used by the majority of reports */
.report-table tbody tr:nth-child(odd)  td { background: #f3f3f3; }
.report-table tbody tr:nth-child(even) td { background: #ffffff; }

/* Variant: striping only on .data-row (used where separator rows exist) */
.report-table tbody tr.data-row:nth-child(odd)  td { background: #f3f3f3; }
.report-table tbody tr.data-row:nth-child(even) td { background: #ffffff; }

/* Variant: even-only highlight (team_list_all_recent_*, team_list_current_cancelations) */
.report-table tbody tr.data-row:nth-child(even) td { background: var(--gray-50, #f9f9f9); }

/* Links inside report tables */
.report-table a {
    color: var(--purple-dark, #4a2d72);
    text-decoration: none;
    font-weight: 500;
}
.report-table a:hover { text-decoration: underline; }


/* ============================================================
   3.  SHARED GROUP / SECTION SEPARATOR ROWS
   ============================================================ */

/*
 * Generic group separator — used as tr.group-row, tr.tec-row, tr.team-row,
 * tr.gender-row (strong variant) across many reports.
 * Each report uses a different tr class name but the rules are identical.
 */
tr.group-row td,
tr.tec-row td,
tr.team-row td,
tr.gender-row td {
    font-weight: 700;
    font-size: 13px;
    color: var(--purple-dark, #4a2d72);
    padding: 10px 8px 4px;
    background: #fff !important;
    border-bottom: 2px solid var(--purple, #6b4fa0);
}

/* Spacer row between groups */
tr.spacer-row td {
    height: 14px;
    background: #fff !important;
    border: none;
}


/* ============================================================
   4.  SHARED UTILITY COLUMNS
   ============================================================ */

td.col-center { text-align: center; }

td.col-ldr {
    text-align: center;
    width: 40px;
    font-size: 14px;
    color: var(--purple, #6b4fa0);
}

td.col-tec  { text-align: center; }


/* ============================================================
   5.  SHARED PRINT TITLE UTILITY
   ============================================================ */

/* Hidden on screen; shown when printing */
.print-title { display: none; }


/* ============================================================
   6.  SHARED REPORT FOOTER LINES
   ============================================================ */

.report-total {
    text-align: right;
    font-family: Inter, sans-serif;
    font-size: 12px;
    color: var(--gray-600, #666);
    margin-top: 0.5rem;
}

.report-note {
    font-family: Inter, sans-serif;
    font-size: 12px;
    color: var(--gray-600, #666);
    margin-top: 0.25rem;
    line-height: 1.6;
}

.report-summary {
    text-align: right;
    font-family: Inter, sans-serif;
    font-size: 12px;
    color: var(--gray-600, #666);
    margin-top: 0.25rem;
}


/* ============================================================
   7.  SHARED PRINT STYLES — STANDARD REPORT TABLE
   ============================================================ */

@media print {
    /* Hide chrome */
    .page-header, nav, .subnav, .photo-strip-wrap,
    .report-controls, footer { display: none !important; }

    body { background: #fff; overflow: hidden; }
    .report-table { width: 100%; table-layout: auto; }
    .section-inner { max-width: 100% !important; overflow: hidden; }

    /* Print title shown */
    .print-title {
        display: block !important;
        font-family: 'Segoe UI', sans-serif;
        font-size: 13pt;
        font-weight: 700;
        margin-bottom: 0.4rem;
    }

    /* Table header in print */
    .report-table thead th {
        background: #fff !important;
        color: #000 !important;
        border-top: 2px solid #000;
        border-bottom: 1px solid #000;
        font-size: 8pt;
        padding: 2px 4px;
    }

    /* Table body in print */
    .report-table tbody td {
        font-size: 8pt;
        padding: 2px 4px;
        border-bottom: none;
        white-space: normal;
    }

    /* Preserve alternating row shading in print */
    .report-table tbody tr:nth-child(odd) td,
    .report-table tbody tr.data-row:nth-child(odd) td {
        background: #f3f3f3 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .report-table tbody tr:nth-child(even) td,
    .report-table tbody tr.data-row:nth-child(even) td { background: #fff !important; }

    /* Group separator rows in print */
    tr.group-row td,
    tr.tec-row td,
    tr.team-row td,
    tr.gender-row td {
        font-size: 9pt;
        padding: 5px 4px 2px;
        border-bottom: 1px solid #000;
    }

    .report-total,
    .report-note,
    .report-summary { font-size: 8pt; }

    section { padding: 0 !important; }

    /* Default page — landscape; individual files override as needed */
    @page { size: landscape; margin: 0.5in; }
}


/* ============================================================
   8.  HEALTH / MEDICAL TABLE
       (health_form_list.php, medical_needs.php)
   ============================================================ */

.table-wrap {
    overflow-x: auto;
    border-radius: var(--radius);
    border: 1px solid var(--gray-200);
    box-shadow: var(--shadow-sm);
}

.health-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
    background: var(--white);
    white-space: nowrap;
}

.health-table th {
    background: var(--purple, #6b4fa0);
    color: #fff;
    font-size: 0.69rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    padding: 0.6rem 0.75rem;
    border-bottom: 2px solid var(--purple-dark, #5a3d8a);
    text-align: left;
    position: sticky;
    top: 0;
    z-index: 1;
}

.health-table th:first-child { border-left: none; }

.health-table td {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--gray-100);
    vertical-align: top;
    color: var(--text);
    white-space: normal;
    max-width: 200px;
}

.health-table td.nowrap { white-space: nowrap; max-width: none; }
.health-table tbody tr:last-child td { border-bottom: none; }
.health-table tbody tr:nth-child(even) td { background: var(--gray-50); }
.health-table tbody tr:hover td { background: var(--purple-pale); }

.health-table a {
    color: var(--purple);
    text-decoration: underline;
    text-underline-offset: 2px;
    font-weight: 600;
}
.health-table a:hover { color: var(--purple-dark); }

/* ── EMPTY STATE ── */
.empty-state {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--gray-500);
}
.empty-state svg { margin: 0 auto 1rem; display: block; opacity: 0.35; }
.empty-state h3 { font-size: 1.1rem; font-weight: 600; color: var(--gray-700); margin-bottom: 0.4rem; }
.empty-state p { font-size: 0.9rem; }

/* ── TABLE FOOTER ── */
.table-footer {
    margin-top: 0.75rem;
    font-size: 0.8rem;
    color: var(--gray-500);
    text-align: right;
}


/* ============================================================
   9.  HEALTH TOOLBAR & FILTER CONTROLS
       (health_form_list.php — shared patterns also in medical_needs.php)
   ============================================================ */

.health-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.toolbar-left {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.toolbar-right { display: flex; gap: 0.5rem; align-items: center; }

.filter-group {
    display: flex;
    gap: 0.25rem;
}

.filter-sep {
    display: flex;
    align-items: center;
    color: var(--gray-300);
    font-size: 1rem;
    padding: 0 0.1rem;
    user-select: none;
}

/* ── INFO PANEL (health_form_list.php) ── */
.info-panel {
    display: none;
    background: var(--gray-50);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    font-size: 0.83rem;
    color: var(--gray-700);
    line-height: 1.7;
}
.info-panel.open { display: block; }
.info-panel-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 0.25rem 2rem;
}
.info-panel strong { color: var(--gray-800); }


/* ============================================================
   10.  SENSITIVE-COLUMN REVEAL
        (health_form_list.php, medical_needs.php)
   ============================================================ */

.health-table th.sens-col::after {
    content: ' 🔒';
    font-size: 0.65rem;
    opacity: 0.6;
}

.health-table.show-sensitive th.sens-col::after { content: ' 🔓'; }

.health-table td.sens-cell {
    filter: blur(5px);
    user-select: none;
    cursor: pointer;
    transition: filter 0.2s;
}

.health-table.show-sensitive td.sens-cell,
.health-table td.sens-cell.cell-revealed {
    filter: none;
    cursor: default;
}


/* ── Print — health / medical tables ─────────────────────────
   (health_form_list.php, medical_needs.php)
   ──────────────────────────────────────────────────────────── */
@media print {
    /* Hide toolbars & chrome specific to these pages */
    .health-toolbar, .med-toolbar, .info-toggle,
    .info-panel { display: none !important; }

    /* Table layout */
    .health-table {
        font-size: 7pt;
        table-layout: fixed;
        width: 100%;
    }
    .health-table th, .health-table td {
        white-space: normal !important;
        max-width: none !important;
        word-break: break-word;
        padding: 0.3rem 0.4rem;
    }
    .health-table th {
        background: #f0f0f0 !important;
        position: static;
    }
    .health-table th.sens-col::after { content: '' !important; }
    .health-table tbody tr:nth-child(even) td { background: #f8f8f8 !important; }
    .health-table tbody tr:hover td { background: inherit !important; }

    /* Always reveal sensitive cells when printing */
    .health-table td.sens-cell {
        filter: none !important;
        cursor: default !important;
    }

    /* health_form_list.php — 11-column widths (landscape) */
    /* Name · Emerg · Clinic · Ins · FoodAlg · MedAlg · Meds · Req · Restrict · OTC · Cond */
    .health-table th:nth-child(1),  .health-table td:nth-child(1)  { width: 9%;  }
    .health-table th:nth-child(2),  .health-table td:nth-child(2)  { width: 11%; }
    .health-table th:nth-child(3),  .health-table td:nth-child(3)  { width: 9%;  }
    .health-table th:nth-child(4),  .health-table td:nth-child(4)  { width: 10%; }
    .health-table th:nth-child(5),  .health-table td:nth-child(5)  { width: 8%;  }
    .health-table th:nth-child(6),  .health-table td:nth-child(6)  { width: 8%;  }
    .health-table th:nth-child(7),  .health-table td:nth-child(7)  { width: 10%; }
    .health-table th:nth-child(8),  .health-table td:nth-child(8)  { width: 5%;  }
    .health-table th:nth-child(9),  .health-table td:nth-child(9)  { width: 9%;  }
    .health-table th:nth-child(10), .health-table td:nth-child(10) { width: 5%;  }
    .health-table th:nth-child(11), .health-table td:nth-child(11) { width: 16%; }

    /* Row-missing highlight (print) */
    .health-table tbody tr.row-missing td { background: #fff8dc !important; }

    /* Badge and link adjustments */
    .no-form-badge { background: #ffe; border: 1px solid #aaa; }
    .health-table a { color: #000 !important; text-decoration: none !important; }
    .name-team { color: #555 !important; }

    .table-footer { display: none; }
    @page { size: landscape; margin: 0.4in; }
}


/* ============================================================
   11.  SHARED TOOLBAR BUTTONS
   ============================================================ */

/* Filter toggle buttons (group of pills) */
.filter-btn {
    display: inline-block;
    padding: 0.3rem 0.85rem;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    text-decoration: none;
    border: 1.5px solid var(--gray-300);
    color: var(--gray-600);
    background: var(--white);
    cursor: pointer;
    transition: all 0.15s;
    line-height: 1.6;
}
.filter-btn:hover  { border-color: var(--purple); color: var(--purple); background: var(--purple-pale); }
.filter-btn.active { background: var(--purple); border-color: var(--purple); color: var(--white); }

/* Limit buttons (tec_weekend_metrics.php) */
.limit-btn {
    display: inline-block;
    padding: 0.3rem 0.75rem;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    text-decoration: none;
    border: 1.5px solid var(--gray-300);
    color: var(--gray-600);
    background: var(--white);
    cursor: pointer;
    transition: all 0.15s;
    line-height: 1.6;
}
.limit-btn:hover  { border-color: var(--purple); color: var(--purple); background: var(--purple-pale); }
.limit-btn.active { background: var(--purple); border-color: var(--purple); color: var(--white); }

/* Reveal sensitive data button */
.reveal-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.85rem;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    background: var(--white);
    border: 1.5px solid var(--gray-300);
    color: var(--gray-600);
    cursor: pointer;
    transition: all 0.15s;
}
.reveal-btn:hover  { border-color: #7c3aed; color: #7c3aed; background: #f5f3ff; }
.reveal-btn.active { background: #7c3aed; border-color: #7c3aed; color: var(--white); }

/* Info toggle button (health_form_list.php) */
.info-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.85rem;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    background: var(--white);
    border: 1.5px solid var(--gray-300);
    color: var(--gray-600);
    cursor: pointer;
    transition: all 0.15s;
}
.info-toggle:hover { border-color: var(--purple); color: var(--purple); }

/* "Missing forms" filter button (health_form_list.php) */
.missing-btn {
    display: inline-block;
    padding: 0.3rem 0.85rem;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    border: 1.5px solid var(--gray-300);
    color: var(--gray-600);
    background: var(--white);
    cursor: pointer;
    transition: all 0.15s;
    line-height: 1.6;
}
.missing-btn:hover  { border-color: #d97706; color: #d97706; background: #fffbeb; }
.missing-btn.active { background: #d97706; border-color: #d97706; color: var(--white); }

/* Print button (shared across many reports) */
.print-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 1rem;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    background: var(--white);
    border: 1.5px solid var(--gray-300);
    color: var(--gray-600);
    cursor: pointer;
    transition: all 0.15s;
}
.print-btn:hover { border-color: var(--purple); color: var(--purple); }


/* ============================================================
   12.  SHARED EMPTY STATE
   (already defined above under §8 — kept here as a no-op note)
   ============================================================ */
/*  .empty-state rules are in section 8 above  */


/* ============================================================
   13.  SHARED TABLE FOOTER
   ============================================================ */
/* .table-footer defined in section 8 above */

/* Variant with flex row (health_form_list.php) */
.table-footer.flex-row {
    display: flex;
    justify-content: flex-end;
    gap: 1.25rem;
}
.table-footer span { display: inline-flex; align-items: center; gap: 0.3rem; }


/* ============================================================
   14.  COMMENTS REPORT
        comments.php  /  comments_test.php
   ============================================================ */

.cm-card {
    background: #fff;
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    overflow: hidden;
    margin-bottom: 1rem;
}

.cm-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 1.1rem; /* comments.php; comments_test.php uses 0.9rem — overridden per-file */
    line-height: 1.6;
}

.cm-table th {
    padding: 0.3rem 0.75rem;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gray-500);
    border-bottom: 2px solid var(--gray-200);
    text-align: left;
}
.cm-table th.cm-col-seq,
.cm-table th.cm-col-chk { text-align: center; }

.cm-table td {
    padding: 0.6rem 0.75rem;
    vertical-align: top;
    border-bottom: 1px solid var(--gray-200);
}

.cm-table tr:last-child td { border-bottom: none; }
.cm-row-alt td { background: var(--gray-50); }

/* Sequence number column */
.cm-col-seq {
    width: 2.75rem;
    text-align: center;
    color: var(--gray-500);
    font-size: 0.78rem;
}
.cm-seq-chunk { white-space: nowrap; }

/* Priority / complete flag column */
.cm-col-flag {
    width: 1.75rem;
    text-align: center;
}
.cm-flag-priority { font-weight: 700; color: #b91c1c; font-size: 1rem; }
.cm-flag-done     { color: #16a34a; font-size: 1rem; }

/* Checkbox columns (Discuss, Priority, Complete) */
.cm-col-chk {
    width: 2rem;
    text-align: center;
    vertical-align: middle;
    padding-top: 0.65rem;
}
.cm-col-chk input[type="checkbox"] {
    cursor: pointer;
    width: 1.1rem;
    height: 1.1rem;
    accent-color: var(--purple);
}
.cm-col-chk input[type="checkbox"]:disabled {
    opacity: 0.5;
    cursor: wait;
}
@media print {
    .cm-col-chk { display: none; }
}

/* TEC number column (comments.php) */
.cm-col-tec {
    width: 4rem;
    white-space: nowrap;
    color: var(--gray-500);
    font-size: 0.8rem;
}

/* Submitted-by column (comments_test.php) */
.cm-col-by {
    width: 10rem;
    white-space: nowrap;
    color: var(--gray-600);
    font-size: 0.85rem;
}
.cm-col-by-empty { color: var(--gray-400); font-style: italic; }

/* Timestamp column (comments_test.php) */
.cm-col-ts {
    width: 10rem;
    white-space: nowrap;
    color: var(--gray-500);
    font-size: 0.78rem;
}

/* Comment text column */
.cm-col-text {
    white-space: pre-wrap;
    word-break: break-word;
}

/* Grouped-comment divider (comments.php) */
.cm-divider {
    border: none;
    border-top: 2px solid var(--gray-300);
    margin: 0.5rem 0;
}

/* TEC-number header row (comments.php) */
.cm-tec-header td {
    background: var(--purple-pale) !important;
    color: var(--purple-dark);
    font-weight: 600;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    padding: 0.35rem 0.75rem;
}

/* "Discussed" separator row (comments.php) */
.cm-discussed td {
    background: var(--purple) !important;
    color: #fff;
    font-weight: 600;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    padding: 0.35rem 0.75rem;
}

/* Completed rows: muted */
.cm-row-done .cm-col-text { color: var(--gray-500); }
.cm-row-done .cm-col-seq  { color: var(--gray-400); }

/* Record count */
.cm-count {
    font-size: 0.75rem;
    color: var(--gray-500);
    text-align: right;
    margin-top: 0.35rem;
}

/* Disclaimer */
.cm-disclaimer {
    font-size: 0.8rem;
    color: var(--gray-500);
    border-top: 1px solid var(--gray-200);
    margin-top: 1.25rem;
    padding-top: 0.75rem;
    line-height: 1.7;
}

.cm-wrap { padding: 0 0 1.5rem; }

/* ── Name / meta within health and comment rows (shared pattern) ── */
.name-meta {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.2rem;
    flex-wrap: wrap;
}
.name-team {
    font-size: 0.71rem;
    color: var(--gray-500);
    font-weight: 500;
}

/* ── Print — comments ── */
@media print {
    .cm-card  { border: none; border-radius: 0; }
    .cm-table { font-size: 9pt; }
    .cm-table td { padding: 2px 5px; }
    .cm-wrap  { padding: 0; }
}

/* ── Mobile — comments ── */
@media (max-width: 600px) {
    .cm-col-tec { display: none; }
    .cm-col-ts  { display: none; }
    .cm-table   { font-size: 0.85rem; }
}


/* ============================================================
   15.  COUNCIL MEMBER TIMELINE
        council_member_timeline.php
   ============================================================ */

.timeline-controls {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
}

.timeline-filter {
    flex: 1;
    min-width: 220px;
    max-width: 380px;
    padding: 0.55rem 0.9rem 0.55rem 2.4rem;
    border: 1.5px solid var(--gray-300);
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 0.875rem;
    color: var(--text);
    background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a8096' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat 0.65rem center;
    transition: border-color 0.2s, box-shadow 0.2s;
    outline: none;
}
.timeline-filter:focus {
    border-color: var(--purple);
    box-shadow: 0 0 0 3px rgba(114,48,99,0.12);
}
.timeline-filter::placeholder { color: var(--gray-400); }

.timeline-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    margin-bottom: 1.25rem;
    font-size: 0.78rem;
}
.legend-item {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--gray-700);
    white-space: nowrap;
}
.legend-swatch {
    width: 14px;
    height: 14px;
    border-radius: 3px;
    flex-shrink: 0;
}

/* ── Gantt shell ── */
.gantt-outer {
    overflow-x: auto;
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    background: var(--white);
}
.gantt { min-width: 860px; }

/* Shared two-column layout: label | track */
.g-row { display: flex; align-items: stretch; }
.g-label {
    width: 195px;
    flex-shrink: 0;
    padding: 0 0.75rem 0 1rem;
    box-sizing: border-box;
    border-right: 1px solid var(--gray-200);
    display: flex;
    align-items: center;
    font-size: 0.8rem;
    color: var(--gray-700);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.g-track { flex: 1; position: relative; min-height: 1px; }

/* Ruler sticky wrapper */
.gantt-ruler-wrap {
    position: sticky;
    top: 0;
    z-index: 20;
    overflow: hidden;
    border: 1px solid var(--gray-200);
    border-bottom: 2px solid var(--gray-200);
    border-radius: var(--radius) var(--radius) 0 0;
    background: var(--gray-50);
    box-shadow: var(--shadow-sm);
    margin-bottom: -1px;
}

/* Year ruler */
.gantt-ruler {
    height: 38px;
    min-width: 860px;
    background: var(--gray-50);
}
.gantt-ruler .g-label {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--gray-500);
    padding-bottom: 0;
}
.year-tick {
    position: absolute;
    bottom: 7px;
    transform: translateX(-50%);
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--gray-500);
    white-space: nowrap;
    pointer-events: none;
}
.year-vline {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: var(--gray-200);
    pointer-events: none;
}

/* Position group header */
.gantt-group { border-top: 2px solid var(--gray-200); }
.gantt-group-hdr { height: 28px; background: var(--gray-100); }
.gantt-group-hdr .g-label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--purple-dark);
}

/* Member row */
.gantt-row {
    height: 36px;
    border-top: 1px solid var(--gray-100);
    transition: background 0.12s;
}
.gantt-row:hover { background: var(--purple-pale); }
.gantt-row .g-label { color: var(--gray-800); }

/* Bar */
.g-bar {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    height: 22px;
    border-radius: 5px;
    min-width: 5px;
    cursor: pointer;
    transition: opacity 0.15s, filter 0.15s;
}
.g-bar:hover { opacity: 0.82; filter: brightness(1.14); }

/* Tooltip */
.g-tip {
    display: none;
    position: fixed;
    background: var(--gray-900);
    color: var(--white);
    padding: 0.5rem 0.85rem;
    border-radius: 8px;
    font-size: 0.78rem;
    line-height: 1.55;
    pointer-events: none;
    z-index: 9999;
    max-width: 270px;
    box-shadow: var(--shadow-lg);
}

/* Empty state */
.gantt-empty {
    padding: 3rem 2rem;
    text-align: center;
    color: var(--gray-500);
    font-size: 0.9rem;
}

.gantt-hidden { display: none !important; }


/* ============================================================
   16.  MEAL / TABLE CARD GRID
        meal_calling_order.php  /  table_list.php
   ============================================================ */

.table-groups {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 1rem;
    justify-content: space-between;
}
.table-group {
    width: calc(50% - 8px);
    background: #f9f9f9;
    padding: 12px 16px;
    box-sizing: border-box;
    border: 1px solid #d0c0cc;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
@media (max-width: 640px) {
    .table-group { width: 100%; }
}
.table-group h3 {
    margin: 0 0 6px;
    font-size: 15px;
    font-family: 'Inter', 'Segoe UI', sans-serif;
    color: var(--purple-dark, #4a2d72);
    border-bottom: 1px solid #ccc;
    padding-bottom: 4px;
}
.members {
    margin: 8px 0 0 0;
    padding-left: 18px;
    font-family: 'Inter', sans-serif;
}
.members li { margin-bottom: 3px; font-size: 13px; }

/* table_list.php extras */
.tg-meta  { font-size: 13px; margin-bottom: 2px; font-family: 'Inter', sans-serif; }
.tg-label { font-weight: 600; margin-right: 4px; }

/* ── Print — card grid ── */
@media print {
    .table-groups { gap: 10px; }
    .table-group {
        width: calc(50% - 5px);
        background: #fff;
        border: 1px solid #000;
        box-shadow: none;
        page-break-inside: avoid;
        padding: 10px 12px;
        break-after: auto !important;
    }
    .table-group h3    { font-size: 13pt; border-bottom: 1px solid #000; }
    .members li        { font-size: 11pt; }
    .tg-meta           { font-size: 11pt; }
    /* table_list.php page-break cycle */
    .table-group:nth-of-type(4n) { break-after: page; }
    .table-group:last-of-type    { break-after: auto !important; }
}


/* ============================================================
   17.  TALK / SONG LIST
        talk_song_list.php
   ============================================================ */

.ts-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 1rem;
}

.ts-table-wrap {
    overflow-x: auto;
    border-radius: 10px;
    border: 1px solid var(--gray-200);
    box-shadow: var(--shadow-sm);
}

.ts-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    font-family: 'Inter', sans-serif;
}
.ts-table thead { position: sticky; top: 0; z-index: 2; }
.ts-table th {
    background: var(--purple);
    color: var(--white);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.55rem 0.75rem;
    white-space: nowrap;
    text-align: left;
    border-bottom: 2px solid var(--purple-dark);
}
.ts-table th:first-child { border-radius: 10px 0 0 0; }
.ts-table th:last-child  { border-radius: 0 10px 0 0; }

.ts-table td {
    padding: 0.45rem 0.75rem;
    vertical-align: top;
    border-bottom: 1px solid var(--gray-100);
    min-width: 130px;
}
.ts-table td:first-child {
    min-width: auto;
    font-weight: 700;
    font-size: 13px;
    color: var(--purple-dark);
    white-space: nowrap;
    vertical-align: middle;
}
.ts-table tbody tr:nth-child(even) td { background: var(--gray-50); }
.ts-table tbody tr:hover td { background: var(--purple-pale); }

.song-artist {
    display: block;
    color: var(--gray-600);
    font-size: 11px;
    margin-top: 2px;
}
.song-speaker {
    display: block;
    font-style: italic;
    color: var(--gray-500);
    font-size: 11px;
    margin-top: 3px;
    border-top: 1px solid var(--gray-100);
    padding-top: 2px;
}
.song-empty { color: var(--gray-300); font-size: 13px; }

.ts-table a { text-decoration: none; color: var(--purple); }
.ts-table a:hover { text-decoration: underline; }

/* ── Print — talk/song ── */
@media print {
    .ts-toolbar { display: none !important; }
    .ts-table-wrap { box-shadow: none; border: none; overflow: visible; }
    .ts-table { font-size: 7pt; table-layout: fixed; width: 100%; }
    .ts-table thead { position: static; }
    .ts-table th { background: #ede !important; color: #000 !important; }
    .ts-table th, .ts-table td {
        white-space: normal !important;
        padding: 0.25rem 0.3rem;
        word-break: break-word;
    }
    .ts-table tbody tr:nth-child(even) td { background: #f8f8f8 !important; }
    .ts-table tbody tr:hover td { background: inherit !important; }
    .ts-table a { color: #000 !important; text-decoration: none !important; }
    .song-artist  { color: #444 !important; }
    .song-speaker { color: #555 !important; border-top-color: #ddd !important; }
    @page { size: landscape; margin: 0.4in; }
}


/* ============================================================
   18.  TEAM REGISTRATION AUDIT
        team_registration_audit.php
   ============================================================ */

.audit-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.legend {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}
/* .legend-item already defined in §15; audit uses same pattern */
.legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}
.legend-dot.mismatch  { background: #dc2626; }
.legend-dot.normalized { background: #d97706; }

/* Person cards */
.audit-list { display: flex; flex-direction: column; gap: 1rem; }
.audit-card {
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    background: var(--white);
    overflow: hidden;
}
.audit-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.1rem;
    background: var(--gray-50);
    border-bottom: 1px solid var(--gray-200);
    gap: 1rem;
    flex-wrap: wrap;
}
.audit-name {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--purple-dark);
}
.audit-badges { display: flex; gap: 0.4rem; align-items: center; flex-wrap: wrap; }

.diff-count-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.18rem 0.6rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}
.diff-count-badge.has-real {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fca5a5;
}
.diff-count-badge.normalized-only {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fcd34d;
}

.toggle-all-btn {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--purple);
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    font-family: 'Inter', sans-serif;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.toggle-all-btn:hover { color: var(--purple-dark); }

/* Diff table */
.diff-table { width: 100%; border-collapse: collapse; font-size: 0.855rem; }
.diff-table th {
    padding: 0.5rem 1rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: var(--gray-500);
    background: var(--gray-50);
    border-bottom: 1px solid var(--gray-200);
    text-align: left;
}
.diff-table th:first-child { width: 120px; }
.diff-table td {
    padding: 0.5rem 1rem;
    border-bottom: 1px solid var(--gray-100);
    vertical-align: middle;
}
.diff-table tr:last-child td { border-bottom: none; }
.diff-table .field-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--gray-500);
}
.diff-table tr.row-match td       { color: var(--gray-400); }
.diff-table tr.row-match .field-label { color: var(--gray-300); }
.diff-table tr.row-hidden          { display: none; }

.diff-table tr.row-mismatch td:nth-child(2),
.diff-table tr.row-mismatch td:nth-child(3) { font-weight: 600; }
.val-reg.mismatch   { color: #dc2626; }
.val-mc.mismatch    { color: #dc2626; }
.val-reg.normalized { color: #d97706; }
.val-mc.normalized  { color: #d97706; }

/* Audit footer count */
.audit-footer {
    margin-top: 1.5rem;
    font-size: 0.8rem;
    color: var(--gray-500);
    text-align: right;
}

/* ── Print — audit ── */
@media print {
    .audit-toolbar { display: none !important; }
    .audit-card { box-shadow: none; border: 1px solid #ccc; break-inside: avoid; }
    .audit-card-head { background: #f5f5f5 !important; }
    .diff-table tr.row-hidden { display: table-row !important; }
    section { padding: 0.5rem 0 !important; }
    @page { size: portrait; margin: 0.5in; }
}


/* ============================================================
   19.  TEC WEEKEND METRICS
        tec_weekend_metrics.php
   ============================================================ */

.metrics-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}

.toolbar-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gray-600);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    white-space: nowrap;
}

.limit-btns { display: flex; gap: 0.25rem; }

.metrics-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
    background: var(--white);
}
.metrics-table th {
    background: var(--gray-50);
    color: var(--gray-600);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    padding: 0.75rem 1rem;
    border-bottom: 2px solid var(--gray-200);
    text-align: left;
    white-space: nowrap;
}
.metrics-table th:first-child { border-left: 4px solid var(--purple); }
.metrics-table td {
    padding: 0.65rem 1rem;
    border-bottom: 1px solid var(--gray-100);
    vertical-align: top;
    color: var(--text);
}
.metrics-table tbody tr:last-child td { border-bottom: none; }
.metrics-table tbody tr:nth-child(even) td { background: var(--gray-50); }
.metrics-table tbody tr:hover td { background: var(--purple-pale); }

.tec-num {
    font-family: 'Poppins', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--purple);
}
.location-text { color: var(--gray-700); font-size: 0.85rem; }

/* Pill badges */
.pills { display: flex; flex-wrap: wrap; gap: 0.3rem; padding: 0.15rem 0; }
.pill {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: all 0.15s;
}
.pill-city { background: #eef2ff; color: #3b4bbf; border: 1px solid #c7d0f8; }
.pill-city:hover { background: #3b4bbf; color: var(--white); border-color: #3b4bbf; }
.pill-tec  { background: var(--purple-pale); color: var(--purple-dark); border: 1px solid #ddc8d8; }
.pill-tec:hover { background: var(--purple); color: var(--white); border-color: var(--purple); }
.pill-count { font-weight: 700; opacity: 0.75; font-size: 0.72rem; }

/* ── Print — metrics ── */
@media print {
    .metrics-toolbar { display: none !important; }
    .table-wrap { box-shadow: none; border: none; }
    .metrics-table th { background: #f0f0f0 !important; }
    .metrics-table tbody tr:nth-child(even) td { background: #f8f8f8 !important; }
    .metrics-table tbody tr:hover td { background: transparent !important; }
    .pill { border: 1px solid #ccc !important; }
    section { padding: 0.5rem 0 !important; }
    @page { size: landscape; margin: 0.4in; }
}


/* ============================================================
   20.  TECONNECT LOG
        teconnect_log.php
   ============================================================ */

td.col-time   { white-space: nowrap; width: 100px; }
td.col-action { white-space: normal; word-break: break-word; }

/* User separator — dark purple */
tr.user-row td {
    font-weight: 700;
    font-size: 13px;
    color: #fff;
    padding: 8px 8px 6px;
    background: #4d1f42 !important;
    border-bottom: 2px solid #3a1530;
}

/* Date separator — light gray */
tr.date-row td {
    font-weight: 600;
    font-size: 12px;
    color: #444;
    padding: 5px 8px 3px;
    background: #e8e8e8 !important;
    border-bottom: 1px solid #ccc;
}

/* ── Print — log ── */
@media print {
    tr.user-row td {
        background: #4d1f42 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        font-size: 9pt;
        padding: 4px;
    }
    tr.date-row td {
        background: #e8e8e8 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        font-size: 8pt;
        padding: 2px 4px;
    }
    @page { size: landscape; margin: 0.4in; }
}


/* ============================================================
   21.  COMMUNICATION METRICS / WEEKENDER TIMELINE
        weekender_list_communication_metrics.php
   ============================================================ */

/* Stats strip */
#stats-strip {
    display: flex;
    flex-wrap: wrap;
    background: #fff;
    border: 1px solid #d8c4d0;
    border-radius: 8px;
    margin-bottom: 14px;
    overflow: hidden;
}
.stat-card {
    flex: 1;
    min-width: 130px;
    padding: 10px 16px;
    border-right: 1px solid #e8d8e4;
    text-align: center;
}
.stat-card:last-child { border-right: none; }
.stat-card .sc-value {
    font-size: 22px;
    font-weight: 700;
    color: var(--purple, #6b4fa0);
    line-height: 1.1;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.stat-card .sc-label {
    font-size: 10px;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 2px;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

/* Controls bar variant */
.report-controls .ctrl-left {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.report-controls select.btn {
    padding: 6px 10px;
    font-size: 13px;
    border: 1px solid var(--gray-300, #ccc);
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
}
.btn-outline-purple.btn-active {
    background: var(--purple, #6b4fa0) !important;
    color: #fff !important;
}

/* TEC section */
.tec-section {
    background: #fff;
    border: 1px solid #d8c4d0;
    border-radius: 8px;
    margin-bottom: 14px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(104,45,90,0.07);
}
.tec-header {
    background: linear-gradient(135deg, #682d5a 0%, #8c4a7a 100%);
    color: #fff;
    padding: 8px 14px;
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.tec-header .th-num {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

/* Timeline body */
.tec-body { padding: 6px 14px 4px; }
.tl-bar-date {
    position: absolute;
    top: -18px;
    font-size: 10px;
    color: #444;
    white-space: nowrap;
    transform: translateX(-50%);
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    pointer-events: none;
    transition: top 0s;
}
.tl-bar-date.stagger { top: -30px; color: #666; }
.tl-arrival-date {
    position: absolute;
    top: -18px;
    right: 0;
    font-size: 10px;
    font-weight: 600;
    color: #682d5a;
    white-space: nowrap;
    transform: translateX(50%);
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    pointer-events: none;
}
.tl-row { display: flex; align-items: center; height: 50px; margin: 2px 0; }
.tl-row.is-canceled { opacity: 0.5; }
.tl-name {
    width: 150px;
    min-width: 150px;
    font-size: 12px;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
    color: #333;
}
.tl-row.is-canceled .tl-name { text-decoration: line-through; color: #999; }
.tl-track {
    flex: 1;
    position: relative;
    height: 26px;
    background: #f5edf3;
    border-radius: 4px;
}
.tl-arrival {
    position: absolute;
    top: -5px;
    bottom: -5px;
    right: 0;
    width: 4px;
    background: #682d5a;
    border-radius: 2px;
    z-index: 3;
}
.tl-segment {
    position: absolute;
    top: 4px;
    height: 18px;
    border-radius: 3px;
    min-width: 4px;
    z-index: 1;
}
.seg-fast    { background: #28a745; }
.seg-ok      { background: #fd7e14; }
.seg-slow    { background: #dc3545; }
.seg-pending {
    background: repeating-linear-gradient(
        45deg,
        #dc3545 0px, #dc3545 4px,
        #f8b4bc 4px, #f8b4bc 9px
    );
}
.seg-phase2 { background: #17a2b8; }
.seg-phase3 { background: #0d6efd; }
.tl-days {
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    font-size: 9px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
    padding: 0 2px;
    pointer-events: none;
    text-shadow: 0 0 2px rgba(0,0,0,0.5);
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.tl-dot {
    position: absolute;
    top: 50%;
    width: 13px;
    height: 13px;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.2);
    z-index: 4;
}
.tl-dot.parent {
    background: #6f42c1;
    border-radius: 2px;
    transform: translate(-50%, -50%) rotate(45deg);
}
.tl-tick {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    transform: translateX(-50%);
    background: #20c997;
    opacity: 0.8;
    z-index: 3;
}
.badge-canceled {
    font-size: 9px;
    font-weight: 700;
    background: #dc3545;
    color: #fff;
    padding: 1px 5px;
    border-radius: 8px;
    margin-left: 5px;
    white-space: nowrap;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

/* TEC footer */
.tec-footer {
    padding: 5px 14px 5px 150px;
    background: #faf5f9;
    border-top: 1px solid #eddde8;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    font-size: 11px;
    color: #666;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.tec-footer .tf-stat strong { color: #682d5a; }

/* Legend */
#legend {
    background: #fff;
    border: 1px solid #d8c4d0;
    border-radius: 8px;
    margin-bottom: 14px;
    padding: 12px 16px;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
#legend .lg-title {
    font-size: 13px;
    font-weight: 700;
    color: #682d5a;
    margin-bottom: 10px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
#legend .lg-groups { display: flex; flex-wrap: wrap; gap: 18px 32px; }
#legend .lg-group  { display: flex; flex-direction: column; gap: 7px; }
#legend .lg-group-label {
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #999;
    margin-bottom: 2px;
}
.lg-item    { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #444; }
.lg-bar     { width: 32px; height: 14px; border-radius: 3px; flex-shrink: 0; }
.lg-diamond { width: 12px; height: 12px; background: #6f42c1; border-radius: 2px; transform: rotate(45deg); border: 2px solid #fff; box-shadow: 0 0 0 1.5px rgba(0,0,0,0.2); flex-shrink: 0; }
.lg-line    { width: 5px; height: 22px; background: #682d5a; border-radius: 2px; flex-shrink: 0; }
.lg-tick    { width: 3px; height: 18px; background: #20c997; border-radius: 1px; flex-shrink: 0; }

/* ── Print — communication metrics ── */
@media print {
    #stats-strip { border: none; border-bottom: 1px solid #ccc; border-radius: 0; margin-bottom: 8px; }
    .tec-section { box-shadow: none; border: 1px solid #ccc; }
    #legend      { display: none; }
    @page { size: landscape; margin: 0.4in; }
}


/* ============================================================
   22.  ADDRESSED-LETTERS PRINT PAGE
        weekender_list_addressed_letters_to_self.php
        (screen layout + print—specific page; not linked to site nav)
   ============================================================ */

/* Note: this file uses `body` directly (standalone print page); these rules
   are scoped via the unique class names so they won't bleed into other pages. */

.page-wrapper {
    max-width: 8.5in;
    margin: 0 auto 30px auto;
    background: white;
    padding: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    page-break-after: always;
    display: flex;
    flex-direction: column;
    height: 10in;
}

.letter-page-header {
    font-size: 18pt;
    font-weight: bold;
    text-align: center;
    margin-bottom: 10px;
    flex: 0 0 auto;
}

.letter-page {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, 1fr);
    box-sizing: border-box;
    padding: 10px;
}

.envelope {
    border: 1px solid #999;
    margin: 5px;
    padding: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
}

.return-address {
    font-size: 9pt;
    position: absolute;
    top: 10px;
    left: 10px;
}

.recipient-address {
    font-size: 11pt;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding-left: 25%;
}

.stamp {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 50px;
    height: 50px;
}
.stamp img { width: 100%; height: 100%; object-fit: contain; }

@media print {
    .page-wrapper {
        max-width: none;
        margin: 0;
        box-shadow: none;
        padding: 0;
        height: 10in;
    }
    @page { size: portrait; margin: 0.5in; }
}


/* ============================================================
   23.  WEEKENDER SUPPORT CHECKLIST
        weekender_support_checklist.php
   ============================================================ */

/* Empty / missing-data cell */
td.empty-cell {
    background-color: #fff3cd !important;
    border-color: #e6a817 !important;
    outline: 2px solid #e6a817;
    min-width: 50px;
}

/* Checkbox cells */
td.col-checkbox {
    text-align: center;
    width: 50px;
}
td.col-checkbox input[type="checkbox"] {
    width: 14px;
    height: 14px;
    accent-color: var(--purple, #6b4fa0);
    pointer-events: none;
}

/* ── Print — support checklist ── */
@media print {
    td.empty-cell {
        border: 1px solid #999 !important;
        background: #f5f5f5 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    td.col-checkbox input[type="checkbox"] {
        appearance: none !important;
        -webkit-appearance: none !important;
        width: 0 !important;
        height: 0 !important;
        border: none !important;
        background: transparent !important;
        display: inline !important;
        position: static !important;
    }
    td.col-checkbox input[type="checkbox"]:checked::after {
        content: "✔";
        font-size: 11px;
        color: black;
    }
    @page { size: landscape; margin: 0.5in; }
}


/* ============================================================
   24.  CLOSING CHECK-IN LIST
        weekender_list_closing_checkin.php
   ============================================================ */

/* This report uses larger type (14px base) */
/* Column sizing */
td.col-gender  { width: 60px;  text-align: center; }
td.col-checkin { width: 100px; text-align: center; }
td.col-name    { width: 180px; white-space: nowrap; }
td.col-parents { width: 160px; word-break: break-word; }
td.col-notes   { width: auto; }

/* Screen checkbox */
td.col-checkin input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--purple, #6b4fa0);
    pointer-events: none;
}

/* Instructions box */
.instructions {
    background: var(--gray-50, #f9f9f9);
    border-left: 4px solid var(--purple, #6b4fa0);
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    font-family: 'Inter', 'Segoe UI', sans-serif;
    font-size: 14px;
}
.instructions p  { margin: 0 0 0.5rem; font-weight: 600; }
.instructions ul { margin: 0; padding-left: 1.25rem; }
.instructions li { margin-bottom: 0.3rem; line-height: 1.5; }

/* Screen note (speaker_request_list.php) */
.screen-note {
    background: var(--gray-50, #f9f9f9);
    border-left: 4px solid var(--purple, #6b4fa0);
    padding: 0.6rem 1rem;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    margin-bottom: 1.25rem;
    color: var(--gray-700, #444);
}

/* ── Print — closing check-in ── */
@media print {
    .instructions {
        border-left: 2px solid #000;
        background: #fff !important;
        font-size: 10pt;
        margin-bottom: 0.75rem;
        padding: 0.5rem 0.75rem;
    }
    td.col-checkin input[type="checkbox"] {
        appearance: none !important;
        -webkit-appearance: none !important;
        width: 14px !important;
        height: 14px !important;
        border: 1px solid #000 !important;
        background: #fff !important;
        display: inline-block !important;
        position: relative !important;
    }
    td.col-checkin input[type="checkbox"]:checked::after {
        content: "✔";
        position: absolute;
        top: -2px;
        left: 2px;
        font-size: 12px;
        color: black;
    }
    .screen-note { display: none !important; }
    @page { size: portrait; margin: 0.5in; }
}


/* ============================================================
   25.  TEAM SHIRT CHECKLIST
        team_shirt_checklist.php
        (only has a print block — tiny file)
   ============================================================ */

@media print {
    .shirt-print-btn { display: none !important; }
    .shirt-table { width: 100%; border-collapse: collapse; }
    .shirt-table th,
    .shirt-table td { border: 1px solid #ccc; padding: 6px 10px; font-size: 12px; }
}


/* ============================================================
   26.  FILE-UNIQUE TWEAKS
   ============================================================ */

/* ── comments.php — report-controls has justify-content: space-between ── */
/* (comments_test.php uses justify-content: flex-end — handled by default) */

/* ── health_form_list.php ── */
.health-table tbody tr.row-missing td       { background: #fffbeb !important; }
.health-table tbody tr.row-missing:hover td { background: #fef3c7 !important; }

.no-form-badge {
    display: inline-block;
    margin-left: 0.4rem;
    padding: 0.1rem 0.45rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 700;
    background: #fde68a;
    color: #92400e;
    border: 1px solid #fcd34d;
    vertical-align: middle;
    white-space: nowrap;
}

td input[type="checkbox"] {
    accent-color: var(--purple);
    width: 14px;
    height: 14px;
}
.req-otc-row   { display: flex; align-items: center; gap: 0.3rem; white-space: nowrap; }
.req-otc-label { font-size: 0.68rem; color: var(--gray-500); min-width: 2.2rem; }

/* ── medical_needs.php — max-width on td is 280px (health_form_list uses 200px) ── */
/* Override only for medical_needs — use scoped class if needed, or accept 200px default. */
.medical-needs { word-wrap: break-word; white-space: pre-wrap; }
.med-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

/* ── inactive_youth_team_members.php / team_list_by_tec_number.php ── */
/* tr.tec-row already covered by shared group-row rules above */

/* ── inventory_counts.php — TEC col header centered ── */
.report-table thead th.col-tec { text-align: center; }

/* ── leadership_selection_history.php ── */
.col-label { width: 10px; }
.name-accepted { font-weight: 700; }
.leadership-history-table td.col-tec { text-align: left; }

/* ── team_list_by_team.php — team footer row ── */
tr.team-footer-row td {
    font-weight: 600;
    font-size: 12px;
    color: var(--purple-dark, #4a2d72);
    text-align: right;
    padding: 4px 8px 8px;
    background: #fff !important;
    border-bottom: 2px solid var(--purple, #6b4fa0);
}
@media print {
    tr.team-footer-row td {
        font-size: 7.5pt;
        padding: 1px 4px 4px;
        border-bottom: 1px solid #000;
    }
}

/* ── team_list_by_team_by_gender.php — gender sub-separator (lighter) ── */
/* Note: tr.gender-row is the STRONG separator in most files; here it is lighter.
   Since the selector is the same, this relies on load order / specificity.
   If needed, add a variant class to the PHP. */
tr.gender-row.sub td {
    font-weight: 600;
    font-size: 12px;
    color: #555;
    padding: 6px 8px 3px;
    background: #f3f3f3 !important;
    border-bottom: 1px solid #ccc;
}

/* ── team_list_all_recent_adults/youth — expanded sub-rows ── */
tr.person-row th {
    background: var(--gray-100, #f3f3f3) !important;
    color: var(--text, #222);
    padding: 6px 10px;
    font-weight: 600;
    font-size: 13px;
    border-top: 1px solid var(--gray-300, #ccc);
    white-space: nowrap;
}
tr.assignment-row td {
    padding: 3px 10px 3px 22px;
    font-size: 12px;
    color: var(--gray-600, #555);
    background: #faf7ff !important;
    border-bottom: 1px solid var(--gray-100, #eee);
}
tr.assignment-row td.team-cell { color: var(--purple, #6b4fa0); font-weight: 600; }
.cell-center { text-align: center !important; }

/* ── team_list_team_counts.php — count columns ── */
td.col-count, th.col-count { width: 5%; text-align: center; }

/* ── weekender_list_ac.php — grad-year sub-separator ── */
tr.grad-row td {
    font-weight: 700;
    font-size: 13px;
    color: var(--purple-dark, #4e1f44);
    padding: 7px 8px 4px;
    background: var(--purple-pale, #f5eef3) !important;
    border-top: 2px solid var(--purple, #723063);
    border-bottom: 2px solid var(--purple, #723063);
    letter-spacing: 0.03em;
}
@media print {
    tr.grad-row td {
        font-size: 9pt;
        padding: 3px 4px 2px;
        background: var(--purple-pale, #f5eef3) !important;
        color: var(--purple-dark, #4e1f44) !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}

tr.data-row td:first-child { padding-left: 20px; }

/* ── weekender_list_ga.php — sort controls ── */
.sort-label {
    font-family: Inter, sans-serif;
    font-size: 13px;
    color: var(--gray-700, #444);
}
.sort-select {
    font-family: Inter, sans-serif;
    font-size: 13px;
    padding: 5px 8px;
    border: 1px solid var(--gray-300, #ccc);
    border-radius: 4px;
    background: #fff;
    color: var(--gray-800, #333);
    cursor: pointer;
}

/* ── speaker_request_list.php — submitted checkbox column ── */
td.col-submitted {
    text-align: center;
    width: 70px;
}
td.col-submitted input[type="checkbox"] {
    width: 14px;
    height: 14px;
    accent-color: var(--purple, #6b4fa0);
    pointer-events: none;
}
@media print {
    td.col-submitted input[type="checkbox"] {
        appearance: none !important;
        -webkit-appearance: none !important;
        width: 0 !important;
        height: 0 !important;
        border: none !important;
        background: transparent !important;
        display: inline !important;
        position: static !important;
    }
    td.col-submitted input[type="checkbox"]:checked::after {
        content: "✔";
        font-size: 10px;
        color: black;
    }
}

/* ── team_registration_audit.php — audit legend dot variant ── */
/* (already defined above in §18) */

/* ── retreats_by_host_church.php — page size override ── */
/* These are handled inline by the PHP @page block since the base rule defaults
   to landscape. The PHP file's own @media print @page overrides are the cleanest
   way to handle per-report page orientation.  No extra rule needed here. */

/* ============================================================
   YOUTH TALK VOLUNTEERS  (youth_talk_volunteers.php)
   Youth registrants willing to give one or more talks for a
   selected TEC weekend. Reuses .report-table / .col-ldr; the
   few extras below are scoped with .ytv-.
   ============================================================ */

/* Talk legend / filter row under the toolbar */
.ytv-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.1rem;
    margin: 0 0 1rem;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    color: var(--gray-700);
}
.ytv-legend-item { white-space: nowrap; }
.ytv-chip {
    display: inline-block;
    min-width: 18px;
    text-align: center;
    background: var(--purple);
    color: var(--white);
    border-radius: 4px;
    padding: 1px 5px;
    font-weight: 700;
    margin-right: 5px;
}
.ytv-muted { color: var(--gray-400); }

/* Filter hint above the table */
.ytv-filter-hint { margin: 0 0 0.6rem; font-style: italic; }

/* Talk-number toggle filter pills above the grid — compact so the row of
   them stays on one line, including on mobile */
.ytv-legend.ytv-filters { gap: 0.4rem; }
.ytv-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 6px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--purple-dark);
    background: var(--white);
    border: 1.5px solid var(--gray-300);
    border-radius: 999px;
    cursor: pointer;
    transition: background var(--transition), border-color var(--transition), color var(--transition);
}
.ytv-pill:hover { border-color: var(--purple); color: var(--purple); }
.ytv-pill.active {
    background: var(--purple);
    border-color: var(--purple);
    color: var(--white);
}

/* The table sits in a .table-wrap so it scrolls inside its own box and never
   pushes the page sideways. On phones we also tighten it so it usually fits
   without scrolling at all. */
.ytv-table-wrap { margin-bottom: 0.75rem; }
@media (max-width: 600px) {
    #ytv-table { font-size: 11px; }
    #ytv-table thead th { padding: 6px 5px; }
    #ytv-table tbody td { padding: 4px 5px; }
    #ytv-table th.col-center,
    #ytv-table td.col-center,
    #ytv-table td.col-ldr { padding-left: 3px; padding-right: 3px; }
    #ytv-table td.col-ldr { width: auto; min-width: 18px; }
}

@media print {
    .report-controls, .ytv-filter-hint { display: none !important; }
    .ytv-table-wrap { overflow: visible; border: none; box-shadow: none; }
    .ytv-chip, .ytv-pill.active {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}

/* ── Photo Capture (mobile, teamlist/photo_capture.php) ────────────────── */
.pc-wrap { max-width: 560px; margin: 0 auto; }
.pc-roster-meta { color: var(--gray-600); font-size: 0.9rem; }
.pc-empty { color: var(--gray-600); padding: 2rem 0; text-align: center; }

.pc-mode-switch { display: flex; gap: 0.5rem; margin-top: 1.25rem; margin-bottom: 1.1rem; }
.pc-mode-link {
    padding: 0.4rem 0.9rem; border-radius: 999px; border: 1.5px solid #e5dde8;
    font-size: 0.85rem; font-weight: 600; color: var(--purple-dark); text-decoration: none;
}
.pc-mode-link--active { background: var(--purple); border-color: var(--purple); color: #fff; }

.pc-meta-row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 1rem; }
.pc-toggle-btn {
    padding: 0.35rem 0.8rem; border-radius: 8px; border: 1.5px solid #e5dde8; background: #fff;
    color: var(--purple-dark); font-size: 0.8rem; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.pc-toggle-btn:active { background: var(--purple-pale); }

.pc-list { display: flex; flex-direction: column; gap: 0.6rem; padding-bottom: 2rem; }
.pc-list--missing-only .pc-row[data-hasfinal="1"] { display: none; }
.pc-row {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.75rem 0.9rem; border: 1.5px solid #e5dde8; border-radius: 10px; background: #fff;
}
.pc-row[data-status="staged"] { border-color: #f59e0b; background: #fffbeb; }
.pc-row[data-status="final"]  { border-color: #22c55e; background: #f0fdf4; }
.pc-name { flex: 1; font-weight: 600; color: var(--purple-dark); }
.pc-has-photo-hint { display: block; font-size: 0.7rem; font-weight: 500; color: var(--gray-500); }
.pc-status-badge { font-size: 0.75rem; font-weight: 600; color: var(--gray-500); white-space: nowrap; }
.pc-row[data-status="staged"] .pc-status-badge { color: #b45309; }
.pc-row[data-status="final"]  .pc-status-badge { color: #15803d; }

.pc-capture-btn {
    position: relative; display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.5rem 0.85rem; border-radius: 8px; background: var(--purple); color: #fff;
    font-size: 0.85rem; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.pc-capture-btn:active { background: var(--purple-dark); }
.pc-capture-btn input[type="file"] {
    position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none;
}

.pc-review-overlay {
    position: fixed; inset: 0; background: rgba(15,10,20,0.94); z-index: 1000;
    display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1.25rem;
}
.pc-review-overlay[hidden] { display: none; }
.pc-review-name { color: #fff; font-weight: 600; margin-bottom: 0.75rem; text-align: center; }
.pc-review-img { max-width: 100%; max-height: 65vh; border-radius: 10px; object-fit: contain; background: #000; }
.pc-review-error {
    color: #fecaca; background: rgba(220,38,38,0.25); border: 1px solid #dc2626; border-radius: 8px;
    padding: 0.5rem 0.75rem; margin-top: 0.75rem; font-size: 0.85rem; max-width: 420px; text-align: center;
}
.pc-review-actions { display: flex; gap: 0.75rem; margin-top: 1.25rem; }
.pc-review-actions button { padding: 0.65rem 1.4rem; border-radius: 8px; border: none; font-weight: 600; font-size: 0.95rem; cursor: pointer; }
.pc-btn-retake { background: #3f3546; color: #fff; }
.pc-btn-accept { background: var(--purple); color: #fff; }
.pc-btn-accept:disabled, .pc-btn-retake:disabled { opacity: 0.6; cursor: default; }

/* ── Photo Crop (admin, admin/photo_crop.php) ───────────────────────────── */
.pcrop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 1rem; }
.pcrop-card {
    border: 1.5px solid #e5dde8; border-radius: 10px; padding: 0.6rem; text-align: center;
    background: #fff; cursor: pointer; transition: box-shadow 0.15s;
}
.pcrop-card:hover { box-shadow: var(--shadow-md); }
.pcrop-card img { width: 100%; aspect-ratio: 5 / 6; object-fit: cover; border-radius: 6px; background: #f2eef4; }
.pcrop-card-name { font-size: 0.82rem; font-weight: 600; color: var(--purple-dark); margin-top: 0.4rem; }
.pcrop-has-final { display: inline-block; margin-top: 0.25rem; font-size: 0.7rem; font-weight: 700; color: #b45309; }

.pcrop-overlay {
    position: fixed; inset: 0; background: rgba(15,10,20,0.94); z-index: 1000;
    display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1rem;
}
.pcrop-overlay[hidden] { display: none; }
.pcrop-canvas-wrap { position: relative; touch-action: none; }
.pcrop-canvas-wrap canvas { display: block; border-radius: 4px; background: #000; touch-action: none; }
.pcrop-hint { color: #cbb9d6; font-size: 0.8rem; margin-top: 0.6rem; text-align: center; }
.pcrop-error {
    color: #fecaca; background: rgba(220,38,38,0.25); border: 1px solid #dc2626; border-radius: 8px;
    padding: 0.5rem 0.75rem; margin-top: 0.6rem; font-size: 0.85rem; max-width: 420px; text-align: center;
}
.pcrop-actions { display: flex; gap: 0.75rem; margin-top: 1.1rem; }
.pcrop-actions button { padding: 0.65rem 1.4rem; border-radius: 8px; border: none; font-weight: 600; font-size: 0.95rem; cursor: pointer; }
.pcrop-btn-cancel { background: #3f3546; color: #fff; }
.pcrop-btn-save { background: var(--purple); color: #fff; }
.pcrop-btn-save:disabled, .pcrop-btn-cancel:disabled { opacity: 0.6; cursor: default; }