/* My Garage 0.23.67 — refined intro, sign-in, new garage and invitation screens. */

/* One brand row opens every auth card: garage badge + short label. */
body.auth-view .auth-brand-row{display:flex;align-items:center;gap:10px;margin:0 0 14px}
body.auth-view .auth-brand-badge{width:38px;height:38px;flex-shrink:0;border-radius:11px;background:#13213C;display:grid;place-items:center}
body.auth-view .auth-brand-badge img{width:25px;height:25px;display:block}
body.auth-view .auth-brand-label{font-size:16px;font-weight:700;line-height:1.3;color:#9A7036}

/* Old per-card marks and eyebrows are replaced by the brand row. */
body.auth-view .auth-card .invitation-wordmark{display:none!important}

/* Card sits under the header instead of floating mid-screen on phones. */
@media (max-width:600px){
  body.auth-view .auth-layout,
  body.auth-view .signup-landing-layout{
    align-items:flex-start!important;
    justify-content:flex-start!important;
    align-self:start!important;
    margin:0 auto!important;
    padding-top:clamp(6px,2.5vh,28px)!important;
  }
  body.auth-view .auth-card,
  body.auth-view .signup-intro-card{margin:0 auto!important;padding:26px 22px 24px!important}
}

/* Readable type: nothing on these screens below 13px. */
body.auth-view .auth-card h2{font-size:24px!important;line-height:1.4!important;margin:0!important}
body.auth-view .signup-intro-card h2{font-size:21px!important;text-wrap:balance}
body.auth-view .auth-card .auth-subtitle{font-size:15px!important;line-height:1.7!important;margin:8px 0 20px!important}
body.auth-view .auth-card .private-invite-note{font-size:13.5px!important;line-height:1.7!important;margin:0 0 18px!important;padding:12px 14px!important}
body.auth-view .social-auth-btn{font-size:15px!important;min-height:52px}
body.auth-view .social-provider-note{font-size:13px!important;line-height:1.7!important;margin-top:16px!important}
body.auth-view .auth-switch{font-size:14px!important}
body.auth-view .auth-switch .btn.link{font-size:14px!important}
body.auth-view .email-auth-back{font-size:14px!important;margin-bottom:18px!important}
body.auth-view .auth-method-divider span{font-size:13px!important}
body.auth-view .auth-trial{padding:13px 14px!important;margin:0 0 18px!important}
body.auth-view .auth-trial strong{font-size:14.5px!important}
body.auth-view .auth-trial small{font-size:13px!important;line-height:1.7!important}
body.auth-view .auth-form label{font-size:14px!important}
body.auth-view .auth-tools small,
body.auth-view .auth-tools .btn.link{font-size:13px!important}

body.auth-view .auth-provider-pair .social-auth-btn{font-size:15px!important;padding:10px 12px!important}

/* Intro card details */
body.auth-view .signup-intro-card .intro-benefits strong{font-size:12.5px!important;line-height:1.45!important}
body.auth-view .signup-intro-card .auth-submit{min-height:56px;font-size:16.5px!important}
body.auth-view .signup-intro-card .trial-reassurance{font-size:13px!important;margin:12px 0 18px!important}
body.auth-view .signup-intro-card .intro-legal-link{font-size:13px!important}

/* ---------- 0.23.68 — full-page cards and larger type (matches the approved splash-intro mockup) ---------- */

/* Language button: globe + language name, no chevron, larger tap target. */
body.auth-view .auth-language-trigger{
  gap:8px!important;min-height:46px!important;max-width:none!important;padding:11px 16px!important;
  border:1px solid #E4E7EE!important;border-radius:14px!important;background:#fff!important;
  color:#13213C!important;font-size:15px!important;font-weight:500!important;
}
body.auth-view .auth-language-trigger svg{width:19px!important;height:19px!important}
body.auth-view .auth-language-trigger svg:last-child:not(:first-child){display:none!important}
body.auth-view .auth-language-trigger span{max-width:none!important;overflow:visible!important}

@media (max-width:600px){
  /* The page scrolls if a small phone needs it, instead of clipping the card. */
  body.auth-view.signup-landing-view{height:auto!important;min-height:100dvh!important;overflow-x:hidden!important;overflow-y:auto!important}
  body.auth-view.signup-landing-view .auth-shell{height:auto!important;min-height:100dvh!important}

  body.auth-view .auth-layout,
  body.auth-view .signup-landing-layout{
    padding:12px 16px calc(16px + env(safe-area-inset-bottom,0px))!important;
    flex:1 1 auto;
  }
  /* The card fills the screen below the header: no empty band at the bottom. */
  body.auth-view .auth-card,
  body.auth-view .signup-intro-card{
    display:flex!important;flex-direction:column;
    min-height:calc(100dvh - 86px - env(safe-area-inset-top,0px) - 28px - env(safe-area-inset-bottom,0px));
    padding:28px 22px 26px!important;border-radius:28px!important;
  }
  /* Story at the top, actions anchored low in the card where the thumb reaches. */
  body.auth-view .signup-intro-card>.auth-submit,
  body.auth-view .auth-path-card>.social-auth-actions,
  body.auth-view .invited-family-card>.social-auth-actions{margin-top:auto!important}
  body.auth-view .signup-intro-card .auth-switch{margin-top:22px!important}
  body.auth-view .auth-card.signup-intro-card>.intro-benefits{margin-top:auto!important}
  body.auth-view .auth-loading{justify-content:center}
}

/* Type scale shared by intro, sign-in and new garage. */
body.auth-view .auth-brand-row{gap:12px;margin:0 0 18px}
body.auth-view .auth-brand-badge{width:40px;height:40px;border-radius:12px}
body.auth-view .auth-brand-badge img{width:27px;height:27px}
body.auth-view .auth-brand-label{font-size:18px}
body.auth-view .auth-card h2,
body.auth-view .signup-intro-card h2{font-size:clamp(25px,7.4vw,31px)!important;line-height:1.35!important;color:#13213C!important;text-wrap:balance}
body.auth-view .auth-card .auth-subtitle{font-size:16px!important;line-height:1.65!important;margin:10px 0 22px!important}

body.auth-view .signup-intro-card .intro-benefits{gap:10px!important;margin:0 0 24px!important}
body.auth-view .signup-intro-card .intro-benefits span{min-height:112px!important;padding:16px 6px!important;gap:10px!important;border-radius:18px!important}
body.auth-view .signup-intro-card .intro-benefits svg{width:28px!important;height:28px!important}
body.auth-view .signup-intro-card .intro-benefits strong{font-size:14.5px!important;line-height:1.45!important}

body.auth-view .signup-intro-card .auth-submit,
body.auth-view .auth-card .auth-submit{min-height:58px!important;border-radius:18px!important;font-size:17px!important}
body.auth-view .signup-intro-card .trial-reassurance{font-size:14px!important;margin:14px 0 0!important}
body.auth-view .auth-switch,
body.auth-view .auth-switch .btn.link{font-size:15px!important}
body.auth-view .signup-intro-card .intro-legal-link{font-size:14px!important;margin-top:14px!important;align-self:center}

body.auth-view .social-auth-btn{min-height:56px!important;border-radius:16px!important;font-size:16px!important}
body.auth-view .auth-provider-pair .social-auth-btn{font-size:16px!important}
body.auth-view .social-provider-note{font-size:14px!important}
body.auth-view .email-auth-back{font-size:15px!important}
body.auth-view .auth-trial strong{font-size:15px!important}
body.auth-view .auth-trial small{font-size:14px!important}
@media (max-width:380px){
  body.auth-view .signup-intro-card .auth-submit{font-size:16px!important;padding-inline:14px!important}
}

/* ---------- 0.23.69 — one size step down, pill back button, language sheet ---------- */

/* Slightly smaller type and controls across intro, sign-in, new garage and invitation. */
@media (max-width:600px){
  body.auth-view .auth-card,
  body.auth-view .signup-intro-card{padding:24px 20px 22px!important;border-radius:26px!important}
}
body.auth-view .auth-brand-row{gap:10px;margin:0 0 16px}
body.auth-view .auth-brand-badge{width:36px;height:36px;border-radius:11px}
body.auth-view .auth-brand-badge img{width:24px;height:24px}
body.auth-view .auth-brand-label{font-size:17px}
body.auth-view .auth-card h2,
body.auth-view .signup-intro-card h2{font-size:clamp(23px,6.6vw,28px)!important}
body.auth-view .auth-card .auth-subtitle{font-size:15px!important;margin:8px 0 20px!important}
body.auth-view .signup-intro-card .intro-benefits span{min-height:100px!important;padding:14px 6px!important;gap:8px!important;border-radius:16px!important}
body.auth-view .signup-intro-card .intro-benefits svg{width:26px!important;height:26px!important}
body.auth-view .signup-intro-card .intro-benefits strong{font-size:14px!important}
body.auth-view .signup-intro-card .auth-submit,
body.auth-view .auth-card .auth-submit{min-height:54px!important;border-radius:16px!important;font-size:16.5px!important}
body.auth-view .signup-intro-card .trial-reassurance{font-size:13.5px!important}
body.auth-view .auth-switch,
body.auth-view .auth-switch .btn.link{font-size:14.5px!important}
body.auth-view .social-auth-btn,
body.auth-view .auth-provider-pair .social-auth-btn{min-height:52px!important;border-radius:15px!important;font-size:15.5px!important}
body.auth-view .social-provider-note{font-size:13.5px!important}
body.auth-view .auth-trial strong{font-size:14.5px!important}
body.auth-view .auth-trial small{font-size:13.5px!important}
body.auth-view .auth-card .private-invite-note{font-size:13.5px!important}

/* Back button: bordered pill at the top start of the card; arrow points "back" in both directions. */
body.auth-view .auth-card .email-auth-back{
  align-self:flex-start;display:inline-flex!important;align-items:center;gap:8px;width:auto!important;
  min-height:40px;margin:0 0 20px!important;padding:0 16px 0 14px!important;
  border:1px solid #E4E7EE!important;border-radius:999px!important;background:#F5F7FB!important;
  color:#13213C!important;font-size:14.5px!important;font-weight:600!important;text-decoration:none!important;
}
body.auth-view .auth-card .email-auth-back:active{background:#EBEFF6!important}
body.auth-view .auth-card .email-auth-back svg{width:18px!important;height:18px!important;flex:none}
[dir="rtl"] body.auth-view .auth-card .email-auth-back svg{transform:none!important}
[dir="ltr"] body.auth-view .auth-card .email-auth-back svg{transform:scaleX(-1)!important}

/* Language sheet: one row per language, name in its own script, check on the current one. */
.modal.language-sheet .modal-head{padding:20px 20px 14px!important}
.modal.language-sheet .modal-head h2{font-size:21px!important;font-weight:700;color:#13213C}
.modal.language-sheet .modal-head .icon-btn{width:40px;height:40px;border-radius:50%;border:1px solid #E4E7EE;background:#fff}
.modal.language-sheet .modal-body{padding:0 18px calc(20px + env(safe-area-inset-bottom,0px))!important}
.lang-sheet-list{display:flex;flex-direction:column;gap:6px}
.lang-row{display:flex;align-items:center;gap:14px;width:100%;min-height:56px;padding:8px 16px;border:1px solid #E4E7EE;border-radius:15px;background:#fff;color:#13213C;text-align:start;cursor:pointer;font:inherit;transition:border-color .15s,background .15s}
.lang-row:active{background:#F5F7FB}
.lang-row:focus-visible{outline:2px solid #F2A33A;outline-offset:2px}
.lang-row-text{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:1px}
.lang-row-name{font-size:16px;font-weight:700;line-height:1.35}
.lang-row-meta{font-size:13px;color:#5E6878;line-height:1.35}
.lang-row-mark{width:24px;height:24px;flex:none;border-radius:50%;border:2px solid #C9CFD9;display:grid;place-items:center;color:#fff}
.lang-row-mark svg{width:14px;height:14px;stroke-width:3;opacity:0}
.lang-row[aria-checked="true"]{border:1.5px solid #13213C;background:#F5F7FB}
.lang-row[aria-checked="true"] .lang-row-mark{border-color:#13213C;background:#13213C}
.lang-row[aria-checked="true"] .lang-row-mark svg{opacity:1}

/* ---------- 0.23.70 — Apple sign-in shown again as "coming soon" ---------- */
body.auth-view .social-auth-btn.apple:disabled{
  background:#fff!important;border:1px dashed #C9CFD9!important;color:#5E6878!important;
  cursor:default;opacity:1!important;gap:8px!important;
}
body.auth-view .social-auth-btn.apple:disabled svg{opacity:.55}
body.auth-view .social-auth-coming-note{
  display:inline-flex;align-items:center;min-height:22px;padding:0 9px;border-radius:999px;
  background:#F7EEDD;border:1px solid #E9D6AE;color:#7A5520!important;
  font-size:12px!important;font-weight:700!important;line-height:1;white-space:nowrap;
}
body.auth-view .auth-provider-pair .social-auth-coming-note{font-size:11px!important;padding:0 7px;min-height:20px}
body.auth-view .auth-provider-pair .social-auth-btn{padding:8px 8px!important;gap:6px!important}
/* In the half-width pair, the Apple logo carries the name so the "coming soon" tag always fits. */
body.auth-view .auth-provider-pair .social-auth-btn.apple:disabled>span{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.auth-view .auth-provider-pair .social-auth-btn.apple:disabled{position:relative}
body.auth-view .auth-provider-pair .social-auth-btn.apple:disabled svg{width:20px!important;height:20px!important}
