/* Shared styles for login.html / admin.html — built on top of styles.css's
   CSS variables (:root palette), not a separate theme. */

.auth-shell{max-width:420px;margin:50px auto;padding:0 16px}
.auth-card{background:var(--paper-raised);border:1px solid var(--line);
  border-radius:14px;padding:30px 28px;box-shadow:var(--shadow)}
.auth-card h1{font-size:21px}

.auth-error{margin:0 0 16px;padding:10px 12px;border-radius:8px;
  background:var(--crit-soft);color:var(--crit);font-size:12.5px;line-height:1.5}
.auth-hint{margin:0 0 16px;padding:10px 12px;border-radius:8px;
  background:var(--accent-soft);color:var(--accent-strong);font-size:12.5px;line-height:1.5}

.google-btn{width:100%;display:flex;align-items:center;justify-content:center;
  gap:10px;padding:10px 14px;font-size:13.5px;margin-bottom:4px}

.auth-divider{display:flex;align-items:center;gap:10px;margin:18px 0;
  color:var(--ink-dim);font-size:11.5px;text-transform:uppercase;letter-spacing:.04em}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--line)}

.auth-tabs{display:flex;gap:2px;border:1px solid var(--line);border-radius:9px;
  padding:3px;margin-bottom:18px;background:var(--paper)}
.auth-tab{flex:1;padding:8px 10px;border:none;background:none;border-radius:7px;
  font-size:12.5px;font-weight:600;color:var(--ink-dim)}
.auth-tab.active{background:var(--accent-strong);color:#fff}

.auth-field{display:block;margin-bottom:14px}
.auth-field span{display:block;font-size:11.5px;color:var(--ink-dim);margin-bottom:5px;
  text-transform:uppercase;letter-spacing:.03em}
.auth-field input{width:100%;padding:10px 12px;border:1px solid var(--line);
  border-radius:8px;background:var(--paper);color:var(--ink);font-size:13.5px}
.auth-field input:focus{outline:none;border-color:var(--accent)}

.auth-submit{width:100%;padding:11px;font-size:13.5px;margin-top:2px}
.auth-resend{width:100%;padding:8px;font-size:12px;margin-top:8px}

.auth-foot{text-align:center;margin-top:16px;font-size:12px;color:var(--ink-dim)}
.auth-foot a{color:var(--accent-strong)}

/* ---- account menu in the main app header ---- */
#accountMenu{position:relative}
#accountBtn{display:flex;align-items:center;gap:8px;padding:5px 10px 5px 5px}
#accountBtn img{width:24px;height:24px;border-radius:50%}
#accountBtn .avatar-fallback{width:24px;height:24px;border-radius:50%;
  background:var(--accent-strong);color:#fff;font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center}
#accountDropdown{position:absolute;right:0;top:calc(100% + 6px);min-width:220px;
  background:var(--paper-raised);border:1px solid var(--line);border-radius:10px;
  box-shadow:var(--shadow);padding:8px;z-index:60}
#accountDropdown .who{padding:8px 10px;border-bottom:1px solid var(--line-soft);margin-bottom:6px}
#accountDropdown .who .n{font-weight:700;font-size:13px}
#accountDropdown .who .e{font-size:11.5px;color:var(--ink-dim)}
#accountDropdown button{width:100%;text-align:left;padding:8px 10px;border:none;
  background:none;border-radius:7px;font-size:13px;color:var(--ink)}
#accountDropdown button:hover{background:var(--accent-soft);color:var(--accent-strong)}
.drive-pill{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;
  padding:2px 8px;border-radius:20px;margin:4px 10px 6px}
.drive-pill.on{background:var(--good-soft);color:var(--good)}
.drive-pill.off{background:var(--warn-soft);color:var(--warn)}

/* ---- cloud cases section on the dashboard ---- */
.section-divider{display:flex;align-items:center;gap:10px;margin:28px 0 14px}
.section-divider h2{margin:0;white-space:nowrap}
.section-divider::after{content:"";flex:1;height:1px;background:var(--line)}
.drive-banner{display:flex;align-items:center;justify-content:space-between;gap:14px;
  flex-wrap:wrap;background:var(--accent-soft);border:1px solid var(--accent);
  border-radius:10px;padding:14px 16px;margin-bottom:16px}
.drive-banner p{margin:0;font-size:13px;color:var(--ink)}
.case-card.cloud{border-color:var(--accent)}
.case-card .cloud-badge{font-size:10px;font-weight:700;letter-spacing:.03em;
  text-transform:uppercase;color:var(--accent-strong);background:var(--accent-soft);
  padding:1px 7px;border-radius:20px;align-self:flex-start}

/* ---- new-cloud-case modal ---- */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:95;display:none}
.modal-backdrop.show{display:flex;align-items:center;justify-content:center;padding:16px}
.modal-card{background:var(--paper-raised);border:1px solid var(--line);border-radius:12px;
  padding:22px;max-width:440px;width:100%;box-shadow:var(--shadow)}
.modal-card h2{margin-bottom:12px}
.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}

@media (max-width:640px){
  .auth-shell{margin:26px auto}
  .auth-card{padding:22px 18px}
}