/* Athar 4.1 — focused new features, all original navigation and card geometry preserved. */
.hijri-date-line {font-family:var(--font-arabic,system-ui);font-size:14px;font-weight:650;letter-spacing:0;color:var(--accent);margin:0 0 10px;padding-inline-start:0;line-height:1.55;}
#view-today .hijri-date-line + .date-kicker {margin-top:0!important;}
.hijri-occasions {margin:14px 0 19px;display:grid;gap:7px;}
.occasion-row {border:1px solid var(--line);background:var(--surface2);color:var(--text);border-radius:13px;padding:11px 13px;display:flex;align-items:baseline;gap:10px;line-height:1.5;font-size:13px;}
.occasion-row small {color:var(--muted);font-weight:600;white-space:normal;}
.occasion-dot {width:7px;height:7px;flex:none;border-radius:50%;background:var(--accent);}
.occasion-death .occasion-dot {background:var(--muted)}
.prayer-legend {display:flex;justify-content:space-between;gap:8px;margin:13px 5px 18px;flex-wrap:wrap;color:var(--muted);font-size:11px;font-weight:550;line-height:1.45;}
.prayer-legend span {display:inline-flex;align-items:center;gap:5px;white-space:nowrap;}
.prayer-legend svg {width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;}
.status-switch .state-btn.early svg {stroke-width:1.7;}
.datecal-day {position:relative;}
.datecal-day .datecal-hijri {display:block;font-size:10px;line-height:1.2;margin-top:1px;opacity:.67;font-weight:500;}
.datecal-day.has-occasion::after {content:"";position:absolute;top:2px;right:3px;width:4px;height:4px;border-radius:50%;background:var(--accent);}
.datecal-day .datecal-dot {bottom:2px;}
.datecal-hijri-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 1px 14px;color:var(--text);font-size:13px;font-weight:650;}
.hijri-adjust-btn{font:inherit;white-space:nowrap;font-size:11px;padding:8px 9px;border:1px solid var(--line);background:var(--surface2);border-radius:10px;color:var(--muted);cursor:pointer;}
.hijri-offset-options{display:flex;gap:8px;justify-content:center;margin:15px 0 30px;}
.hijri-offset-options .button{min-width:0;flex:1;padding:12px 5px;}
/* Preserve both English UI and native Arabic alignment for the user's own dua titles. */
.dua-card-copy .arabic-dua, .reader-inner .arabic-dua {text-align:right!important;direction:rtl!important;unicode-bidi:plaintext;}
.dua-card-copy h3[dir=auto]:not(.arabic-dua),.reader-inner h1[dir=auto]:not(.arabic-dua){text-align:left!important;direction:ltr!important;}
.dua-card-copy p.arabic-dua{direction:rtl!important;text-align:right!important;}
.reader-inner .reader-copy:not(.arabic-dua){direction:ltr!important;text-align:left!important;}
.birth-qada-link{margin-top:10px!important;margin-bottom:8px;}
#birth-qada-form .form-field{margin-bottom:14px;}
#birth-qada-form .qada-duration-result{display:grid;gap:7px;padding:14px 16px;margin:16px 0;background:var(--surface2);border:1px solid var(--line);border-radius:14px;}
#birth-qada-form .qada-duration-result strong{font-size:13px;}
#birth-qada-form .qada-duration-result span{font-size:17px;font-weight:750;color:var(--text);}
#birth-qada-form .qada-duration-result small{font-size:12px;color:var(--muted);line-height:1.5;}
/* First-run experience. The app remains private and all storage is local. */
.onboarding-screen[hidden] {display:none!important;}
.onboarding-screen {position:fixed;inset:0;z-index:9999;overflow-y:auto;overscroll-behavior:contain;display:flex;align-items:flex-start;justify-content:center;padding:calc(env(safe-area-inset-top,0px) + 24px) 18px calc(env(safe-area-inset-bottom,0px) + 32px);box-sizing:border-box;background:#12161d;color:#f3f5f8;font-family:var(--font-english,system-ui);}
.onboarding-screen[dir=rtl]{font-family:var(--font-arabic,system-ui);}
body.onboarding-active{overflow:hidden;}
.welcome-card {width:min(100%,450px);margin:auto;background:#242a33;border:1px solid #3e4652;border-radius:28px;padding:clamp(20px,6vw,32px);box-shadow:0 20px 65px #0003;box-sizing:border-box;}
.welcome-top{display:flex;align-items:center;justify-content:space-between;}
.welcome-mark{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#111820;color:#e5c38f;font-weight:800;font-size:17px;}
.welcome-progress{color:#aeb5c3;font-weight:650;font-size:12px;}
.welcome-kicker{font-size:11px;letter-spacing:.22em;color:#dab881;margin-top:24px;font-weight:700;}
.welcome-card h1{font-weight:760;line-height:1.12;font-size:clamp(28px,7vw,37px);margin:9px 0 11px;color:#fff;}
.welcome-description{font-size:14px;line-height:1.6;color:#b3bbc8;margin:0 0 20px;}
.welcome-form{display:grid;gap:16px;}
.welcome-form>label,.welcome-conditional>label{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:700;color:#d8dfeb;}
.welcome-form input:not([type=checkbox]):not([type=file]),.welcome-form select{font:inherit;color:#f5f7fa;font-weight:500;background:#333b45;border:1px solid #525d6a;border-radius:13px;min-height:45px;padding:9px 12px;box-sizing:border-box;width:100%;color-scheme:dark;}
.welcome-form input:focus-visible,.welcome-form select:focus-visible{outline:2px solid #e5c38f;outline-offset:2px;}
.welcome-photo-row{display:flex;align-items:center;gap:15px;}
.welcome-photo-row .avatar-wrap{width:57px;height:57px;flex:none;overflow:hidden;border-radius:50%;background:#3e4652;display:grid;place-items:center;}
.welcome-photo-row .avatar-img {width:100%;height:100%;object-fit:cover;}
.welcome-photo-pick{display:block;cursor:pointer;color:#e5c38f;font-size:13px;font-weight:650;}
.welcome-choice-label{font-size:12px;font-weight:700;color:#d8dfeb;}
.welcome-theme-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:-7px;}
.welcome-theme-choice button{display:flex;align-items:center;gap:10px;text-align:start;color:#d8dfeb;border:1px solid #515a65;border-radius:15px;padding:10px;font:inherit;background:#333b45;cursor:pointer;}
.welcome-theme-choice button.chosen{border-color:#e5c38f;box-shadow:0 0 0 1px #e5c38f;}
.welcome-theme-preview{width:29px;height:29px;border-radius:9px;display:block;flex:none;}
.light-preview{background:#f4f5f7;border:1px solid #e5e5e5;}.dark-preview{background:#0d1118;border:1px solid #56606b;}
.welcome-checkbox{flex-direction:row!important;align-items:flex-start;gap:12px!important;line-height:1.5!important;font-weight:600!important;}
.welcome-checkbox input{width:20px;height:20px;flex:none;accent-color:#e2be88;}
.welcome-conditional[hidden]{display:none!important;}
.welcome-conditional{display:grid;gap:15px;background:#303842;border:1px solid #45505d;border-radius:16px;padding:14px;}
.welcome-conditional small{font-size:12px;line-height:1.5;color:#b5bdc9;}
.welcome-qada-preview{font-size:12px;font-weight:650;color:#eed1a4;line-height:1.5;}
.welcome-footer{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;}
.welcome-footer>.button{flex:1;min-width:110px;background:#e5c38f;color:#1b1f24;border:0;padding:12px 8px;}
.welcome-footer>.button.secondary{background:#444c57;color:#e3e7ef;}
.welcome-footer .welcome-skip{flex-basis:100%;border:0;background:transparent;color:#bbc5d1;padding:12px;cursor:pointer;font:inherit;font-size:13px;}
@media(max-width:365px){.prayer-legend{gap:7px;font-size:10px;}.prayer-legend svg{width:13px;height:13px}.hijri-date-line{font-size:12px;}.welcome-card{padding:18px;}}
/* Correct the flex child's actual width so right-aligned Arabic text moves to the right edge. */
.dua-card-copy .arabic-dua {display:block!important;align-self:stretch!important;width:100%!important;min-width:0!important;box-sizing:border-box;text-align:right!important;direction:rtl!important;}