/* Smart Muslim Auth — full-screen composition based on the approved iPhone artwork. */
:root { --auth-ink:#034b3b; --auth-gold:#bd8526; --auth-ivory:#fffaf0; --auth-copy:#414849; }
body.auth-foundation-open { overflow:hidden; }
.auth-foundation-overlay { position:fixed; z-index:25000; inset:0; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; color:var(--auth-ink); background:linear-gradient(180deg,rgba(255,251,242,.88) 0%,rgba(255,250,239,.72) 39%,rgba(255,250,239,.26) 100%),url("assets/auth/smart-muslim-auth-mosque-bg.png") center bottom/cover no-repeat,var(--auth-ivory); }
.auth-foundation-overlay::before { content:""; position:fixed; z-index:-1; inset:0; pointer-events:none; opacity:.38; background-image:linear-gradient(30deg,rgba(190,134,41,.11) 12%,transparent 12.5%,transparent 87%,rgba(190,134,41,.11) 87.5%),linear-gradient(150deg,rgba(190,134,41,.11) 12%,transparent 12.5%,transparent 87%,rgba(190,134,41,.11) 87.5%); background-size:28px 48px; mask-image:linear-gradient(to bottom,#000 0 20%,transparent 63%); }
.auth-foundation-dialog { box-sizing:border-box; position:relative; isolation:isolate; width:min(100%,500px); min-height:100svh; margin:0 auto; padding:max(28px,env(safe-area-inset-top)) clamp(28px,9vw,48px) max(26px,env(safe-area-inset-bottom)); display:flex; flex-direction:column; align-items:stretch; }
.auth-foundation-dialog::before { content:""; position:absolute; z-index:-1; pointer-events:none; top:max(16px,env(safe-area-inset-top)); right:21px; bottom:18px; left:21px; border:1px solid rgba(190,134,41,.18); border-radius:46% 46% 4% 4% / 18% 18% 3% 3%; box-shadow:inset 0 0 0 7px rgba(255,250,239,.16); }
.auth-screen { text-align:center; }.auth-brand { display:flex; flex-direction:column; align-items:center; flex:0 0 auto; }
.auth-brand-logo-frame { display:block; width:clamp(116px,32vw,144px); height:clamp(116px,32vw,144px); overflow:hidden; margin:2px auto 16px; filter:drop-shadow(0 10px 13px rgba(14,55,39,.17)); border-radius:25%; }
.auth-brand-logo { display:block; width:100%; height:auto; max-height:none; margin:0; transform:scale(1.85); transform-origin:50% 19%; }
.auth-brand-name { margin:0; color:var(--auth-gold); font-family:var(--font-ui,system-ui,sans-serif); font-size:clamp(14px,4.2vw,18px); font-weight:700; letter-spacing:.38em; text-indent:.38em; }
.auth-brand-ornament { position:relative; display:flex; align-items:center; justify-content:center; width:min(100%,250px); height:27px; margin:13px auto 0; color:var(--auth-gold); }.auth-brand-ornament::before,.auth-brand-ornament::after { content:""; position:absolute; top:50%; width:calc(50% - 23px); height:1px; background:rgba(190,134,41,.74); }.auth-brand-ornament::before{left:0}.auth-brand-ornament::after{right:0}.auth-brand-ornament i{font-style:normal;font-size:23px;line-height:1}
.auth-screen-label { display:block; margin-top:15px; color:var(--auth-gold); font-size:13px; font-weight:700; letter-spacing:.24em; }
.auth-screen-copy { margin:22px 0 24px; }.auth-screen-copy h2 { margin:0; color:var(--auth-ink); font-family:var(--font-display,Georgia,serif); font-size:clamp(43px,12vw,61px); font-weight:600; line-height:.99; letter-spacing:-.045em; }.auth-screen-copy p { max-width:365px; margin:20px auto 0; color:var(--auth-copy); font-family:var(--font-ui,system-ui,sans-serif); font-size:clamp(18px,5vw,23px); line-height:1.35; }
.auth-signup-screen .auth-screen-copy,.auth-login-screen .auth-screen-copy { margin-bottom:22px; }.auth-signup-screen .auth-screen-copy h2{font-size:clamp(39px,10.4vw,54px);white-space:nowrap}.auth-login-screen .auth-screen-copy h2{font-size:clamp(43px,11.5vw,56px)}.auth-otp-screen .auth-screen-copy{margin-bottom:26px}.auth-otp-screen .auth-screen-copy h2{font-size:clamp(42px,11.2vw,57px)}.auth-otp-email{display:block;margin-top:7px;color:var(--auth-ink);font-size:clamp(20px,5.2vw,25px);overflow-wrap:anywhere}
.auth-actions { display:grid; gap:16px; margin-top:auto; }.counter-btn,.action-btn,.auth-text-action,.auth-inline-action { appearance:none; -webkit-appearance:none; box-sizing:border-box; border:0; background:transparent; color:var(--auth-ink); font:inherit; cursor:pointer; }.counter-btn,.action-btn { min-height:68px; width:100%; display:flex; align-items:center; justify-content:center; padding:14px 18px; border-radius:22px; font-family:var(--font-ui,system-ui,sans-serif); font-size:clamp(19px,5.2vw,25px); font-weight:700; line-height:1.1; text-align:center; white-space:nowrap; }.counter-btn { border:1px solid var(--auth-gold); background:linear-gradient(135deg,#08705a,#003e31 89%); color:#fffdf5; box-shadow:0 13px 22px rgba(7,66,48,.19); }.action-btn{border:2px solid rgba(183,126,32,.86);background:rgba(255,253,246,.62);color:var(--auth-ink)}.counter-btn:disabled{opacity:.74;cursor:wait}.auth-foundation-note{margin:0;color:#59605e;font-size:18px;line-height:1.3}.auth-text-action,.auth-inline-action{color:var(--auth-ink);text-decoration:underline;text-decoration-color:rgba(190,134,41,.75);text-underline-offset:7px;font-size:18px;line-height:1.35}.auth-inline-action{display:inline;padding:0;font-size:inherit;font-weight:700}.auth-signup-note{margin-top:3px}.auth-trust{margin:28px auto 0;color:#59605e;font-size:16px;line-height:1.35}.auth-trust p{margin:8px 0 0}.auth-trust-ornament{color:var(--auth-gold);font-size:25px}
.auth-foundation-back { position:absolute; z-index:2; top:max(20px,env(safe-area-inset-top)); left:19px; display:grid; width:41px; height:41px; place-items:center; border:0; color:var(--auth-ink); background:transparent; font-size:36px; line-height:1; }
.auth-email-screen,.auth-profile-completion{gap:0}.auth-input-label{display:block;margin:0 0 15px;color:var(--auth-ink);text-align:left;font-family:var(--font-ui,system-ui,sans-serif)}.auth-field-label{display:block;margin:0 0 7px 9px;font-size:17px;font-weight:600;line-height:1.2}.auth-input-wrap{position:relative;display:block}.auth-input-wrap .search-input{box-sizing:border-box;width:100%;height:61px;margin:0;padding:0 20px;border:1.5px solid rgba(184,125,29,.95);border-radius:19px;outline:0;background:rgba(255,253,247,.75);color:var(--auth-ink);font:500 20px/1.15 var(--font-ui,system-ui,sans-serif);text-align:left;text-indent:0;box-shadow:0 6px 13px rgba(116,76,20,.06)}.auth-input-wrap .search-input::placeholder{color:#8b908e;opacity:.78;text-align:left}.auth-input-wrap .search-input:focus{border-color:#00614c;box-shadow:0 0 0 3px rgba(0,97,76,.12)}.auth-date-wrap .search-input{padding-right:52px;min-width:0}.auth-date-hint{position:absolute;pointer-events:none;top:50%;left:20px;transform:translateY(-50%);color:#858a87;font-size:18px}.auth-date-wrap.has-value .auth-date-hint{display:none}.auth-date-wrap input[type="date"]::-webkit-date-and-time-value{text-align:left;min-height:1.2em}.auth-date-wrap input[type="date"]::-webkit-calendar-picker-indicator{opacity:.95;cursor:pointer}
.auth-otp-label{position:relative;display:block;margin:0 0 12px;padding:0}.auth-otp-label .auth-field-label{text-align:center;margin-bottom:14px}.auth-otp-cells{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:clamp(5px,1.75vw,10px)}.auth-otp-cell{display:grid;aspect-ratio:.78;min-height:56px;place-items:center;border:1.5px solid rgba(184,125,29,.95);border-radius:15px;background:rgba(255,253,247,.78);color:var(--auth-ink);font:600 clamp(25px,8vw,39px)/1 var(--font-display,Georgia,serif);box-shadow:0 5px 10px rgba(116,76,20,.05)}.auth-otp-input{position:absolute;z-index:1;inset:28px 0 0;width:100%;height:calc(100% - 28px);padding:0;border:0;outline:0;opacity:.01;color:transparent;caret-color:transparent;-webkit-text-security:none!important;background:transparent}.auth-otp-label:focus-within .auth-otp-cell{border-color:#00614c;box-shadow:0 0 0 2px rgba(0,97,76,.1)}.auth-otp-screen>.auth-foundation-note{margin:0 0 18px;text-align:center}
.auth-foundation-status{min-height:1.25em;margin:14px 0 0;color:#8b3b30;font-size:15px;line-height:1.35;text-align:center}.auth-build-marker{position:fixed;z-index:26000;right:8px;bottom:8px;padding:4px 7px;border-radius:5px;color:#fff;background:rgba(0,0,0,.66);font:10px/1.1 monospace}
/* Auth inputs deliberately override the generic app inputs. */
.auth-foundation-overlay .auth-input-wrap .search-input { height:61px!important; min-height:61px!important; padding:0 20px!important; border:1.5px solid rgba(184,125,29,.95)!important; border-radius:19px!important; background:rgba(255,253,247,.75)!important; color:var(--auth-ink)!important; box-shadow:0 6px 13px rgba(116,76,20,.06)!important; }
.auth-foundation-overlay .auth-input-wrap .search-input:focus { border-color:#00614c!important; outline:0!important; box-shadow:0 0 0 3px rgba(0,97,76,.12)!important; }
@media(max-width:390px){.auth-foundation-dialog{padding-right:25px;padding-left:25px}.auth-brand-logo-frame{width:116px;height:116px;margin-bottom:13px}.auth-screen-copy{margin-top:18px;margin-bottom:20px}.auth-screen-copy h2{font-size:clamp(40px,11.2vw,47px)}.auth-signup-screen .auth-screen-copy h2{font-size:39px}.auth-login-screen .auth-screen-copy h2{font-size:42px}.auth-otp-screen .auth-screen-copy h2{font-size:41px}.auth-screen-copy p{margin-top:15px;font-size:18px}.counter-btn,.action-btn{min-height:63px;border-radius:20px;font-size:20px}.auth-input-label{margin-bottom:12px}.auth-foundation-overlay .auth-input-wrap .search-input{height:57px!important;min-height:57px!important;font-size:18px;border-radius:18px}.auth-otp-cell{min-height:52px;border-radius:13px}.auth-trust{margin-top:21px}}
@media(max-height:740px){.auth-foundation-dialog{padding-top:max(18px,env(safe-area-inset-top))}.auth-brand-logo-frame{width:100px;height:100px;margin-bottom:9px}.auth-brand-ornament{margin-top:8px;height:22px}.auth-screen-copy{margin:14px 0 17px}.auth-screen-copy h2{font-size:40px}.auth-screen-copy p{margin-top:10px;font-size:17px}.auth-input-label{margin-bottom:10px}.auth-input-wrap .search-input{height:53px}.auth-otp-screen .auth-screen-copy{margin-bottom:17px}.auth-otp-cell{min-height:48px}}

/* A profile fetch failure is recoverable: keep the authenticated fallback compact. */
.auth-profile-retry-screen{justify-content:center;min-height:100svh;padding-top:max(28px,env(safe-area-inset-top));padding-bottom:max(28px,env(safe-area-inset-bottom))}.auth-profile-retry-screen::before{display:none}.auth-profile-retry-card{display:grid;gap:16px;width:100%;padding:25px 22px 21px;border:1px solid rgba(184,125,29,.4);border-radius:25px;background:rgba(255,253,247,.94);box-shadow:0 18px 42px rgba(29,62,49,.14);text-align:center}.auth-profile-retry-card .auth-screen-copy{margin:0}.auth-profile-retry-card .auth-screen-copy h2{font-size:clamp(1.75rem,8vw,2.35rem);line-height:1.08}.auth-profile-retry-card .auth-screen-copy p{margin:10px 0 0;font-size:1rem;line-height:1.45}.auth-profile-retry-actions{display:grid;gap:10px}.auth-profile-retry-card .counter-btn,.auth-profile-retry-card .action-btn{min-height:51px;border-radius:15px;font-size:1rem}.auth-profile-retry-card .auth-text-action{justify-self:center;padding:4px 10px;font-size:.88rem;text-underline-offset:5px}.auth-profile-retry-error{margin:0;color:#8b3b30;font-size:.85rem;line-height:1.4}@media(max-width:390px){.auth-profile-retry-card{padding:22px 18px 18px}.auth-profile-retry-card .auth-screen-copy h2{font-size:1.8rem}.auth-profile-retry-card .counter-btn,.auth-profile-retry-card .action-btn{min-height:49px;font-size:.95rem}}


/* Account settings — authenticated profile, synced with Smart Muslim account. */
.sm-account-view{padding-bottom:calc(92px + env(safe-area-inset-bottom))}.sm-account-page-head{max-width:680px;margin:12px auto 18px;text-align:left}.sm-account-page-head .results-title{margin:5px 0 7px!important;text-align:left!important}.sm-account-page-head p{margin:0;color:var(--text-secondary,#66706d);font-size:.95rem;line-height:1.45}.sm-account-stack{display:grid;gap:14px;max-width:680px;margin:0 auto}.sm-account-card{display:grid;gap:13px;padding:18px;border:1px solid var(--border-color,rgba(16,77,61,.14));border-radius:22px;background:var(--card-bg,#fffdf8);box-shadow:0 8px 24px rgba(14,61,48,.055)}.sm-account-card h3{margin:0;color:var(--primary-color,#0a503f);font-size:1.12rem}.sm-account-card p{margin:0;color:var(--text-secondary,#66706d);font-size:.9rem;line-height:1.45}.sm-account-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.sm-account-sync-badge,.sm-account-verified{display:inline-flex;align-items:center;justify-content:center;min-height:27px;padding:4px 9px;border-radius:999px;background:rgba(12,111,83,.1);color:#087052;font-size:.72rem;font-weight:700;white-space:nowrap}.sm-account-verified.is-pending{background:rgba(184,125,29,.1);color:#94640e}.sm-account-field{display:grid;gap:6px}.sm-account-field>span,.sm-account-gender legend{color:var(--primary-color,#0a503f);font-size:.78rem;font-weight:700}.sm-account-field .search-input,.sm-account-inline-panel>.search-input{box-sizing:border-box;width:100%;min-height:50px;margin:0;padding:11px 13px;border:1px solid var(--border-color,rgba(16,77,61,.16));border-radius:14px;background:var(--input-bg,#fff);color:var(--text-primary,#21312c);font-size:1rem;box-shadow:none}.sm-account-field .search-input:focus,.sm-account-inline-panel>.search-input:focus{outline:0;border-color:#0b755a;box-shadow:0 0 0 3px rgba(11,117,90,.1)}.sm-account-gender{min-width:0;margin:0;padding:0;border:0}.sm-account-gender legend{margin-bottom:7px}.sm-account-choice-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.sm-account-choice{position:relative;display:flex;align-items:center;justify-content:center;min-height:46px;padding:8px 12px;border:1px solid var(--border-color,rgba(16,77,61,.16));border-radius:14px;background:var(--input-bg,#fff);color:var(--text-primary,#21312c);font-size:.92rem;font-weight:700;cursor:pointer}.sm-account-choice input{position:absolute;opacity:0;pointer-events:none}.sm-account-choice.is-selected{border-color:#0b755a;background:rgba(11,117,90,.08);color:#075943}.sm-account-primary,.sm-account-secondary,.sm-account-danger,.sm-account-text{appearance:none;-webkit-appearance:none;width:100%;min-height:48px;padding:11px 14px;border-radius:14px;font:700 .92rem/1.15 var(--font-ui,system-ui,sans-serif);cursor:pointer}.sm-account-primary{border:1px solid #0b7258;background:#0b6650;color:#fff}.sm-account-secondary{border:1px solid rgba(11,102,80,.32);background:rgba(11,102,80,.055);color:#0a5d49}.sm-account-text{min-height:40px;border:0;background:transparent;color:var(--primary-color,#0a503f);text-decoration:underline;text-underline-offset:4px}.sm-account-danger{border:1px solid rgba(153,49,39,.3);background:rgba(153,49,39,.055);color:#8a3029}.sm-account-danger:disabled,.sm-account-primary:disabled{opacity:.55;cursor:not-allowed}.sm-account-email-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 13px;border:1px solid var(--border-color,rgba(16,77,61,.12));border-radius:15px;background:rgba(255,255,255,.42)}.sm-account-email-row>div{display:grid;gap:3px;min-width:0}.sm-account-email-row small{color:var(--text-secondary,#66706d);font-size:.72rem}.sm-account-email-row strong{overflow-wrap:anywhere;color:var(--text-primary,#21312c);font-size:.9rem}.sm-account-inline-panel{display:grid;gap:11px;padding:14px;border:1px solid var(--border-color,rgba(16,77,61,.12));border-radius:16px;background:rgba(11,102,80,.025)}.sm-account-inline-panel[hidden]{display:none}.sm-account-inline-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}.sm-account-inline-actions .sm-account-text{width:auto;padding-inline:12px}.sm-account-status{min-height:1.1em!important;color:#66706d!important;font-size:.78rem!important}.sm-account-danger-card{border-color:rgba(153,49,39,.18)}.sm-account-danger-card .card-category{color:#8a3029}.sm-account-delete-panel{background:rgba(153,49,39,.03);border-color:rgba(153,49,39,.16)}@media(max-width:430px){.sm-account-card{padding:16px;border-radius:19px}.sm-account-page-head{margin-top:8px}.sm-account-inline-actions{grid-template-columns:1fr}.sm-account-inline-actions .sm-account-text{width:100%}.sm-account-email-row{align-items:flex-start;flex-direction:column}.sm-account-verified{align-self:flex-start}}

.sm-account-dob-lock{display:block;color:var(--text-secondary,#66706d);font-size:.72rem;line-height:1.4;margin-top:2px}


/* Password protection/recovery screens are compact account dialogs, not onboarding pages. */
.auth-password-screen{width:min(calc(100% - 32px),430px);min-height:0;margin:clamp(28px,7vh,68px) auto;padding:28px 30px 26px;border:1px solid rgba(184,125,29,.34);border-radius:28px;background:rgba(255,253,247,.96);box-shadow:0 24px 64px rgba(22,62,48,.18);}
.auth-password-screen::before{display:none}.auth-password-screen .auth-brand-logo-frame{width:82px;height:82px;margin:0 auto 8px}.auth-password-screen .auth-brand-name{font-size:13px}.auth-password-screen .auth-brand-ornament{width:190px;height:20px;margin-top:8px}.auth-password-screen .auth-brand-ornament i{font-size:18px}.auth-password-screen .auth-screen-label{margin-top:8px;font-size:11px}.auth-password-screen .auth-screen-copy{margin:16px 0 20px}.auth-password-screen .auth-screen-copy h2{font-size:36px;line-height:1.02;letter-spacing:-.035em}.auth-password-screen .auth-screen-copy p{max-width:330px;margin-top:10px;font-size:16px;line-height:1.4}.auth-password-screen .auth-input-label{margin-bottom:11px}.auth-password-screen .auth-field-label{font-size:15px}.auth-password-screen .auth-input-wrap .search-input{height:52px!important;min-height:52px!important;border-radius:15px!important;font-size:17px!important}.auth-password-screen .counter-btn{width:min(100%,230px);min-height:50px;margin:4px auto 0;padding:11px 18px;border-radius:15px;font-size:16px;box-shadow:0 9px 17px rgba(7,66,48,.16)}.auth-password-screen .auth-foundation-status{margin-top:10px;font-size:14px}
@media(max-width:430px){.auth-password-screen{width:min(calc(100% - 24px),380px);margin:12px auto;padding:22px 18px 20px;border-radius:22px}.auth-password-screen .auth-brand-logo-frame{width:72px;height:72px;margin-bottom:6px}.auth-password-screen .auth-screen-copy{margin:12px 0 16px}.auth-password-screen .auth-screen-copy h2{font-size:30px}.auth-password-screen .auth-screen-copy p{font-size:15px}.auth-password-screen .auth-input-wrap .search-input{height:50px!important;min-height:50px!important;font-size:16px!important}.auth-password-screen .counter-btn{width:100%;min-height:49px;font-size:16px}}
@media(max-height:700px){.auth-password-screen{margin:10px auto;padding-top:18px;padding-bottom:18px}.auth-password-screen .auth-brand-logo-frame{width:62px;height:62px}.auth-password-screen .auth-brand-ornament{display:none}.auth-password-screen .auth-screen-copy{margin:9px 0 12px}.auth-password-screen .auth-screen-copy h2{font-size:28px}.auth-password-screen .auth-screen-copy p{font-size:14px}.auth-password-screen .auth-input-label{margin-bottom:8px}}