/*
Theme Name: JGT Vani Studio
Theme URI: https://vanistudio.local/
Author: Vani Studio
Description: Dark theme for Jammu's Got Talent Season 11 — Online Registration Portal.
Version: 1.0.1
License: GPL-2.0-or-later
Text Domain: jgt-vani
*/

:root{
  --jgt-bg:#0b0b0d;
  --jgt-bg-2:#141418;
  --jgt-card:#17171c;
  --jgt-surface:#0e0e12;
  --jgt-surface-2:#1c1c22;
  --jgt-border:rgba(212,175,106,.18);
  --jgt-border-2:rgba(255,255,255,.08);
  --jgt-gold:#d4af6a;
  --jgt-gold-2:#f3d27a;
  --jgt-gold-3:#a8843f;
  --jgt-text:#f5f5f7;
  --jgt-muted:#9a9aa3;
  --jgt-danger:#ff6b6b;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--jgt-bg);color:var(--jgt-text);
  font-family:'Poppins','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--jgt-gold-2);text-decoration:none}
a:hover{color:var(--jgt-gold)}

body{
  background:
    radial-gradient(900px 500px at 50% -10%, rgba(212,175,106,.18), transparent 60%),
    radial-gradient(700px 500px at 90% 110%, rgba(212,175,106,.08), transparent 60%),
    var(--jgt-bg);
  min-height:100vh;
}

/* Header / Footer */
.site-header{padding:28px 20px 8px;text-align:center}
.site-header .logo{width:140px;margin:0 auto 10px;filter:drop-shadow(0 8px 24px rgba(212,175,106,.25))}
.site-header .brand{font-family:'Playfair Display',Georgia,serif;letter-spacing:.18em;font-size:13px;color:var(--jgt-gold);text-transform:uppercase}
.site-footer{text-align:center;padding:30px 20px 40px;color:var(--jgt-muted);font-size:13px;border-top:1px solid var(--jgt-border);margin-top:40px}
.site-footer .gold{color:var(--jgt-gold)}

/* Main wrap */
.jgt-main{max-width:1100px;margin:0 auto;padding:40px 20px 80px}

/* HERO */
.jgt-hero{position:relative;text-align:center;padding:60px 20px 50px;overflow:hidden;
  border:1px solid var(--jgt-border);border-radius:24px;
  background:radial-gradient(circle at 50% 0%,rgba(212,175,106,.18),transparent 60%),var(--jgt-bg-2)}
.jgt-hero-inner{position:relative;z-index:2}
.jgt-eyebrow{display:inline-block;padding:6px 16px;border:1px solid var(--jgt-gold);color:var(--jgt-gold);
  font-size:12px;letter-spacing:3px;text-transform:uppercase;border-radius:999px}
.jgt-title{font-size:clamp(34px,6vw,68px);margin:18px 0 8px;font-weight:800;line-height:1.05}
.jgt-title small{display:block;font-size:16px;letter-spacing:8px;color:var(--jgt-muted);margin-top:10px;font-weight:400}
.jgt-gold{background:linear-gradient(90deg,var(--jgt-gold),var(--jgt-gold-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.jgt-sub{color:var(--jgt-muted);max-width:600px;margin:14px auto 24px;font-size:16px}
.jgt-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.jgt-meta span{background:rgba(255,255,255,.04);border:1px solid var(--jgt-border);padding:8px 14px;border-radius:999px;font-size:13px;color:#ddd}
.jgt-hero-glow{position:absolute;inset:auto 0 -50% 0;height:300px;background:radial-gradient(ellipse at center,rgba(212,175,106,.25),transparent 70%);filter:blur(40px)}

/* FORM CARD */
.jgt-form-wrap{margin-top:40px;position:relative;z-index:1}
.jgt-form-card{background:var(--jgt-card);border:1px solid var(--jgt-border);
  border-radius:24px;overflow:visible;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.jgt-form-head{padding:32px 36px 0;text-align:center}
.jgt-form-head h2{font-size:26px;margin:0 0 6px;color:var(--jgt-gold);font-family:'Playfair Display',serif}
.jgt-form-head p{color:var(--jgt-muted);margin:0 0 10px;font-size:14px}
.jgt-form-body{padding:24px 36px 32px}
.jgt-form-foot{padding:18px;text-align:center;border-top:1px solid var(--jgt-border);
  color:var(--jgt-muted);font-size:13px;background:rgba(0,0,0,.2)}

/* ========== FORMINATOR DARK OVERRIDES ========== */
.forminator-ui.forminator-design--default,
.forminator-ui.forminator-design--default *{font-family:'Poppins',sans-serif!important}

.forminator-ui .forminator-row{margin-bottom:18px!important;position:relative}

.forminator-ui .forminator-label,
.forminator-ui label{color:var(--jgt-gold)!important;font-weight:600!important;
  font-size:13px!important;letter-spacing:.5px;text-transform:uppercase;margin-bottom:8px!important;display:block}
.forminator-ui .forminator-required{color:var(--jgt-gold)!important}

.forminator-ui input[type=text],
.forminator-ui input[type=email],
.forminator-ui input[type=tel],
.forminator-ui input[type=url],
.forminator-ui input[type=password],
.forminator-ui input[type=number],
.forminator-ui input[type=date],
.forminator-ui select,
.forminator-ui textarea{
  background:var(--jgt-surface)!important;
  border:1px solid var(--jgt-border-2)!important;
  color:var(--jgt-text)!important;
  border-radius:12px!important;
  padding:14px 16px!important;
  font-size:15px!important;
  width:100%!important;
  transition:all .25s ease;
  box-shadow:none!important;
}
.forminator-ui input:focus,
.forminator-ui select:focus,
.forminator-ui textarea:focus{
  border-color:var(--jgt-gold)!important;
  box-shadow:0 0 0 4px rgba(212,175,106,.15)!important;
  outline:none!important;
}
.forminator-ui textarea{min-height:120px!important;resize:vertical}
.forminator-ui ::placeholder{color:#5a5a63!important}

/* ============================================
   FIX: Forminator custom SELECT dropdown
   (the overlap-on-open issue)
   ============================================ */

/* The field wrapper of a select must allow the panel to escape its box */
.forminator-ui .forminator-field-select,
.forminator-ui .forminator-select,
.forminator-ui .forminator-field--select{
  position:relative;
}

/* The visible "Select Your Talent" button */
.forminator-ui .forminator-select--field,
.forminator-ui .select2-selection,
.forminator-ui .select2-selection--single,
.forminator-ui .select2-selection--multiple{
  background:var(--jgt-surface)!important;
  border:1px solid var(--jgt-border-2)!important;
  color:var(--jgt-text)!important;
  border-radius:12px!important;
  min-height:52px!important;
  padding:12px 16px!important;
  display:flex!important;align-items:center;
  font-size:15px!important;
  box-shadow:none!important;
}
.forminator-ui .select2-selection__rendered,
.forminator-ui .select2-selection__placeholder{
  color:var(--jgt-text)!important;line-height:1.4!important;padding:0!important;
}
.forminator-ui .select2-selection__arrow b{border-color:var(--jgt-gold) transparent transparent transparent!important}

/* THE DROPDOWN PANEL (this is what was transparent & overlapping) */
.select2-container,
.select2-container--open{z-index:99999!important}

.select2-container .select2-dropdown,
.select2-dropdown,
.select2-dropdown--below,
.select2-dropdown--above,
.forminator-ui .forminator-select--dropdown,
.forminator-ui .forminator-select--options{
  background:#17171c!important;
  border:1px solid var(--jgt-gold)!important;
  border-radius:12px!important;
  box-shadow:0 20px 50px rgba(0,0,0,.7)!important;
  overflow:hidden!important;
  z-index:99999!important;
  margin-top:4px!important;
}

.select2-results,
.select2-results__options,
.forminator-ui .forminator-select--options{
  background:#17171c!important;
  max-height:260px!important;
  overflow-y:auto!important;
  padding:6px!important;
}

.select2-results__option,
.forminator-ui .forminator-select--option,
.forminator-ui .forminator-option{
  background:transparent!important;
  color:var(--jgt-text)!important;
  padding:12px 16px!important;
  border-radius:8px!important;
  font-size:15px!important;
  cursor:pointer!important;
  transition:background .15s ease, color .15s ease;
}
.select2-results__option--highlighted,
.select2-results__option--highlighted[aria-selected],
.select2-results__option:hover,
.forminator-ui .forminator-select--option:hover,
.forminator-ui .forminator-option:hover,
.forminator-ui .forminator-option--selected{
  background:rgba(212,175,106,.15)!important;
  color:var(--jgt-gold-2)!important;
}
.select2-results__option[aria-selected=true]{
  background:rgba(212,175,106,.1)!important;color:var(--jgt-gold)!important;
}

/* Scrollbar inside dropdown */
.select2-results__options::-webkit-scrollbar,
.forminator-ui .forminator-select--options::-webkit-scrollbar{width:8px}
.select2-results__options::-webkit-scrollbar-thumb,
.forminator-ui .forminator-select--options::-webkit-scrollbar-thumb{
  background:var(--jgt-gold-3);border-radius:8px;
}

/* Native <select> fallback (when Forminator doesn't enhance) */
.forminator-ui select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--jgt-gold) 50%),
                   linear-gradient(135deg,var(--jgt-gold) 50%,transparent 50%)!important;
  background-position:calc(100% - 22px) 22px, calc(100% - 16px) 22px!important;
  background-size:6px 6px,6px 6px!important;
  background-repeat:no-repeat!important;
  padding-right:44px!important;
}
.forminator-ui select option{background:#17171c!important;color:var(--jgt-text)!important;padding:10px!important}

/* Checkboxes & Radios */
.forminator-ui .forminator-checkbox,
.forminator-ui .forminator-radio{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--jgt-surface);border:1px solid var(--jgt-border-2);
  padding:12px 16px;border-radius:10px;margin:6px 8px 6px 0!important;
  transition:.2s;cursor:pointer;
}
.forminator-ui .forminator-checkbox:hover,
.forminator-ui .forminator-radio:hover{border-color:var(--jgt-gold);background:#1f1f26}
.forminator-ui .forminator-checkbox input,
.forminator-ui .forminator-radio input{accent-color:var(--jgt-gold);width:16px;height:16px}

/* Submit */
.forminator-ui button[type=submit],
.forminator-ui button.forminator-button-submit,
.forminator-ui .forminator-button-submit{
  background:linear-gradient(90deg,var(--jgt-gold),var(--jgt-gold-2))!important;
  color:#0b0b0d!important;border:none!important;
  padding:16px 40px!important;font-size:15px!important;font-weight:700!important;
  letter-spacing:1px;text-transform:uppercase;border-radius:999px!important;
  cursor:pointer;width:100%;margin-top:14px!important;
  box-shadow:0 10px 30px rgba(212,175,106,.3);
  transition:transform .2s, box-shadow .2s;
}
.forminator-ui button[type=submit]:hover,
.forminator-ui button.forminator-button-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 15px 40px rgba(212,175,106,.45);
}

/* Section headings inside form */
.forminator-ui .forminator-fieldset legend,
.forminator-ui .forminator-section-title,
.forminator-ui h3, .forminator-ui h4{
  color:var(--jgt-gold)!important;
  font-family:'Playfair Display',serif!important;
  font-size:18px!important;
  border-bottom:1px solid var(--jgt-border);
  padding-bottom:10px;margin:24px 0 16px!important;width:100%;
}

/* Messages */
.forminator-ui .forminator-error-message{color:var(--jgt-danger)!important;font-size:12px!important;margin-top:6px!important}
.forminator-ui .forminator-response-message.forminator-success{
  background:rgba(212,175,106,.1)!important;border:1px solid var(--jgt-gold)!important;
  color:var(--jgt-gold)!important;border-radius:12px;padding:18px;
}

/* Fallback notice */
.jgt-notice{background:rgba(212,175,106,.08);border:1px dashed var(--jgt-gold-3);
  color:var(--jgt-gold-2);padding:18px 20px;border-radius:12px;font-size:14px}
.jgt-notice code{background:rgba(0,0,0,.4);padding:2px 8px;border-radius:6px;color:var(--jgt-gold-2)}

/* ===== Mobile ===== */
@media (max-width:768px){
  .jgt-main{padding:24px 14px 60px}
  .jgt-hero{padding:40px 16px 36px;border-radius:18px}
  .jgt-title{font-size:34px}
  .jgt-title small{font-size:13px;letter-spacing:5px}
  .jgt-form-card{border-radius:18px}
  .jgt-form-head{padding:24px 18px 0}
  .jgt-form-body{padding:18px 16px 24px}
  .forminator-ui input,.forminator-ui select,.forminator-ui textarea,
  .forminator-ui .select2-selection{font-size:16px!important;padding:13px 14px!important}
  .forminator-ui .forminator-checkbox,.forminator-ui .forminator-radio{
    width:100%;margin:6px 0!important;
  }
  .forminator-ui button[type=submit]{padding:14px 24px!important;font-size:14px!important}
}
@media (max-width:400px){
  .jgt-title{font-size:28px}
  .jgt-form-head h2{font-size:20px}
}