/* ==========================================================================
   Tema Brincolandia para el formulario de exoneracion.
   Misma identidad que brincolandia.com: banderines, ondas, Titan One +
   Baloo 2, azul/naranja/marino, tarjetas con borde y sombra dura.
   Solo estilos: la estructura y el JS del formulario no cambian.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Titan+One&family=Baloo+2:wght@500;600;700;800&display=swap');

:root {
  --bk-azul: #3E8EE8; --bk-marino: #16337F; --bk-naranja: #F0662B;
  --bk-crema: #FFF6EC; --bk-durazno: #FFB877; --bk-marino2: #0B1F5A;
}

/* ---------- fondo de marca ---------- */
html, body, #wrapwrap, #wrapwrap > main { background: var(--bk-azul) !important; }
body { font-family: 'Baloo 2', sans-serif !important; color: var(--bk-marino); overflow-x: hidden; }
html, body { max-width: 100vw; overflow-x: hidden !important; }
#wrapwrap, #wrapwrap > main { overflow-x: hidden; max-width: 100vw; }
#waiver-app, #waiver-app * { max-width: 100%; box-sizing: border-box; }
#waiver-app .row { margin-left: 0 !important; margin-right: 0 !important; }
#waiver-app .row > * { padding-left: 6px !important; padding-right: 6px !important; }
#wrapwrap > main { position: relative; isolation: isolate; min-height: 100vh; padding-bottom: 70px; }
#wrapwrap > main::before {
  content: ""; position: absolute; inset: -40%; z-index: -1; pointer-events: none;
  background: repeating-radial-gradient(circle at -30% 130%, transparent 0 90px, rgba(255,255,255,.10) 90px 135px);
}
/* banderines arriba y abajo (fixed al viewport: no ensanchan el documento) */
#wrapwrap > main::after, #waiver-app::before {
  content: ""; position: absolute; left: 0; right: 0; height: 48px; pointer-events: none; z-index: 0;
  background-repeat: repeat-x; background-size: auto 100%;
}
#waiver-app::before {
  top: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 56'%3E%3Cpolygon points='0,-8 45,56 90,-8' fill='%2316337F'/%3E%3Cpolyline points='0,-8 45,56 90,-8' fill='none' stroke='%231E4FD8' stroke-width='5' stroke-linejoin='round'/%3E%3C/svg%3E");
}
#wrapwrap > main::after {
  bottom: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 56'%3E%3Cpolygon points='0,64 45,0 90,64' fill='%2316337F'/%3E%3Cpolyline points='0,64 45,0 90,64' fill='none' stroke='%231E4FD8' stroke-width='5' stroke-linejoin='round'/%3E%3C/svg%3E");
}
#waiver-app { position: static; padding-top: 80px !important; max-width: 760px; box-sizing: border-box; }
#waiver-app.container { width: 100%; max-width: 760px; margin: 0 auto; padding-left: 16px !important; padding-right: 16px !important; }

/* ---------- cabecera ---------- */
#waiver-logo { max-width: 260px; width: 70%; filter: drop-shadow(0 6px 0 rgba(0,0,0,.2)); }
#waiver-app > .text-center h2 {
  font-family: 'Titan One', sans-serif !important; font-weight: 400 !important;
  font-size: clamp(30px, 6vw, 52px) !important; line-height: .95; letter-spacing: .5px;
  color: var(--bk-naranja) !important; text-transform: uppercase;
  -webkit-text-stroke: 5px var(--bk-marino); paint-order: stroke fill;
  text-shadow: 0 6px 0 rgba(0,0,0,.18); transform: rotate(-2.5deg); display: inline-block; margin: 10px 0 6px;
}

/* ---------- pasos ---------- */
.step-indicator { gap: 8px !important; }
.step-indicator .step {
  font-family: 'Baloo 2'; font-weight: 800 !important; font-size: 13px !important;
  background: #fff !important; color: var(--bk-marino) !important;
  border: 3px solid var(--bk-marino) !important; border-radius: 999px !important;
  padding: 6px 14px !important; box-shadow: 0 3px 0 var(--bk-marino);
}
.step-indicator .step.active { background: var(--bk-naranja) !important; color: #fff !important; transform: rotate(-2deg); }
.step-indicator .step.completed { background: var(--bk-marino) !important; color: #fff !important; }
#step-progress-mobile .small { color: #fff !important; font-weight: 800 !important; }
#step-progress-mobile .progress { background: rgba(22,51,127,.35) !important; border-radius: 999px; height: 10px !important; border: 2px solid var(--bk-marino); }
#progress-bar-fill { background: var(--bk-naranja) !important; border-radius: 999px; }

/* ---------- tarjetas ---------- */
#waiver-app .card {
  max-width: 100%;
  background: #fff !important; border: 5px solid var(--bk-marino) !important; border-radius: 26px !important;
  box-shadow: 8px 10px 0 var(--bk-marino) !important; overflow: hidden; margin-bottom: 26px;
}
#waiver-app .card-header {
  background: var(--bk-marino) !important; color: #fff !important; border: 0 !important; padding: 14px 22px !important;
}
#waiver-app .card-header h5, #waiver-app .card-header h4 {
  font-family: 'Titan One', sans-serif; font-weight: 400; font-size: 20px; margin: 0; letter-spacing: .5px; color: #FFB877;
}
#waiver-app .card-body { padding: 22px !important; color: var(--bk-marino); }
#waiver-app .card-body p, #waiver-app .text-muted { color: #4a5680 !important; font-weight: 600; }
#waiver-app .card-footer { background: var(--bk-crema) !important; border-top: 3px dashed rgba(22,51,127,.25) !important; padding: 16px 22px !important; }

/* ---------- campos ---------- */
#waiver-app .form-label { font-weight: 800 !important; color: var(--bk-marino) !important; font-size: 14.5px; letter-spacing: .3px; }
#waiver-app .form-control, #waiver-app .form-select {
  border: 3px solid var(--bk-marino) !important; border-radius: 14px !important; padding: 11px 14px !important;
  font-family: 'Baloo 2'; font-weight: 600 !important; font-size: 16px !important; color: var(--bk-marino) !important;
  background: #fff !important; box-shadow: none !important;
}
#waiver-app .form-control:focus, #waiver-app .form-select:focus {
  border-color: var(--bk-naranja) !important; box-shadow: 0 0 0 4px rgba(240,102,43,.25) !important;
}
#waiver-app .form-control::placeholder { color: #9aa3c4; font-weight: 600; }
#waiver-app .form-check-input { width: 22px; height: 22px; border: 3px solid var(--bk-marino) !important; margin-top: 2px; }
#waiver-app .form-check-input:checked { background-color: var(--bk-naranja) !important; border-color: var(--bk-marino) !important; }
#waiver-app .form-check-label { font-weight: 700 !important; color: var(--bk-marino); }
.child-row { background: var(--bk-crema) !important; border: 3px solid var(--bk-marino); border-radius: 18px !important; padding: 16px !important; }
.acknowledgment-item { background: var(--bk-crema) !important; border: 3px solid var(--bk-marino); border-radius: 18px; }
.acknowledgment-item h5, .acknowledgment-item h6, .acknowledgment-item .fw-bold { font-family: 'Titan One', sans-serif; font-weight: 400 !important; color: var(--bk-naranja); letter-spacing: .3px; }
.acknowledgment-item img { border: 3px solid var(--bk-marino); border-radius: 12px; box-shadow: 4px 5px 0 var(--bk-marino) !important; }

/* ---------- botones ---------- */
#waiver-app .btn {
  font-family: 'Titan One', sans-serif !important; font-weight: 400 !important; font-size: 17px !important; letter-spacing: .5px;
  border-radius: 999px !important; padding: 11px 26px !important;
  border: 4px solid var(--bk-marino) !important; box-shadow: 0 6px 0 var(--bk-marino) !important;
  transition: transform .12s, box-shadow .12s !important;
}
#waiver-app .btn:active { transform: translateY(4px); box-shadow: 0 2px 0 var(--bk-marino) !important; }
#waiver-app .btn-primary, #waiver-app .btn-waiver-primary, #waiver-app .btn-success { background: var(--bk-naranja) !important; color: #fff !important; }
#waiver-app .btn-secondary, #waiver-app .btn-waiver-secondary { background: #fff !important; color: var(--bk-marino) !important; }
#waiver-app .btn-sm { font-size: 14px !important; padding: 7px 16px !important; border-width: 3px !important; box-shadow: 0 4px 0 var(--bk-marino) !important; }
#waiver-app .btn:hover { filter: none !important; }
#waiver-app .btn:disabled { opacity: .55; }

/* ---------- firma ---------- */
#signature-wrap { border: 4px solid var(--bk-marino) !important; border-radius: 18px !important; background: #fff; box-shadow: inset 0 0 0 3px var(--bk-crema); }
#signature-pad { border-radius: 14px; }

/* ---------- exito ---------- */
#step-success .card, #waiver_success .card { text-align: center; }
#step-success h2, .text-success { color: var(--bk-naranja) !important; font-family: 'Titan One', sans-serif; font-weight: 400; }
#waiver-code { font-family: 'Titan One'; font-size: 28px; color: var(--bk-marino); letter-spacing: 2px; }
#step-success img, #waiver_success img { border: 5px solid var(--bk-marino); border-radius: 14px; box-shadow: 6px 7px 0 var(--bk-marino); background: #fff; padding: 8px; }

/* ---------- alertas ---------- */
#waiver-app .alert { border: 3px solid var(--bk-marino) !important; border-radius: 16px !important; font-weight: 700; }
#waiver-app .alert-danger { background: #FFE3D6 !important; color: #8A2E00 !important; }
#waiver-app .alert-success { background: #E6F7EE !important; color: #14532d !important; }
#waiver-app .alert-info, #waiver-app .alert-warning { background: var(--bk-crema) !important; color: var(--bk-marino) !important; }

@media (max-width: 575px) {
  #waiver-app { padding-top: 66px !important; }
  #waiver-app .card { border-width: 4px !important; border-radius: 22px !important; box-shadow: 6px 7px 0 var(--bk-marino) !important; }
  #waiver-app .card-body { padding: 18px !important; }
  #waiver-app .btn { width: 100%; }
  #waiver-app .card-footer.d-flex { flex-direction: column; gap: 10px; }
}