/*!
 * Queen Forms Core - shared UI.
 *
 * PHASE 1 delivers the design tokens: one set of Queen colours, faces and
 * easing that every form draws from, so changing the gold once changes it
 * everywhere. A form puts "queen-form" on its root and inherits them, then
 * keeps its own layout, components and overrides.
 *
 * The component primitives - fields, dropdown panel, tags, buttons, error
 * styling - are still inside each form's stylesheet. Measured: 142 clearly
 * shared rules, 61 clearly form-specific, and 22 that straddle both. That last
 * group is where a bulk move would quietly change an approved appearance, so
 * they move rule by rule in Phase 2 against the visual tests.
 */

.queen-form{
  --qej-ivory:#F9F5ED;
  --qej-sheet:#FFFDF8;
  --qej-gold:#CDA65D;
  --qej-gold-ink:#8A5F12;
  --qej-espresso:#211B18;
  --qej-charcoal:#2B2521;
  --qej-muted:#4A4139;
  --qej-soft:#5C5248;
  --qej-rule:rgba(33,27,24,.24);
  --qej-rule-2:rgba(33,27,24,.55);
  --qej-err:#8C3A24;
  --qej-photo-fallback:
    linear-gradient(to bottom,
      #5E7B96 0%, #7E8F96 12%, #B08A5E 25%, #D9A868 33%,
      #E7BE7F 39%, #B98A55 48%, #86603A 60%, #5A4028 74%,
      #3A2A1C 88%, #241A12 100%);
  --qej-serif:"Cormorant Garamond","Didot",Garamond,serif;
  --qej-sans:"Jost",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --qej-ease:cubic-bezier(.22,.61,.36,1);
}

/* A form whose Core is missing renders nothing rather than something
   half-styled. This makes that state unmistakable. */
.queen-form[data-queen-unavailable]{display:none !important;}


/* ==========================================================================
   SHARED COMPONENTS
   The field rule, the dropdown, the tags, the buttons, the error styling and
   the consent controls - the parts every Queen form draws with. Moved here
   rule by rule and checked against a computed-style snapshot of the approved
   Plan My Journey, so nothing shifted by a pixel.

   A form's own stylesheet loads AFTER this one and may override anything.
   ========================================================================== */

.qej-sr{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.qej-block{margin:0 0 clamp(26px,3.2vw,38px);position:relative;}
.qej-block:last-child{margin-bottom:0;}
.qej-lb{display:block;margin:0 0 11px;
  font-family:var(--qej-sans);font-size:14px;font-weight:500;
  letter-spacing:.015em;line-height:1.5;color:var(--qej-charcoal);}
.qej-req{color:var(--qej-gold-ink);font-weight:400;}
.qej-req--q{font-size:.42em;vertical-align:.9em;letter-spacing:0;}
.qej-opt{font-size:12px;font-weight:400;letter-spacing:.02em;
  color:var(--qej-soft);text-transform:none;}
.qej-err{display:none;margin-top:8px;font-size:13px;font-weight:500;line-height:1.5;
  color:var(--qej-err);}
.qej-block.qej-bad .qej-err{display:block;}
.qej-sel{position:relative;min-width:0;}
.qej-sel--wide .qej-sel__panel{min-width:100%;}
.qej-sel__btn{display:flex;align-items:center;gap:10px;width:100%;
  padding:8px 0 12px;background:none;border:0;
  border-bottom:1px solid var(--qej-rule-2);border-radius:0;cursor:pointer;
  font-family:var(--qej-sans);font-size:17.5px;font-weight:400;line-height:1.4;
  color:var(--qej-espresso);text-align:left;
  transition:border-color .35s var(--qej-ease),color .35s var(--qej-ease);}
.qej-sel__btn:hover{border-bottom-color:var(--qej-gold);}
.qej-sel__btn:focus-visible{outline:1px solid var(--qej-gold-ink);outline-offset:5px;
  border-bottom-color:var(--qej-gold);}
.qej-sel.qej-open .qej-sel__btn{border-bottom-color:var(--qej-gold);}
.qej-sel__btn[disabled]{cursor:default;color:rgba(33,27,24,.32);
  border-bottom-style:dashed;}
.qej-sel__val{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;}
.qej-sel__val.qej-ph{color:var(--qej-soft);}
.qej-sel__flag{flex:none;font-size:18px;line-height:1;}
.qej-sel__car{flex:none;width:7px;height:7px;margin:-4px 2px 0 0;
  border-right:1px solid var(--qej-gold-ink);
  border-bottom:1px solid var(--qej-gold-ink);
  transform:rotate(45deg);transition:transform .35s var(--qej-ease);}
.qej-sel.qej-open .qej-sel__car{transform:rotate(-135deg);margin-top:2px;}
.qej-sel__panel{position:absolute;z-index:200;top:calc(100% + 3px);left:0;
  width:100%;min-width:210px;background:var(--qej-sheet);
  border:1px solid rgba(33,27,24,.13);
  box-shadow:0 26px 54px -34px rgba(30,22,14,.55);
  display:none;max-height:320px;overflow:hidden;}
.qej-sel.qej-open .qej-sel__panel{display:block;}
.qej-sel__panel.qej-right{left:auto;right:0;}
.qej-sel__find{position:sticky;top:0;z-index:2;display:block;width:100%;
  height:46px;padding:0 17px;border:0;border-bottom:1px solid var(--qej-rule);
  background:var(--qej-sheet);
  font-family:var(--qej-sans);font-size:16px;font-weight:400;
  color:var(--qej-espresso);}
.qej-sel__find:focus{outline:none;box-shadow:inset 0 -1px 0 var(--qej-gold);}
.qej-sel__list{max-height:255px;overflow-y:auto;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;}
.qej-sel__opt{display:flex;align-items:center;gap:11px;width:100%;
  padding:11px 17px;background:none;border:0;border-radius:0;cursor:pointer;
  text-align:left;font-family:var(--qej-sans);font-size:15.5px;font-weight:400;
  color:var(--qej-espresso);
  transition:background-color .2s var(--qej-ease);}
.qej-sel__opt:hover,.qej-sel__opt.qej-cursor{background:rgba(205,166,93,.13);}
.qej-sel__opt[aria-selected="true"],.qej-sel__opt[aria-checked="true"]{
  font-weight:500;}
.qej-sel__opt .qej-tick{margin-left:auto;flex:none;width:13px;height:7px;
  border-left:1px solid var(--qej-gold-ink);
  border-bottom:1px solid var(--qej-gold-ink);
  transform:rotate(-45deg) scale(.9);opacity:0;
  transition:opacity .2s var(--qej-ease);}
.qej-sel__opt[aria-selected="true"] .qej-tick,
.qej-sel__opt[aria-checked="true"] .qej-tick{opacity:1;}
.qej-sel__opt.qej-locked{opacity:.34;cursor:default;}
.qej-sel__opt em{font-style:normal;margin-left:auto;padding-left:10px;
  font-size:14px;color:var(--qej-muted);font-variant-numeric:tabular-nums;}
.qej-sel__opt em + .qej-tick{margin-left:11px;}
.qej-sel__none{padding:16px 17px;font-size:14px;color:var(--qej-muted);}
.qej-sel__foot{display:flex;align-items:center;justify-content:space-between;
  gap:14px;padding:9px 13px 9px 17px;border-top:1px solid var(--qej-rule);
  font-size:11.5px;letter-spacing:.06em;color:var(--qej-muted);}
.qej-sel__foot span{min-height:1em;}
.qej-sel__foot button{display:inline-flex;align-items:center;min-height:32px;
  padding:0 14px;background:transparent;
  border:1px solid rgba(138,95,18,.45);border-radius:0;cursor:pointer;
  font-family:var(--qej-sans);font-size:10.5px;font-weight:500;letter-spacing:.18em;
  text-transform:uppercase;color:var(--qej-gold-ink);
  transition:background-color .3s var(--qej-ease),color .3s var(--qej-ease);}
.qej-sel__foot button:hover{background:var(--qej-espresso);color:#E3C489;
  border-color:var(--qej-espresso);}
.qej-sel__foot button:focus-visible{outline:1px solid var(--qej-gold-ink);
  outline-offset:2px;}
.qej-sel__foot.qej-flash{color:var(--qej-err);}
.qej-chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;}
.qej-chips:empty{display:none;}
.qej-chip{display:inline-flex;align-items:center;gap:2px;height:37px;
  padding:0 5px 0 16px;background:var(--qej-sheet);
  border:1px solid rgba(138,95,18,.62);
  font-size:13px;font-weight:500;letter-spacing:.055em;
  color:var(--qej-espresso);}
.qej-chip span{padding-right:4px;}
.qej-chip button{width:24px;height:24px;padding:0;background:none;border:0;
  border-radius:0;cursor:pointer;color:var(--qej-gold-ink);
  font-family:var(--qej-sans);font-size:15px;line-height:1;
  transition:color .25s var(--qej-ease);}
.qej-chip button:hover{color:var(--qej-espresso);}
.qej-chip button:focus-visible{outline:1px solid var(--qej-gold-ink);
  outline-offset:1px;}
.qej-in{display:block;width:100%;padding:8px 0 12px;background:none;border:0;
  border-bottom:1px solid var(--qej-rule-2);border-radius:0;
  font-family:var(--qej-sans);font-size:17.5px;font-weight:400;line-height:1.4;
  color:var(--qej-espresso);
  transition:border-color .35s var(--qej-ease);}
.qej-in:focus{outline:none;border-bottom-color:var(--qej-gold);}
.qej-in::placeholder{color:var(--qej-soft);opacity:1;}
.qej-block.qej-bad .qej-in,
.qej-block.qej-bad .qej-area,
.qej-block.qej-bad .qej-sel__btn{border-bottom-color:var(--qej-err);}
.qej-block.qej-bad .qej-chip{border-color:rgba(140,58,36,.5);}
.qej-area{display:block;width:100%;min-height:96px;padding:10px 0 12px;
  resize:vertical;background:none;border:0;
  border-bottom:1px solid var(--qej-rule-2);border-radius:0;
  font-family:var(--qej-sans);font-size:16px;font-weight:400;line-height:1.65;
  color:var(--qej-espresso);}
.qej-area:focus{outline:none;border-bottom-color:var(--qej-gold);}
.qej-area::placeholder{color:var(--qej-soft);opacity:1;}
.qej-duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,30px);}
.qej-narrow{max-width:320px;}
.qej-cols{display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(26px,4vw,50px);align-items:start;
  margin:0 0 clamp(26px,3.2vw,38px);}
.qej-cols > .qej-block{margin-bottom:0;}
.qej-tel{display:grid;grid-template-columns:112px minmax(0,1fr);gap:14px;}
.qej-tel .qej-sel__panel{width:min(340px,calc(100vw - 56px));}
.qej-reveal{animation:qejOpen .45s var(--qej-ease) backwards;}
.qej-block:has(.qej-sel.qej-open){z-index:9999;}
.qej-checks{margin-top:clamp(28px,4vw,40px);padding-top:clamp(20px,3vw,26px);
  border-top:1px solid var(--qej-rule);}
.qej-terms{margin:0 0 14px;font-size:12.5px;line-height:1.6;
  color:var(--qej-muted);max-width:60ch;}
.qej-terms a{color:var(--qej-gold-ink);text-decoration:none;
  border-bottom:1px solid rgba(143,98,22,.4);}
.qej-terms a:hover{color:var(--qej-espresso);border-bottom-color:var(--qej-espresso);}
.qej-check{display:flex;align-items:flex-start;gap:13px;position:relative;
  margin:0 0 15px;cursor:pointer;font-size:13px;line-height:1.62;
  color:var(--qej-charcoal);}
.qej-check:last-child{margin-bottom:0;}
.qej-check input{position:absolute;opacity:0;width:16px;height:16px;margin:0;
  cursor:pointer;}
.qej-check .qej-box{flex:none;width:16px;height:16px;margin-top:3px;
  position:relative;background:transparent;
  border:1px solid rgba(33,27,24,.5);
  transition:background-color .25s var(--qej-ease),
             border-color .25s var(--qej-ease);}
.qej-check .qej-box::after{content:"";position:absolute;left:5px;top:1px;
  width:4px;height:8px;border-right:1.5px solid var(--qej-sheet);
  border-bottom:1.5px solid var(--qej-sheet);
  transform:rotate(45deg) scale(.4);opacity:0;
  transition:transform .22s var(--qej-ease),opacity .22s var(--qej-ease);}
.qej-check input:checked ~ .qej-box{background:var(--qej-gold-ink);
  border-color:var(--qej-gold-ink);}
.qej-check input:checked ~ .qej-box::after{transform:rotate(45deg) scale(1);
  opacity:1;}
.qej-check input:focus-visible ~ .qej-box{border-color:var(--qej-gold-ink);
  box-shadow:0 0 0 2px rgba(205,166,93,.45);}
.qej-check a{color:var(--qej-gold-ink);text-decoration:none;
  border-bottom:1px solid rgba(143,98,22,.4);}
.qej-check a:hover{color:var(--qej-espresso);border-bottom-color:var(--qej-espresso);}
.qej-check .qej-second{color:var(--qej-muted);}
.qej-sel__foot:empty{display:none;}
.qej-block.qej-bad .qej-check .qej-box{border-color:var(--qej-err);}
.qej-nav{display:flex;align-items:center;justify-content:space-between;gap:20px;
  margin-top:clamp(24px,3vw,38px);padding-top:clamp(16px,2.2vw,22px);
  border-top:1px solid var(--qej-rule);}
.qej-back{padding:6px 0;background:none;border:0;border-radius:0;cursor:pointer;
  font-family:var(--qej-sans);font-size:11px;font-weight:400;letter-spacing:.2em;
  text-transform:uppercase;color:var(--qej-charcoal);font-weight:500;
  border-bottom:1px solid rgba(33,27,24,.3);
  transition:color .3s var(--qej-ease),border-color .3s var(--qej-ease);}
.qej-back:hover{color:var(--qej-espresso);border-bottom-color:var(--qej-gold);}
.qej-back:focus-visible{outline:1px solid var(--qej-gold-ink);outline-offset:4px;}
.qej-back[hidden]{display:none !important;}
.qej-go{display:inline-flex;align-items:center;justify-content:center;
  min-width:224px;height:58px;padding:0 38px;margin-left:0;
  /* Solid Queen gold, flat: no gradient, no shadow. The same treatment on
     every step, so the primary action always looks the same. */
  background:var(--qej-gold);color:#1F1B17;
  border:1px solid var(--qej-gold);border-radius:0;cursor:pointer;box-shadow:none;
  font-family:var(--qej-sans);font-size:11px;font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;
  transition:background-color .35s var(--qej-ease),
             border-color .35s var(--qej-ease);}
.qej-go::after{content:"\2192";margin-left:.85em;font-size:1.25em;line-height:0;
  transition:transform .35s var(--qej-ease);}
.qej-go:hover{background:#BC9350;border-color:#BC9350;color:#1F1B17;}
.qej-go:hover::after{transform:translateX(3px);}
.qej-go:focus-visible{outline:1px solid var(--qej-gold-ink);outline-offset:4px;}
.qej-msg{margin:0 20px 0 auto;font-size:13px;line-height:1.4;
  color:var(--qej-err);text-align:right;}
.qej-msg:empty{display:none;}