/* NakitRota — Visual Polish Phase 3
   Profile, forms, modal/sheet finishing pass + calendar hover preview styling.
   Visual-only: no finance calculations or navigation behavior changed. */

/* Profile / settings — cleaner grouping and calmer hierarchy. */
#profile.screen.on{min-width:0}
#profile>.head{margin-top:20px;margin-bottom:11px}
#profile>.head h2{letter-spacing:-.03em}
#profile .account-card{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff 0%,#fcfcff 100%);border-color:rgba(31,36,58,.08);box-shadow:0 9px 28px rgba(31,36,58,.05)}
#profile .account-card:after{content:"";position:absolute;right:-54px;top:-68px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(109,93,252,.09),transparent 68%);pointer-events:none}
#profile .profile-section{display:flex;align-items:center;gap:8px;margin:19px 3px 8px;color:#737b8d}
#profile .profile-section:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,rgba(31,36,58,.09),transparent)}
#profile .profile-action{background:linear-gradient(180deg,#fff 0%,#fdfdff 100%);border-color:rgba(31,36,58,.08);box-shadow:0 7px 22px rgba(31,36,58,.04)}
#profile .profile-action:hover{border-color:rgba(109,93,252,.18);box-shadow:0 10px 27px rgba(31,36,58,.065)}
#profile .profile-action .pa-icon{box-shadow:inset 0 0 0 1px rgba(109,93,252,.055)}
#profile .profile-action .pa-left>span>b{letter-spacing:-.012em}
#profile .profile-action .pa-left>span>small{color:#7a8293}
#profile .pref-list{gap:10px}
#profile .pref-row{border-color:rgba(31,36,58,.08);box-shadow:0 5px 18px rgba(31,36,58,.028)}
#profile .pref-copy b{letter-spacing:-.01em}
#profile .view-note{border-color:rgba(31,36,58,.075);background:#f8f9fc}

/* Sheets / modals — more native, less form-heavy. */
.shade{background:rgba(9,13,22,.64);backdrop-filter:blur(11px) saturate(112%);-webkit-backdrop-filter:blur(11px) saturate(112%)}
.sheet{border:1px solid rgba(31,36,58,.075);background:linear-gradient(180deg,#fff 0%,#fcfcff 100%);box-shadow:0 -28px 78px rgba(18,23,38,.20)}
.sheet:before{width:42px;height:4px;border-radius:999px;background:#d9dde7;opacity:.9}
.sh{position:sticky;top:-18px;z-index:4;margin:-2px -2px 5px;padding:2px 2px 10px;background:linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.93) 74%,rgba(255,255,255,0) 100%);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.sh h3{letter-spacing:-.032em}
.close{border:1px solid rgba(31,36,58,.06);background:#f3f4f7;box-shadow:0 4px 12px rgba(31,36,58,.045)}
.form{gap:12px}
.field{color:#60697a;letter-spacing:.003em}
.field input,.field select,.pref-number{background:#fbfcfe;border-color:#dfe3eb;box-shadow:inset 0 1px 0 rgba(255,255,255,.72)}
.field input:hover,.field select:hover,.pref-number:hover{border-color:#d2d7e2}
.field input:focus,.field select:focus,.pref-number:focus{background:#fff}
.pw-help,.account-note,.view-note{line-height:1.55}
.pw-help{border:1px solid rgba(31,36,58,.07);background:#f7f8fc;border-radius:13px;padding:10px 11px;color:#6c7486}
.save,.sec,.danger{min-height:48px}
.save{box-shadow:0 9px 22px rgba(109,93,252,.17)}
.sec{background:#f1f3f7;color:#4f586b}
.danger{border:1px solid rgba(228,81,81,.09)}

/* Privacy / PWA / settings detail cards follow the same surface language. */
.privacy-v80-hero,.privacy-v80-card,.privacy-v80-rights,.nr-pwa-card,.nr-cycle-card{border-color:rgba(31,36,58,.08);box-shadow:0 8px 24px rgba(31,36,58,.04)}
.privacy-v80-card,.privacy-v80-rights,.nr-pwa-card,.nr-cycle-card{background:linear-gradient(180deg,#fff 0%,#fdfdff 100%)}

/* Calendar pointer preview. JS positions the portal so it never gets clipped by day cells. */
.nr-cal-hover-preview{position:fixed;z-index:90;min-width:148px;max-width:min(240px,calc(100vw - 24px));padding:10px 11px;border:1px solid rgba(31,36,58,.10);border-radius:13px;background:rgba(255,255,255,.96);box-shadow:0 16px 42px rgba(25,30,48,.16);backdrop-filter:blur(14px) saturate(118%);-webkit-backdrop-filter:blur(14px) saturate(118%);opacity:0;transform:translateY(5px) scale(.985);pointer-events:none;transition:opacity .14s ease,transform .14s ease}
.nr-cal-hover-preview.on{opacity:1;transform:translateY(0) scale(1)}
.nr-cal-hover-title{font-size:9px;font-weight:950;letter-spacing:.055em;text-transform:uppercase;color:#727b8e;margin-bottom:7px}
.nr-cal-hover-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;line-height:1.35;color:#687184}
.nr-cal-hover-row+.nr-cal-hover-row{margin-top:5px}
.nr-cal-hover-row b{font-size:10.5px;color:#202638;font-variant-numeric:tabular-nums;white-space:nowrap}
.nr-cal-hover-row.pending b{color:#9a6812}.nr-cal-hover-row.paid b{color:#d14a58}.nr-cal-hover-row.other b{color:#4d5568}
.nr-cal-hover-hint{margin-top:8px;padding-top:7px;border-top:1px solid rgba(31,36,58,.075);font-size:8.5px;color:#8a91a0;font-weight:750}

html[data-theme="dark"] #profile .account-card,html[data-theme="dark"] #profile .profile-action,html[data-theme="dark"] .privacy-v80-card,html[data-theme="dark"] .privacy-v80-rights,html[data-theme="dark"] .nr-pwa-card,html[data-theme="dark"] .nr-cycle-card{background:linear-gradient(180deg,#171d29 0%,#151b26 100%);border-color:rgba(164,177,202,.12)}
html[data-theme="dark"] #profile .profile-section{color:#8e98aa}html[data-theme="dark"] #profile .profile-section:after{background:linear-gradient(90deg,rgba(164,177,202,.12),transparent)}
html[data-theme="dark"] #profile .profile-action:hover{border-color:rgba(141,129,255,.24);box-shadow:0 10px 28px rgba(0,0,0,.22)}
html[data-theme="dark"] #profile .profile-action .pa-left>span>small{color:#909aac}
html[data-theme="dark"] #profile .view-note,html[data-theme="dark"] .pw-help{background:#121824;border-color:rgba(164,177,202,.10);color:#9ea8b9}
html[data-theme="dark"] .sheet{background:linear-gradient(180deg,#171d29 0%,#141a25 100%);border-color:rgba(164,177,202,.12);box-shadow:0 -30px 86px rgba(0,0,0,.54)}
html[data-theme="dark"] .sheet:before{background:#465064}
html[data-theme="dark"] .sh{background:linear-gradient(180deg,rgba(23,29,41,.98) 0%,rgba(23,29,41,.93) 74%,rgba(23,29,41,0) 100%)}
html[data-theme="dark"] .close{background:#222a38;border-color:#303a4b}
html[data-theme="dark"] .field input,html[data-theme="dark"] .field select,html[data-theme="dark"] .pref-number{background:#111722;border-color:#30394a;box-shadow:none}
html[data-theme="dark"] .field input:focus,html[data-theme="dark"] .field select:focus,html[data-theme="dark"] .pref-number:focus{background:#151c28}
html[data-theme="dark"] .sec{background:#222a38;color:#c2cad7}
html[data-theme="dark"] .nr-cal-hover-preview{background:rgba(20,26,38,.96);border-color:rgba(164,177,202,.15);box-shadow:0 18px 48px rgba(0,0,0,.42)}
html[data-theme="dark"] .nr-cal-hover-title{color:#9ba5b6}html[data-theme="dark"] .nr-cal-hover-row{color:#98a2b4}html[data-theme="dark"] .nr-cal-hover-row b{color:#e8edf6}html[data-theme="dark"] .nr-cal-hover-row.pending b{color:#f2bd58}html[data-theme="dark"] .nr-cal-hover-row.paid b{color:#ff8f98}html[data-theme="dark"] .nr-cal-hover-row.other b{color:#d5dbea}html[data-theme="dark"] .nr-cal-hover-hint{border-color:rgba(164,177,202,.10);color:#818c9f}

@media(min-width:980px){
  #profile.screen.on{max-width:920px}
  #profile .account-card{padding:16px}
  #profile .profile-action{min-height:62px;padding:12px 14px}
  .sheet{overflow:auto}
}
@media(max-width:979px){
  #profile .profile-section{margin-top:17px}
  #profile .profile-action{min-height:58px}
  .sh{top:-18px}
}
@media(hover:none),(pointer:coarse){.nr-cal-hover-preview{display:none!important}}
@media(prefers-reduced-motion:reduce){.nr-cal-hover-preview{transition:none!important}#profile .profile-action{transition:none!important}}