/* Med Manager — auth pages */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#F5F5F5;color:#212121;min-height:100vh;display:flex;flex-direction:column}

/* Header */
.auth-header{background:linear-gradient(135deg,#1a73e8,#0d47a1);color:#fff;padding:14px 20px;display:flex;align-items:center;justify-content: center;margin-left: -12px;}
.auth-header h1{font-family:"SN Pro",sans-serif;font-size:1.55rem;font-weight:700;letter-spacing:.01em}
.auth-header h1 a{color:#fff;text-decoration:none}
.auth-header .brand-logo-wrapper,.auth-header .brand-logo-wrapper a{display:inline-flex;align-items:center;gap:0px}
/* Match the app topbar: oversized box compensates for the mark's viewBox
   padding; negative margins keep bar height, tighten the text gap, drop 2px */
.auth-header .brand-logo{width:48px;height:48px;margin:-4px -4px -8px -8px}
.auth-header .brand-logo-wrapper .logo-text-1{font-weight:700}
.auth-header .brand-logo-wrapper .logo-text-2{font-weight:300}

/* Layout */
.auth-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 16px}
.auth-card{background:#fff;border-radius:18px;box-shadow:0 4px 24px rgba(0,0,0,.10);padding:18px;width:100%;max-width:420px}
.auth-back{display:inline-flex;align-items:center;gap:6px;align-self:center;margin:0 0 12px;padding:8px 13px;border:1px solid #E0E0E0;border-radius:999px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.06);color:#1a73e8;text-decoration:none;font-size:.82rem;font-weight:700;transition:border-color .15s,box-shadow .15s,transform .15s}
.auth-back svg{width:16px;height:16px;fill:currentColor;flex-shrink:0}
.auth-back:hover{border-color:#1a73e8;box-shadow:0 3px 12px rgba(26,115,232,.14);transform:translateY(-1px)}
.auth-heading{font-size:1.45rem;font-weight:700;margin-bottom:22px;color:#212121}

/* Form */
.auth-form{display:flex;flex-direction:column;gap:14px}
.field{display:flex;flex-direction:column;gap:5px}
.field-label{font-size:.75rem;font-weight:700;color:#757575;letter-spacing:.06em;text-transform:uppercase}
.field-input{padding:11px 13px;border:1.5px solid #E0E0E0;border-radius:10px;font-size:.95rem;color:#212121;background:#fafafa;outline:none;transition:border .15s;font-family:inherit;width:100%}
.field-input:focus{border-color:#1a73e8;background:#fff}

/* Buttons */
.btn-primary{background:linear-gradient(135deg,#1a73e8,#0d47a1);color:#fff;border:none;border-radius:10px;padding:13px;font-size:.98rem;font-weight:700;cursor:pointer;width:100%;transition:opacity .15s;margin-top:4px}
.btn-primary:active{opacity:.85}

/* Messages */
.auth-error{background:#FFEBEE;color:#c62828;border:1px solid #FFCDD2;border-radius:10px;padding:10px 13px;font-size:.88rem;margin-bottom:6px}
.auth-success{background:#E8F5E9;color:#2e7d32;border:1px solid #C8E6C9;border-radius:10px;padding:10px 13px;font-size:.88rem;margin-bottom:6px}
.auth-switch{margin-top:18px;font-size:.85rem;color:#757575;text-align:center}
.auth-switch a{color:#1a73e8;text-decoration:none;font-weight:600}

/* Admin page */
/* width:100%/min-width:0 — body is a flex column, so without these the wrap
   can't shrink below the shares table's intrinsic width and the page overflows */
.admin-wrap{max-width:960px;width:100%;min-width:0;margin:0 auto;padding:28px 16px}
.admin-back{background:none;border:none;color:#1a73e8;cursor:pointer;font-size:.9rem;font-weight:600;padding:0;margin-bottom:20px;display:flex;align-items:center;gap:6px; margin: 0px auto 24px auto;}
.admin-section{margin-bottom:2.5rem}
.admin-section-title{font-size:1.2rem;font-weight:700;margin-bottom:14px;color:#212121}
.admin-table-wrap{background:#fff;border:1px solid #E0E0E0;border-radius:12px;overflow:hidden;overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.88rem}
th{padding:.6rem 1rem;text-align:left;font-size:.7rem;font-weight:700;letter-spacing:.08em;color:#757575;text-transform:uppercase;background:#F5F5F5;border-bottom:1px solid #E0E0E0}
td{padding:.65rem 1rem;border-bottom:1px solid #F0F0F0;color:#212121}
tr:last-child td{border-bottom:none}

/* User cards */
.user-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(270px,100%),1fr));gap:12px}
.user-card{background:#fff;border:1px solid #E0E0E0;border-radius:12px;padding:14px 16px;min-width:0}
.user-card-hdr{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:9px;margin-bottom:9px;border-bottom:1px solid #F0F0F0}
.user-card-name{font-size:1rem;font-weight:700;overflow:hidden;text-overflow:ellipsis}
.user-card-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.84rem;color:#212121;padding:3px 0;min-width:0}
.uc-lbl{font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#9E9E9E;flex-shrink:0}
.uc-email{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.badge-admin{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#1a73e8;background:rgba(26,115,232,.09);padding:.2rem .55rem;border-radius:4px}
.badge-user{font-size:.72rem;color:#9E9E9E}
.seat-code-cell{font-family:monospace;font-size:.82rem;letter-spacing:.07em;color:#424242;background:#F5F5F5;padding:.15rem .5rem;border-radius:4px;border:1px solid #E0E0E0;white-space:nowrap}

.code-grid{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.code-chip{display:inline-flex;align-items:stretch;background:#fff;border:1.5px solid #E0E0E0;border-radius:8px;overflow:hidden}
.code-chip-copy{display:inline-flex;align-items:center;gap:.4rem;background:none;border:none;cursor:pointer;padding:.3rem .55rem .3rem .8rem;color:#212121;font-family:monospace;font-size:.92rem;letter-spacing:.12em;font-weight:600;transition:background .12s}
.code-chip-copy:hover{background:#F5F5F5}
.code-chip-copy .copy-icon{font-size:.85rem;color:#9E9E9E}
.code-chip-sep{width:1px;background:#E0E0E0;flex-shrink:0}
.code-chip-del{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:.2rem .45rem;color:#9E9E9E;font-size:.95rem;transition:color .1s,background .1s}
.code-chip-del:hover{color:#e53935;background:#FFEBEE}

.generate-bar{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem;flex-wrap:wrap}
.generate-count{width:72px;padding:8px 10px;border:1.5px solid #E0E0E0;border-radius:8px;font-size:.9rem;color:#212121;background:#fafafa}
.btn-generate{background:linear-gradient(135deg,#1a73e8,#0d47a1);color:#fff;border:none;border-radius:8px;padding:9px 18px;font-size:.88rem;font-weight:700;cursor:pointer;transition:opacity .15s}
.btn-generate:active{opacity:.85}
.btn-generate:disabled{opacity:.5;cursor:not-allowed}

.used-code{font-family:monospace;font-size:.82rem;color:#BDBDBD;letter-spacing:.08em;text-decoration:line-through}
.used-by{font-size:.78rem;color:#9E9E9E}

.status-active{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#2e7d32;background:#E8F5E9;padding:.2rem .55rem;border-radius:4px}
.status-revoked{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#c62828;background:#FFEBEE;padding:.2rem .55rem;border-radius:4px}

.btn-revoke{background:none;border:1px solid #E0E0E0;border-radius:6px;cursor:pointer;color:#757575;font-size:.78rem;font-weight:600;padding:.25rem .7rem;transition:color .1s,background .1s,border-color .1s;white-space:nowrap}
.btn-revoke:hover{color:#e53935;background:#FFEBEE;border-color:#FFCDD2}
.btn-restore:hover{color:#2e7d32;background:#E8F5E9;border-color:#C8E6C9}

/* Admin on small screens */
.admin-pad{padding:1.25rem 1.5rem}
@media(max-width:640px){
  .admin-wrap{padding:20px 10px}
  .admin-pad{padding:1rem .8rem}
  .admin-section-title{font-size:1.05rem}
  .code-grid{gap:.4rem}
  .code-chip-copy{font-size:.85rem;padding:.3rem .4rem .3rem .6rem;letter-spacing:.08em}
  table{font-size:.8rem}
  th,td{padding:.5rem .6rem}
}

/* Toast */
#adminToast{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(.5rem);background:#212121;color:#fff;padding:.55rem 1.25rem;border-radius:8px;font-size:.85rem;opacity:0;transition:opacity .18s,transform .18s;pointer-events:none;z-index:500;white-space:nowrap}
#adminToast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── Dark mode ─────────────────────────────────────────────────────────────
   html[data-theme=dark] is stamped by the topbar's theme toggle, so these only
   fire on topbar pages (admin/users, admin/support). Standalone auth pages
   never set the attribute and stay light. State variants (:hover/:focus/.off)
   are restated because the [data-theme] attribute raises specificity above
   the light-mode state rules. */
html[data-theme=dark] body{background:#121212;color:#E0E0E0}
html[data-theme=dark] .auth-card{background:#1E1E1E}
html[data-theme=dark] .auth-back{background:#1E1E1E;border-color:#444}
html[data-theme=dark] .auth-heading{color:#E0E0E0}
html[data-theme=dark] .field-label{color:#9E9E9E}
html[data-theme=dark] .field-input{background:#2A2A2A;border-color:#555;color:#E0E0E0}
html[data-theme=dark] .field-input:focus{background:#2A2A2A;border-color:#1a73e8}
html[data-theme=dark] .auth-switch{color:#9E9E9E}

html[data-theme=dark] .admin-section-title{color:#E0E0E0}
html[data-theme=dark] .admin-table-wrap{background:#1E1E1E;border-color:#3A3A3A}
html[data-theme=dark] th{background:#2A2A2A;color:#9E9E9E;border-bottom-color:#3A3A3A}
html[data-theme=dark] td{color:#E0E0E0;border-bottom-color:#2A2A2A}
html[data-theme=dark] .user-card{background:#1E1E1E;border-color:#3A3A3A}
html[data-theme=dark] .user-card-hdr{border-bottom-color:#2F2F2F}
html[data-theme=dark] .user-card-row{color:#E0E0E0}
html[data-theme=dark] .seat-code-cell{color:#BDBDBD;background:#2A2A2A;border-color:#3A3A3A}
html[data-theme=dark] .code-chip{background:#1E1E1E;border-color:#555}
html[data-theme=dark] .code-chip-copy{color:#E0E0E0}
html[data-theme=dark] .code-chip-copy:hover{background:#2A2A2A}
html[data-theme=dark] .code-chip-sep{background:#555}
html[data-theme=dark] .code-chip-del{color:#9E9E9E}
html[data-theme=dark] .code-chip-del:hover{color:#EF9A9A;background:#3A2222}
html[data-theme=dark] .generate-count{background:#2A2A2A;border-color:#555;color:#E0E0E0}
html[data-theme=dark] .used-code{color:#616161}
html[data-theme=dark] .badge-admin{color:#8AB4F8;background:rgba(138,180,248,.12)}
html[data-theme=dark] .status-active{color:#A5D6A7;background:#1E3320}
html[data-theme=dark] .status-revoked{color:#EF9A9A;background:#3A2222}
html[data-theme=dark] .btn-revoke{border-color:#555;color:#B0B0B0}
html[data-theme=dark] .btn-revoke:hover{color:#EF9A9A;background:#3A2222;border-color:#5C3333}
html[data-theme=dark] .btn-restore:hover{color:#A5D6A7;background:#1E3320;border-color:#33552F}

/* Inline-styled spots (profile.php precedent: [style*=…] needs !important) */
html[data-theme=dark] .user-card div[style*="border-top"]{border-top-color:#2F2F2F!important}
html[data-theme=dark] .user-card button[style*="border"]{border-color:#555!important;color:#B0B0B0!important}
html[data-theme=dark] td[style*="color:#555"]{color:#B0B0B0!important}
html[data-theme=dark] span[style*="#2e7d32"]{color:#81C784!important}
html[data-theme=dark] span[style*="#c62828"],html[data-theme=dark] p[style*="#c62828"]{color:#E57373!important}

/* Share page */
.share-header-meta{font-size:.82rem;opacity:.82;margin-top:4px}
.share-body{max-width:800px;margin:0 auto;padding:20px 16px 60px}
.share-section{background:#fff;border-radius:14px;box-shadow:0 2px 12px rgba(0,0,0,.08);overflow:hidden;margin-bottom:16px}
.share-section-hdr{padding:11px 15px;display:flex;align-items:center;gap:10px;border-bottom:3px solid transparent}
.share-section-title{font-size:.95rem;font-weight:700;flex:1}
.share-med-row{display:flex;align-items:center;gap:10px;padding:10px 15px;border-bottom:1px solid #F0F0F0}
.share-med-row:last-child{border-bottom:none}
.share-med-row.taken .share-med-info{opacity:.45}
.share-check{width:36px;height:36px;border-radius:50%;border:2px solid #E0E0E0;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;background:#fff}
.share-check.done{background:#8BC34A;border-color:#8BC34A;color:#fff}
.share-med-name{font-size:.92rem;font-weight:700}
.refill-flag{display:inline-block;width:14px;height:14px;margin-right:5px;vertical-align:-2px;background-color:#2e7d32;-webkit-mask:url('images/icons/refresh.svg') center/contain no-repeat;mask:url('images/icons/refresh.svg') center/contain no-repeat}
.share-med-sub{font-size:.75rem;color:#757575;margin-top:1px}
.share-empty{text-align:center;padding:18px;color:#9E9E9E;font-size:.88rem}
.share-footer{text-align:center;padding:20px;font-size:.75rem;color:#BDBDBD}