/* =====================================================================
   Puerta Kids — Puerta Sur brand system over Bootstrap 5.3.
   Palette from "Guidelines PuertaSur2026" (Sistema de Color):
     Naranja        #FF4E1A   Naranja medio  #FF7A52
     Gris azulado   #8FA3A8   Gris claro     #D2DADC
     Negro          #000000   Crema (fondo)  #FAF4EE
   Typography: Hanken Grotesk (Degular substitute, self-hosted) +
   Caveat (handwriting accent, Adobe Handwriting substitute).
   Solid primary buttons use deepened naranja #D93A00 in light mode so
   white label text meets WCAG AA (#FF4E1A itself is 3.3:1).
   ===================================================================== */

:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --pk-naranja: #FF4E1A;
    --pk-naranja-medio: #FF7A52;
    --pk-naranja-profundo: #D93A00;
    --pk-gris-azulado: #8FA3A8;
    --pk-gris-claro: #D2DADC;
    --pk-crema: #FAF4EE;

    --bs-primary: #FF4E1A;
    --bs-primary-rgb: 255, 78, 26;
    --bs-body-font-family: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

[data-bs-theme="light"] {
    --bs-body-bg: #FAF4EE;
    --bs-body-color: #1E2124;
    --bs-tertiary-bg: #F4ECE4;
    --bs-border-color: #E6DCD2;
    --bs-link-color: #C43300;
    --bs-link-color-rgb: 196, 51, 0;
    --bs-link-hover-color: #A32A00;
    --bs-link-hover-color-rgb: 163, 42, 0;
}

[data-bs-theme="dark"] {
    --bs-body-bg: #1E2124;
    --bs-body-color: #EFE9E3;
    --bs-tertiary-bg: #24282C;
    --bs-border-color: #3A3F44;
    --bs-link-color: #FF9C7A;
    --bs-link-color-rgb: 255, 156, 122;
    --bs-link-hover-color: #FFB49A;
    --bs-link-hover-color-rgb: 255, 180, 154;
}

h1, h2, h3, h4, h5, h6, .navbar-brand { font-weight: 700; }

/* Handwriting accent (labels, warm touches) */
.pk-script { font-family: 'Caveat', cursive; }

/* Buttons ------------------------------------------------------------- */
.btn-primary {
    --bs-btn-bg: #D93A00;
    --bs-btn-border-color: #D93A00;
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: #C43300;
    --bs-btn-hover-border-color: #C43300;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #B02E00;
    --bs-btn-active-border-color: #B02E00;
    --bs-btn-active-color: #fff;
    --bs-btn-disabled-bg: #D93A00;
    --bs-btn-disabled-border-color: #D93A00;
    --bs-btn-disabled-color: #fff;
    --bs-btn-focus-shadow-rgb: 255, 78, 26;
}

[data-bs-theme="dark"] .btn-primary {
    --bs-btn-bg: #FF7A52;
    --bs-btn-border-color: #FF7A52;
    --bs-btn-color: #1E2124;
    --bs-btn-hover-bg: #FF8E6B;
    --bs-btn-hover-border-color: #FF8E6B;
    --bs-btn-hover-color: #1E2124;
    --bs-btn-active-bg: #FF4E1A;
    --bs-btn-active-border-color: #FF4E1A;
    --bs-btn-active-color: #1E2124;
    --bs-btn-disabled-bg: #FF7A52;
    --bs-btn-disabled-border-color: #FF7A52;
    --bs-btn-disabled-color: #1E2124;
}

.btn-outline-primary {
    --bs-btn-color: #C43300;
    --bs-btn-border-color: #D93A00;
    --bs-btn-hover-bg: #D93A00;
    --bs-btn-hover-border-color: #D93A00;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #C43300;
    --bs-btn-active-border-color: #C43300;
    --bs-btn-active-color: #fff;
    --bs-btn-focus-shadow-rgb: 255, 78, 26;
}

[data-bs-theme="dark"] .btn-outline-primary {
    --bs-btn-color: #FF9C7A;
    --bs-btn-border-color: #FF7A52;
    --bs-btn-hover-bg: #FF7A52;
    --bs-btn-hover-border-color: #FF7A52;
    --bs-btn-hover-color: #1E2124;
    --bs-btn-active-bg: #FF4E1A;
    --bs-btn-active-border-color: #FF4E1A;
    --bs-btn-active-color: #1E2124;
}

/* Theme toggle: show the icon of the mode you would switch TO. */
[data-bs-theme="light"] .icon-sun { display: none; }
[data-bs-theme="dark"] .icon-moon { display: none; }
#themeToggle { text-decoration: none; line-height: 1; }

/* Brand images -------------------------------------------------------- */
.pk-brand-icon { height: 1.75rem; width: auto; }
.pk-hero-icon { height: 4.5rem; width: auto; filter: drop-shadow(0 8px 18px rgba(255, 78, 26, .30)); }
.pk-footer-icon { height: 1.25rem; width: auto; opacity: .85; }

/* Hero (landing) */
.pk-hero { padding: 2.25rem 0 1.25rem; }
.pk-tagline {
    color: var(--pk-naranja);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    font-size: .95rem;
}
[data-bs-theme="dark"] .pk-tagline { color: var(--pk-naranja-medio); }

/* Option cards */
.pk-card {
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 .25rem 1rem rgba(30, 20, 10, .08);
    transition: transform .15s ease, box-shadow .15s ease;
}
.pk-card:hover { transform: translateY(-2px); box-shadow: 0 .5rem 1.25rem rgba(30, 20, 10, .12); }
[data-bs-theme="dark"] .pk-card { box-shadow: 0 .25rem 1rem rgba(0, 0, 0, .45); }
.pk-card .pk-icon { font-size: 2.75rem; line-height: 1; }

/* Forms: comfortable on phones */
.form-control, .form-select { min-height: 2.75rem; }
.form-control-lg { min-height: 3.25rem; }

/* Bigger tap targets on small screens */
@media (max-width: 575.98px) {
    .btn { padding-top: .625rem; padding-bottom: .625rem; }
    .pk-hero { padding-top: 1.5rem; }
}

/* Quote / verse */
.pk-verse { max-width: 34rem; margin: 2.5rem auto 0; }

/* Reception: camera scanning */
.pk-cam-wrap video { max-height: 55vh; object-fit: cover; background: #000; display: block; }
.pk-cam-wrap.pk-cam-mirror video { transform: scaleX(-1); }
.pk-cam-reticle {
    position: absolute; inset: 12%;
    border: 3px solid rgba(255, 255, 255, .85); border-radius: 12px;
    box-shadow: 0 0 0 999px rgba(0, 0, 0, .25);
    pointer-events: none;
}
.pk-cam-wrap { overflow: hidden; border-radius: .5rem; }
.pk-cam-flash {
    position: absolute; inset: 0;
    background: rgba(25, 135, 84, .45);
    opacity: 0; transition: opacity .12s ease;
    pointer-events: none;
}
.pk-cam-flash.pk-flash-on { opacity: 1; }
.pk-cam-flip { bottom: .5rem; right: .5rem; opacity: .85; }

/* Staff quick nav: bottom tab bar on phones/tablets (< lg) */
.pk-staffnav {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 1030;
    display: flex;
    background-color: var(--bs-tertiary-bg);
    border-top: 1px solid var(--bs-border-color);
    padding-bottom: env(safe-area-inset-bottom);
}
.pk-staffnav a {
    flex: 1 1 0; min-width: 0;
    text-align: center; text-decoration: none;
    padding: .35rem 0 .5rem;
    font-size: .72rem; line-height: 1.2;
    color: var(--bs-secondary-color);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pk-staffnav a .pk-nav-ico { display: block; font-size: 1.4rem; line-height: 1.35; }
.pk-staffnav a.active { color: var(--bs-primary); font-weight: 600; }
@media (max-width: 991.98px) {
    body.pk-staffnav-on { padding-bottom: calc(4rem + env(safe-area-inset-bottom)); }
}
@media (min-width: 992px) {
    .pk-staffnav { display: none; }
}
@media print { .pk-staffnav { display: none; } }