/**
 * Portal Theme: Classic
 *
 * Default theme — matches the existing portal look & feel.
 * Uses Bootstrap 4 base styles with minimal overrides.
 * The accent color is driven by --portal-accent (set inline per portal).
 */

:root {
    --portal-accent: #2694FA;
    --portal-accent-hover: color-mix(in srgb, var(--portal-accent) 85%, black);
    --portal-radius: 0.25rem;
    --portal-font: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ── Typography ─────────────────────────────────────────────────────────── */
body {
    font-family: var(--portal-font);
    font-size: 12pt;
}

/* ── Cards ──────────────────────────────────────────────────────────────── */
.card {
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: var(--portal-radius);
    box-shadow: none;
}

.card-header {
    background-color: rgba(0, 0, 0, 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

/* ── Buttons ────────────────────────────────────────────────────────────── */
.portalThemeBtn {
    background: var(--portal-accent);
    color: #fff;
    border: none;
    border-radius: var(--portal-radius);
    padding: 0.375rem 0.75rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.15s ease-in-out;
}

.portalThemeBtn:hover {
    background: var(--portal-accent-hover);
}

/* ── Form controls ──────────────────────────────────────────────────────── */
.form-control:focus {
    border-color: var(--portal-accent);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--portal-accent) 25%, transparent);
}

/* ── Background accent ──────────────────────────────────────────────────── */
.darkBak {
    background-size: cover;
    min-height: 100vh;
    width: 100%;
}

/* ── Sections ───────────────────────────────────────────────────────────── */
.proceedBtn,
.addBtn,
.updateBtn {
    background: transparent;
    color: var(--portal-accent);
    border: 2px solid var(--portal-accent);
    border-radius: var(--portal-radius);
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

.proceedBtn:hover,
.addBtn:hover,
.updateBtn:hover {
    background: var(--portal-accent);
    color: #fff;
}

.goBackBtn {
    background: transparent;
    color: #6c757d;
    border: 2px solid #adb5bd;
    border-radius: var(--portal-radius);
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

.goBackBtn:hover {
    background: #6c757d;
    color: #fff;
    border-color: #6c757d;
}

/* ── Progress bar ───────────────────────────────────────────────────────── */
.progress {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: var(--portal-radius);
    overflow: hidden;
}

.progress-bar {
    background: var(--portal-accent);
}