/* account.css — the "account" screen group: login extras, onboarding, reminders, me, plans, outbox, admin.
   Prefixes: .login-… .onb-… .rem-… .me-… .plans-… .outbox-… .admin-…  Tokens only (tokens.css). Logical properties (RTL). */

/* ================= shared screen head ================= */
.rem__head,.plans__head,.outbox__head,.admin__head{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--sp-5)}
.rem__head{flex-direction:row;align-items:center;justify-content:space-between;gap:var(--sp-3)}
.rem__head h1{min-width:0;font-size:clamp(22px,7vw,var(--fs-2xl));overflow-wrap:break-word}
.rem__head .btn{flex:none;white-space:nowrap}

/* ================= login ================= */
.login-word{display:flex;align-items:center;gap:var(--sp-3)}
.login-word .login__mark{width:52px;height:52px;border-radius:15px;font-size:1.6rem}
.login-links{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.login-links > .btn{flex:1 1 auto}
.login-foot{display:flex;flex-direction:column;gap:6px}
.login__free{margin-top:2px}

/* 6 boxes over one real input (the phone can paste the code) */
.login-otp{position:relative;direction:ltr}
.login-otp__input{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;padding:0;border:0;background:transparent;
  color:transparent;caret-color:transparent;opacity:0;font-size:16px;letter-spacing:0;cursor:text}
.login-otp__boxes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.login-otp__box{display:grid;place-items:center;height:56px;border-radius:var(--r-sm);background:var(--s2);border:1.5px solid var(--line-strong);
  font:700 var(--fs-xl)/1 var(--font);font-variant-numeric:tabular-nums;color:var(--text);transition:border-color var(--t) var(--ease),box-shadow var(--t)}
.login-otp__box--filled{border-color:var(--text-3)}
.login-otp__box--active{border-color:var(--y);box-shadow:0 0 0 3px var(--y-ring)}
.field--error .login-otp__box{border-color:var(--bad)}

/* ================= onboarding ================= */
.onb{display:flex;flex-direction:column;gap:var(--sp-5);max-width:480px;margin:0 auto;padding-top:var(--sp-4)}
.onb__title{font-size:var(--fs-2xl)}
.onb__title:focus,.onb__title:focus-visible{outline:none} /* focused only so screen readers hear the new step */
.onb__text{color:var(--text-2);font-size:var(--fs-lg);line-height:1.45}
.onb__ask{padding:var(--sp-3) var(--sp-4);border-radius:var(--r);background:var(--y-soft);color:var(--text);font-weight:600;
  border-inline-start:3px solid var(--y)}
.onb-steps{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3)}
.onb-steps__dots{display:flex;gap:6px}
.onb-steps__dot{width:28px;height:6px;border-radius:var(--r-pill);background:var(--s3)}
.onb-steps__dot--on{background:var(--y)}
.onb-preview{display:flex;flex-direction:column;gap:6px}
.onb-preview__bubble{align-self:flex-start;max-width:92%;padding:10px 14px;border-radius:var(--r) var(--r) var(--r) var(--r-xs);
  background:var(--s2);border:1px solid var(--line);color:var(--text);font-size:var(--fs-sm);line-height:1.45;overflow-wrap:anywhere}
.onb-sample{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-2);margin-top:var(--sp-2);padding:var(--sp-4);
  border:1px dashed var(--line-strong);border-radius:var(--r)}
.onb-sample__title{font-size:var(--fs)}
.onb-micicon{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--y);color:var(--ink);
  box-shadow:0 0 0 6px var(--bg),0 0 0 9px var(--y-ring)}
.onb-mic{display:flex;flex-direction:column;gap:var(--sp-3)}
.onb-mic__live{display:flex;flex-direction:column;gap:var(--sp-2);padding:var(--sp-4);border-radius:var(--r);background:var(--s1);border:1px solid var(--y-ring);font-weight:600}
.onb-mic__meter{height:12px;border-radius:var(--r-pill);background:var(--s3);overflow:hidden}
.onb-mic__bar{display:block;height:100%;width:100%;background:var(--y);transform-origin:left center;transform:scaleX(.04);transition:transform 80ms linear}
.onb-mic__msg{font-weight:600}
.onb-help{display:flex;flex-direction:column;gap:6px;padding:var(--sp-4);border-radius:var(--r);background:var(--s1);border:1px solid var(--ember-line);color:var(--text-2);font-size:var(--fs-sm)}
.onb-help h3{color:var(--text)}
.onb .sheet__actions{margin-top:var(--sp-2)}
.onb-back{flex:0 1 auto !important}
/* step 4: what is open now (old debts by voice) */
.onb-open{display:flex;flex-direction:column;gap:var(--sp-2);padding:var(--sp-4);border-radius:var(--r);background:var(--s1);border:1px solid var(--line)}
.onb-open__title{font-size:var(--fs-lg)}
.onb-open__ex{color:var(--text-2);font-size:var(--fs-sm);font-style:italic}
.onb-open__now{display:flex;align-items:center;gap:6px;color:var(--ok);font-weight:600;font-size:var(--fs-sm)}
.onb-open__now:empty{display:none}
.onb-note{display:flex;align-items:flex-start;gap:8px;padding:var(--sp-3) var(--sp-4);border-radius:var(--r);background:var(--volt-soft);
  border-inline-start:3px solid var(--volt);font-size:var(--fs-sm);line-height:1.45}
.onb-note .icon{color:var(--volt);margin-top:2px}

/* ================= reminders ================= */
.rem-day + .rem-day{margin-top:var(--sp-4)}
.rem-day__title{margin-bottom:var(--sp-2);color:var(--text-2);font-size:var(--fs-sm);font-weight:600}
.rem-day__title::first-letter{text-transform:uppercase} /* "завтра" → "Завтра" (Hebrew has no case) */
.rem-card__late{font-weight:600}
.rem-quick{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.rem-card__actions{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-2)}
.rem-card--done .card__title{color:var(--text-2);text-decoration:line-through;text-decoration-color:var(--text-3)}
.rem-form__danger{display:flex;justify-content:flex-end;padding-top:var(--sp-2);border-top:1px solid var(--line)}
.rem__none{padding:var(--sp-2) 0}

/* ================= plans ================= */
.plans__free{display:flex;align-items:center;gap:6px;margin:var(--sp-4) 0;color:var(--y);font-weight:700;font-size:var(--fs-lg)}
.plans__list{display:flex;flex-direction:column;gap:var(--sp-5);margin-top:var(--sp-5)}
.plans__err,.admin__err{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--r);
  background:var(--bad-soft);color:var(--text);border:1px solid var(--bad)}
.plans-card{position:relative;display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-5);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--s1),var(--bg));border:1px solid var(--line)}
.plans-card--mine{border-color:transparent;isolation:isolate}
.plans-card--mine::before{content:"";position:absolute;inset:-1px;padding:1.5px;border-radius:inherit;background:var(--glow);z-index:-1;pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.plans-card__tag{position:absolute;top:-13px;inset-inline-start:var(--sp-5);padding:3px 12px;border-radius:var(--r-pill);background:var(--y);color:var(--ink);
  font:700 var(--fs-xs)/1.4 var(--font);box-shadow:0 0 0 4px var(--bg)}
.plans-card__name{font-size:var(--fs-xl)}
.plans-card__who{color:var(--text-3);font-size:var(--fs-sm)}
.plans-card__plate{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap}
.plans-card__from{font-weight:700;font-size:var(--fs-lg);color:var(--text)}
.plans-card__per{color:var(--text-3);font-size:var(--fs-sm)}
.plans-card__feats{display:flex;flex-direction:column;gap:10px;font-size:var(--fs-sm)}
.plans-card__feat{display:flex;align-items:baseline;gap:10px}
.plans-card__dot{flex:none;width:7px;height:7px;border-radius:2px;background:var(--y);transform:translateY(-2px)}
.plans__fine{margin-top:var(--sp-5);color:var(--text-2);font-size:var(--fs-sm)}
.plans__pay{display:flex;flex-direction:column;gap:6px;margin-top:var(--sp-5);padding:var(--sp-4);border-radius:var(--r);background:var(--s1);border:1px solid var(--line)}
.plans__pay-title{display:flex;align-items:center;gap:8px;font-size:var(--fs)}
.plans-status{display:flex;flex-direction:column;gap:6px;padding:var(--sp-4);border-radius:var(--r);background:var(--s2);border:1px solid var(--line)}
.plans-status__top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-2)}
.plans-status__name{font-weight:700;font-size:var(--fs-lg)}
.plans-status__line{font-size:var(--fs-sm);color:var(--text-2)}
.me-card .plans-status{background:transparent;border:0;padding:0}

/* ================= outbox ================= */
.outbox__hint{margin-bottom:var(--sp-3)}
.outbox-card__acts{display:flex;flex-direction:column;gap:2px;margin-bottom:6px;color:var(--text-2);font-size:var(--fs-sm)}
.outbox-card__meta{align-items:center;gap:4px 10px;margin-top:4px}
.outbox-card__act{display:block;overflow-wrap:anywhere}
.outbox-card__act::before{content:"· ";color:var(--text-3)}
.outbox-card__reason{display:block;margin-top:6px;font-size:var(--fs-sm);font-weight:600}
.outbox-card__actions{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-3)}
.outbox-edit{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-4);border-radius:var(--r);background:var(--s2);border:1px solid var(--line)}
.outbox-edit--off{background:transparent;border-style:dashed;border-color:var(--line-strong)} /* left out: dashed, text keeps contrast (A084) */
.outbox-edit__title{font-size:var(--fs);overflow-wrap:anywhere}
.outbox-edit__hint{margin-bottom:var(--sp-4)}
.outbox-edit__err{margin-top:var(--sp-3)}

/* ================= me ================= */
.me-head{display:flex;align-items:center;gap:var(--sp-4);margin-bottom:var(--sp-6)}
.me-head__avatar{display:grid;place-items:center;flex:none;width:64px;height:64px;border-radius:50%;background:var(--y);color:var(--ink);font:800 1.7rem/1 var(--font)}
.me-head__who{display:flex;flex-direction:column;gap:4px;min-width:0}
.me-head__name{font-size:var(--fs-xl);font-weight:700;line-height:1.2;overflow-wrap:anywhere}
.me-head__pills{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.me-card{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-4);border-radius:var(--r);background:var(--s1);border:1px solid var(--line)}
.me-row-btns{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
/* ready replies to Google reviews */
.review-replies{display:grid;gap:var(--sp-3)}
.review-replies__langs{display:flex;gap:var(--sp-2)}
.review-replies__item{display:grid;gap:var(--sp-2);padding:var(--sp-3);border-radius:var(--r);background:var(--s1);border:1px solid var(--line)}
.review-replies__head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}
.review-replies__text{margin:0;white-space:pre-line;line-height:1.5}
.me-card__big{font-size:var(--fs-lg);font-weight:700}
.me-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--sp-3)}
.me-row__grow{flex:1 1 220px}
.me-row > .btn{margin-bottom:24px}
.me-langs{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.me-usage{display:flex;flex-direction:column;gap:6px;padding:var(--sp-3) var(--sp-4);border-radius:var(--r-sm);background:var(--y-soft);border:1px solid var(--y-ring)}
.me-usage--out{background:var(--ember-soft);border-color:var(--ember-line)}
.me-usage__top{font-weight:600}
.me-usage__bar{width:100%;height:10px;border:0;border-radius:var(--r-pill);overflow:hidden;background:var(--s3);appearance:none;-webkit-appearance:none}
.me-usage__bar::-webkit-progress-bar{background:var(--s3);border-radius:var(--r-pill)}
.me-usage__bar::-webkit-progress-value{background:var(--y);border-radius:var(--r-pill)}
.me-usage__bar::-moz-progress-bar{background:var(--y);border-radius:var(--r-pill)}
.me-usage--out .me-usage__bar::-webkit-progress-value{background:var(--ember)}
.me-usage--out .me-usage__bar::-moz-progress-bar{background:var(--ember)}
.me-soonline{display:flex;align-items:flex-start;gap:10px;font-weight:600}
.me-soonline .icon{color:var(--text-3);margin-top:3px}
.me-out .meta{text-align:center}
.me-data__row{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.me-data__item{display:flex;flex-direction:column;gap:var(--sp-2);padding-top:var(--sp-3);border-top:1px solid var(--line)}
.me-out{display:flex;flex-direction:column;align-items:stretch;gap:var(--sp-2);margin-top:var(--sp-8)}
.me-out__ver{text-align:center;margin-top:var(--sp-3)}
.me-logout__btns{display:flex;flex-direction:column;gap:var(--sp-2)}

/* ================= admin ================= */
.admin__note{padding:var(--sp-3) var(--sp-4);border-radius:var(--r);background:var(--ember-soft);border:1px solid var(--ember-line);font-size:var(--fs-sm)}
.admin__count{margin:var(--sp-4) 0 var(--sp-2)}
.admin .field{margin-bottom:var(--sp-2)}
.admin-card__actions{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-3)}
.admin-days{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2)}
/* control center (screens/admin.js) */
.admin__note{display:grid;gap:var(--sp-2)}
.admin-tiles{margin-bottom:var(--sp-4)}
.admin-tiles__net{grid-column:1 / -1}
.admin-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-5)}
.admin-up{display:grid;gap:var(--sp-2)}
.admin-up__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-2) var(--sp-3);padding:var(--sp-3) var(--sp-4);
  border-radius:var(--r);background:var(--s1);border:1px solid var(--line)}
.admin-up__row--hot{border-color:var(--ember-line);background:var(--ember-soft)}
.admin-up__text{flex:1 1 220px;min-width:0}
.admin-up__acts{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.admin-flow{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:6px;align-items:end;padding:var(--sp-4) var(--sp-3) var(--sp-3);
  border-radius:var(--r);background:var(--s1);border:1px solid var(--line)}
.admin-flow__m{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0}
.admin-flow__bars{display:flex;align-items:flex-end;justify-content:center;gap:3px;block-size:140px;inline-size:100%}
.admin-flow__bar{display:block;inline-size:min(14px,40%);border-radius:4px 4px 0 0;block-size:2%;transition:block-size var(--t-slow) var(--ease)}
.admin-flow__bar--in{background:var(--ok)}
.admin-flow__bar--out{background:var(--line-strong)}
.admin-flow__m--future .admin-flow__bar{opacity:.4;outline:1px dashed var(--text-3);outline-offset:-1px}
.admin-flow__label{font-size:var(--fs-xs);color:var(--text-2);white-space:nowrap}
.admin-flow__future{font-size:.7rem;color:var(--text-3)}
.admin-flow__legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:var(--sp-2)}
.admin-dot{display:inline-block;inline-size:10px;block-size:10px;border-radius:3px}
.admin-dot--in{background:var(--ok)}
.admin-dot--out{background:var(--line-strong)}
.admin-usage{display:grid;gap:4px;margin-top:var(--sp-2)}
.admin-usage__bar,.admin-osek__bar{inline-size:100%;block-size:8px;border:0;border-radius:var(--r-pill);background:var(--s3);overflow:hidden;appearance:none;-webkit-appearance:none}
.admin-usage__bar::-webkit-progress-bar,.admin-osek__bar::-webkit-progress-bar{background:var(--s3);border-radius:var(--r-pill)}
.admin-usage__bar::-webkit-progress-value,.admin-osek__bar::-webkit-progress-value{background:var(--y);border-radius:var(--r-pill)}
.admin-usage__bar::-moz-progress-bar,.admin-osek__bar::-moz-progress-bar{background:var(--y);border-radius:var(--r-pill)}
.admin-usage__bar--hot::-webkit-progress-value,.admin-osek__bar--near::-webkit-progress-value,.admin-osek__bar--over::-webkit-progress-value{background:var(--ember)}
.admin-usage__bar--hot::-moz-progress-bar,.admin-osek__bar--near::-moz-progress-bar,.admin-osek__bar--over::-moz-progress-bar{background:var(--ember)}
.admin-osek__bar{block-size:12px}
.admin-osek__big{font-size:var(--fs-lg);font-weight:600}
.admin-row-aside{display:flex;align-items:center;gap:var(--sp-1)}
.admin-more{display:flex;justify-content:center;margin-top:var(--sp-3)}
.admin-will{padding:var(--sp-3) var(--sp-4);border-radius:var(--r);background:var(--y-soft);border:1px solid var(--y-ring)}
@media (max-width:359px){.admin-flow{gap:3px;padding-inline:var(--sp-2)}.admin-flow__bars{block-size:110px}}
[dir="rtl"] .onb-mic__bar{transform-origin:right center}
.login__google .login__g{display:inline-grid;vertical-align:-4px;margin-inline-end:10px}
.login__google:disabled{box-shadow:inset 0 0 0 1.5px var(--line)}
