/**
 * Franchise panel — unified design tokens (single source of truth).
 * Mapped to Academic Core (navy + orange + clean surfaces).
 * Loaded via franchise-gov-theme-head.php after academic-core.css.
 */
:root,
body.fr-portal {
    /* Brand palette — Academic Core */
    --fr-primary: var(--ac-primary-container, #003366);
    --fr-primary-mid: var(--ac-surface-tint, #3a5f94);
    --fr-primary-deep: var(--ac-primary, #001e40);
    --fr-primary-light: var(--ac-on-primary-container, #799dd6);
    --fr-accent: var(--ac-secondary, #a33e00);
    --fr-accent-bright: var(--ac-secondary-container, #fe6500);
    --fr-surface: var(--ac-surface, #f7f9fb);
    --fr-surface-elevated: var(--ac-surface-container-lowest, #ffffff);
    --fr-border: var(--ac-outline-variant, #c3c6d1);
    --fr-text: var(--ac-on-surface, #191c1e);
    --fr-text-muted: var(--ac-on-surface-variant, #43474f);
    --fr-muted: var(--ac-outline, #737780);

    /* White-label school accent (ribbon only) */
    --fr-school-accent: var(--school-accent, var(--ac-tertiary-container, #003d0b));

    /* Typography — Academic Core dual-font */
    --fr-body: 16px;
    --fr-line: 1.5;
    --fr-font-sans: var(--ac-font-body, Inter, 'Noto Sans Telugu', system-ui, sans-serif);
    --fr-font-heading: var(--ac-font-display, Manrope, Inter, 'Noto Sans Telugu', system-ui, sans-serif);

    /* Spacing & shape — Academic Core 8px scale */
    --fr-radius-sm: var(--ac-radius, 0.5rem);
    --fr-radius-md: var(--ac-radius-md, 0.75rem);
    --fr-radius-lg: var(--ac-radius-lg, 1rem);
    --fr-radius-xl: var(--ac-radius-xl, 1.5rem);
    --fr-touch-min: 44px;
    --fr-container-max: 88rem;

    /* Shadows — Academic Core ambient */
    --fr-shadow-sm: var(--ac-shadow-card, 0 4px 12px rgba(0, 0, 0, 0.05));
    --fr-shadow-md: var(--ac-shadow-card, 0 4px 12px rgba(0, 0, 0, 0.05));
    --fr-shadow-lg: var(--ac-shadow-hover, 0 8px 24px rgba(0, 0, 0, 0.08));

    /* Map to ERP + Tailwind utility aliases */
    --erp-color-navy: var(--fr-primary);
    --erp-color-accent: var(--fr-accent-bright);
    --erp-color-surface: var(--fr-surface);
    --erp-color-border: var(--fr-border);
    --erp-color-muted: var(--fr-muted);
    --erp-color-text: var(--fr-text);
    --erp-sidebar-accent: var(--fr-primary);
    --surface: var(--fr-surface);
    --primary: var(--fr-primary);
    --accent: var(--fr-accent-bright);
}

body.fr-portal.bg-surface,
body.fr-portal .bg-surface {
    background-color: var(--fr-surface);
}

/* ---- Base portal body ---- */
body.fr-portal {
    font-family: var(--fr-font-sans);
    font-size: var(--fr-body);
    line-height: var(--fr-line);
    color: var(--fr-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body.fr-portal .fr-page-title {
    font-family: var(--fr-font-heading);
    font-weight: 600;
    letter-spacing: -0.015em;
    color: var(--fr-primary);
}

body.fr-portal .fr-lead {
    font-size: 1rem;
    line-height: 1.55;
    color: var(--fr-text-muted);
}

/* ---- Buttons (Phase 1 foundation — use across pages in Phase 3) ---- */
.fr-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-height: var(--fr-touch-min);
    padding: 0.55rem 1.1rem;
    border-radius: var(--fr-radius-md);
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
    -webkit-tap-highlight-color: transparent;
}

.fr-btn:focus-visible {
    outline: 2px solid var(--fr-accent-bright);
    outline-offset: 2px;
}

.fr-btn-primary {
    background: var(--fr-primary);
    color: #fff;
    box-shadow: var(--fr-shadow-sm);
}

.fr-btn-primary:hover {
    background: var(--fr-primary-mid);
}

.fr-btn-secondary {
    background: var(--fr-surface-elevated);
    color: var(--fr-primary);
    border-color: var(--fr-border);
}

.fr-btn-secondary:hover {
    border-color: var(--fr-primary);
    background: #fff;
}

.fr-btn-danger {
    background: #be123c;
    color: #fff;
}

.fr-btn-danger:hover {
    background: #9f1239;
}

.fr-btn-ghost {
    background: transparent;
    color: var(--fr-primary);
    border-color: var(--fr-border);
}

.fr-btn-ghost:hover {
    background: var(--fr-surface);
}

/* ---- Accessibility (Phase 6) ---- */
body.fr-portal .fr-skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 100;
    padding: 0.65rem 1rem;
    background: var(--fr-primary);
    color: #fff;
    font-weight: 600;
    font-size: 0.875rem;
    border-radius: 0 0 var(--fr-radius-md) 0;
    text-decoration: none;
}

body.fr-portal .fr-skip-link:focus {
    left: 0;
    outline: 2px solid var(--fr-accent-bright);
    outline-offset: 2px;
}

body.fr-portal a:focus-visible,
body.fr-portal button:focus-visible {
    outline: 2px solid var(--fr-accent-bright);
    outline-offset: 2px;
}

body.fr-portal input:focus-visible,
body.fr-portal select:focus-visible,
body.fr-portal textarea:focus-visible {
    outline: 2px solid var(--fr-accent-bright);
    outline-offset: 1px;
    border-color: var(--fr-primary-light);
}

/* ---- Fee track (General / IIT Foundation) ---- */
.fr-fee-track-badge {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.05rem;
    padding: 0.2rem 0.55rem;
    border-radius: var(--fr-radius-sm);
    border: 1px solid var(--fr-border);
    background: var(--fr-surface);
    line-height: 1.25;
    vertical-align: middle;
}

.fr-fee-track-badge--md {
    padding: 0.35rem 0.7rem;
    border-radius: var(--fr-radius-md);
}

.fr-fee-track-badge__en {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--fr-text);
}

.fr-fee-track-badge__te {
    font-size: 0.625rem;
    font-weight: 600;
    color: var(--fr-text-muted);
}

.fr-fee-track-badge--general {
    background: #f8fafc;
    border-color: #e2e8f0;
}

.fr-fee-track-badge--iit {
    background: #eef2ff;
    border-color: #c7d2fe;
}

.fr-fee-track-badge--iit .fr-fee-track-badge__en {
    color: #3730a3;
}

.fr-fee-track-badge--all {
    background: #f8fafc;
    border-color: transparent;
}

.fr-fee-track-badge--all .fr-fee-track-badge__en {
    color: var(--fr-muted);
    font-weight: 600;
}

.fr-fee-track-badge--compact .fr-fee-track-badge__te {
    display: none;
}

.fr-fee-track-select {
    min-height: 2.25rem;
    padding: 0.4rem 0.65rem;
    border-radius: var(--fr-radius-sm);
    border: 1px solid var(--fr-border);
    background: var(--fr-surface-elevated);
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--fr-primary);
}

.fr-fee-track-select:focus-visible {
    border-color: var(--fr-primary-light);
}

.fr-fee-track-hint {
    margin-top: 0.35rem;
    font-size: 0.75rem;
    line-height: 1.45;
    color: var(--fr-text-muted);
}

.fr-fee-track-hint [lang="te"] {
    display: block;
    margin-top: 0.15rem;
    color: var(--fr-muted);
}

.fr-fee-track-banner {
    border-radius: var(--fr-radius-lg);
    border: 1px solid #c7d2fe;
    background: linear-gradient(135deg, rgba(238, 242, 255, 0.95), rgba(255, 255, 255, 0.9));
    padding: 1rem 1.1rem;
}

.fr-fee-track-banner__title {
    font-family: var(--fr-font-heading);
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--fr-primary);
}

.fr-fee-track-banner__en,
.fr-fee-track-banner__te {
    margin-top: 0.35rem;
    font-size: 0.8125rem;
    line-height: 1.55;
    color: var(--fr-text-muted);
}

.fr-fee-track-banner__te {
    color: var(--fr-muted);
}