/* Blue gradient re-skin — SCOPED to body.bg-blue-gradient (index.php,
   kelahiran.php) and .kelahiran-page (kelahiran.php only). kelahiran.css is
   shared by 16 other form pages via the generic .birth-page class, so this
   file targets a page-specific class instead of editing that shared file,
   keeping the change limited to these two pages. Must load AFTER
   home.css/support.css/kelahiran.css so equal-specificity overrides win. */

body.bg-blue-gradient{
  background:
    radial-gradient(900px circle at 6% -8%, rgba(18,99,221,.16), transparent 60%),
    radial-gradient(760px circle at 100% 4%, rgba(64,140,255,.18), transparent 55%),
    radial-gradient(820px circle at 46% 115%, rgba(10,64,160,.12), transparent 60%),
    linear-gradient(160deg, #eef4ff 0%, #e7f0fd 45%, #eef3fb 100%);
}
body.bg-blue-gradient.dark{
  background:
    radial-gradient(900px circle at 6% -8%, rgba(64,140,255,.22), transparent 60%),
    radial-gradient(760px circle at 100% 4%, rgba(18,99,221,.26), transparent 55%),
    radial-gradient(820px circle at 46% 115%, rgba(10,64,160,.20), transparent 60%),
    linear-gradient(160deg, #070b14 0%, #0a1424 45%, #0b1626 100%);
}

/* ---- Kelahiran form: shape + color re-skin to match the reference (blue
   focus states, rounder fields), replacing the teal accent from
   kelahiran.css for this page only. ---- */
.kelahiran-page .form-input,
.kelahiran-page .form-select,
.kelahiran-page .date-select-group .form-select,
.kelahiran-page .chip-option span{border-radius:14px}

.kelahiran-page .form-section{box-shadow:0 14px 34px rgba(18,99,221,.12)}
.kelahiran-page.dark .form-section{box-shadow:0 14px 34px rgba(0,0,0,.4)}

.kelahiran-page .form-input:focus,
.kelahiran-page .form-select:focus{border-color:#1263DD;outline:3px solid rgba(18,99,221,.32);box-shadow:none}
.kelahiran-page.dark .form-input:focus,
.kelahiran-page.dark .form-select:focus{border-color:#7EB4FF;outline-color:rgba(126,180,255,.28)}

.kelahiran-page .chip-option input:focus-visible+span{outline:3px solid #1263DD;outline-offset:3px;box-shadow:none}
.kelahiran-page.dark .chip-option input:focus-visible+span{outline-color:#7EB4FF}

.kelahiran-page .date-select-group .form-select:hover{border-color:#1263DD}
.kelahiran-page .date-select-group .form-select:focus{border-color:#1263DD;outline:3px solid rgba(18,99,221,.32);outline-offset:1px}
.kelahiran-page.dark .date-select-group .form-select:hover{border-color:#7EB4FF}
.kelahiran-page.dark .date-select-group .form-select:focus{border-color:#7EB4FF;outline-color:rgba(126,180,255,.28)}

.kelahiran-page .form-section-header,
.kelahiran-page summary.form-section-header{border-top:3px solid #1263DD}
.kelahiran-page.dark .form-section-header,
.kelahiran-page.dark summary.form-section-header{border-top-color:#7EB4FF}

.kelahiran-page .info-tip:focus-visible{outline:2px solid #1263DD;outline-offset:2px}
.kelahiran-page.dark .info-tip:focus-visible{outline-color:#7EB4FF}

.kelahiran-page button:focus-visible,
.kelahiran-page a:focus-visible,
.kelahiran-page input:focus-visible,
.kelahiran-page select:focus-visible{outline:3px solid #1263DD;outline-offset:3px}
.kelahiran-page.dark button:focus-visible,
.kelahiran-page.dark a:focus-visible,
.kelahiran-page.dark input:focus-visible,
.kelahiran-page.dark select:focus-visible{outline-color:#7EB4FF}

.kelahiran-page summary:focus-visible{outline:3px solid #1263DD;outline-offset:-3px}
.kelahiran-page.dark summary:focus-visible{outline-color:#7EB4FF}