/* Brand colors and entry composition shared with the clinic assistant reference. */
:root {
  --bs-brand:#009ece;
  --bs-brand-strong:#007e9e;
  --bs-cyan:#8ce0f5;
  --bs-lime:#b7d200;
  --bs-ink:#0c2f3d;
  --bs-night:#061c26;
  --bs-text:#f3fafc;
  --bs-text-muted:#bdd5df;
  --bs-canvas:#f6f9fa;
  --bs-line:#e2ebef;
  --brand:var(--bs-brand-strong);
  --ink:var(--bs-ink);
  --bg:var(--bs-canvas);
}
.brand-logo { display:block; width:184px; height:56px; flex-shrink:0; }
.sidebar .brand { display:flex; flex-direction:column; align-items:flex-start; gap:12px; padding:0 7px; }
.sidebar .brand-logo { width:174px; height:53px; max-width:100%; }
.brand-app { font-size:12px; color:var(--muted); letter-spacing:.16em; }
.sidebar nav { margin-top:30px; }
.nav-btn.active { box-shadow:inset 3px 0 var(--bs-brand); }
.status-dot { background:var(--bs-brand); }
button { transition:background-color 150ms ease,color 150ms ease,border-color 150ms ease; }
button.primary { background:var(--bs-brand-strong); border-color:var(--bs-brand-strong); }
button.primary:focus-visible { outline-color:var(--bs-brand-strong); }
button.primary:disabled { background:#577d89; border-color:#577d89; }
progress::-webkit-progress-value { background:var(--bs-brand); }
progress::-moz-progress-bar { background:var(--bs-brand); }
.table-wrap { scrollbar-color:#b5d5e1 transparent; scrollbar-width:thin; }
.panel-head { background:#fcfefe; }

/* The entry page borrows the reference's photograph, shade, split layout and glass. */
.login.brand-entry {
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  min-height:100svh;
  overflow:clip;
  background:var(--bs-night);
  color:var(--bs-text);
}
.entry-backdrop,.entry-shade { position:absolute; inset:0; pointer-events:none; }
.entry-backdrop { z-index:-2; background:url('/assets/clinic-surgery.png') center / cover no-repeat; }
.entry-shade {
  z-index:-1;
  background:linear-gradient(90deg,rgba(3,16,22,.79),rgba(4,17,23,.43) 47%,rgba(3,17,23,.26) 72%,rgba(3,16,22,.42)),linear-gradient(0deg,rgba(2,13,18,.76),transparent 35%,transparent 75%,rgba(3,16,22,.44));
}
.entry-header,.entry-main,.entry-footer { width:100%; max-width:1680px; margin:0 auto; padding-inline:clamp(28px,5vw,88px); }
.entry-header { display:flex; align-items:center; min-height:96px; }
main.entry-main {
  flex:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) 424px;
  align-items:center;
  gap:clamp(40px,5vw,100px);
  padding-block:24px 40px;
}
.entry-story { min-width:0; padding-block:28px; }
.entry-overline { display:flex; align-items:center; gap:12px; margin:0 0 28px; color:var(--bs-cyan); font-size:13px; letter-spacing:3px; }
.entry-overline > span { width:6px; height:6px; flex-shrink:0; border-radius:50%; background:var(--bs-lime); }
.entry-story h1 { margin:0; color:#fff; font-size:clamp(38px,4.1vw,68px); font-weight:700; line-height:1.3; letter-spacing:-.045em; }
.entry-story h1 > span { display:block; color:var(--bs-cyan); margin-top:8px; }
.entry-description { margin:28px 0 0; font-size:17px; line-height:1.9; color:var(--bs-text-muted); letter-spacing:.4px; }
.entry-signature { display:flex; align-items:center; gap:14px; margin-top:50px; font-size:12px; letter-spacing:1.2px; color:var(--bs-text-muted); }
.entry-signature > span { width:32px; height:1px; background:rgba(140,224,245,.4); }
.entry-panel {
  padding:32px;
  border:1px solid rgba(140,224,245,.32);
  border-radius:24px;
  background:rgba(12,47,61,.36);
  backdrop-filter:blur(18px) saturate(116%);
  -webkit-backdrop-filter:blur(18px) saturate(116%);
  box-shadow:inset 0 1px 0 rgba(243,250,252,.26),0 20px 60px rgba(0,14,22,.24);
}
.entry-eyebrow { color:var(--bs-cyan); font-size:12px; letter-spacing:2px; margin:0 0 12px; }
.entry-panel-heading h2 { font-size:30px; line-height:1.4; font-weight:650; letter-spacing:-.5px; color:var(--bs-text); }
.entry-panel-heading > p:last-child { color:var(--bs-text-muted); font-size:13px; line-height:1.8; margin:10px 0 28px; }
.entry-panel .field { margin-bottom:20px; }
.entry-panel label { color:#e2f1f6; font-size:13px; font-weight:500; margin-bottom:10px; }
.entry-panel input {
  min-height:50px;
  border:1px solid rgba(140,224,245,.3);
  border-radius:10px;
  background:rgba(6,28,38,.72);
  color:var(--bs-text);
  padding:13px 15px;
  font-size:15px;
  caret-color:var(--bs-cyan);
  color-scheme:dark;
}
.entry-panel input::placeholder { color:#9cbac7; opacity:1; }
.entry-panel input:hover { border-color:rgba(140,224,245,.5); }
.entry-panel input:focus { background:rgba(6,28,38,.9); border-color:var(--bs-cyan); outline:2px solid rgba(0,158,206,.4); outline-offset:2px; }
.entry-panel input:-webkit-autofill { -webkit-text-fill-color:var(--bs-text); -webkit-box-shadow:0 0 0 100px #0b2935 inset; caret-color:var(--bs-cyan); }
.entry-panel .hint { color:#bdd5df; font-size:12px; }
.entry-password { position:relative; }
.entry-password input { padding-right:52px; }
.entry-panel .password-reveal { position:absolute; right:4px; top:3px; width:44px; height:44px; padding:0; display:grid; place-items:center; border:0; border-radius:7px; color:#bdd5df; background:transparent; }
.entry-panel .password-reveal:hover { color:#fff; background:rgba(140,224,245,.1); }
.entry-panel .form-error { color:#ffd9cc; font-size:13px; }
.entry-panel .form-error:not(:empty) { border:1px solid rgba(239,164,146,.48); border-radius:8px; background:rgba(104,43,39,.72); padding:10px 12px; }
.entry-panel .entry-submit { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:52px; padding:14px 18px; margin-top:26px; border-radius:10px; font-size:15px; background:var(--bs-brand-strong); border-color:#009ece; color:#fff; }
.entry-panel .entry-submit:focus-visible { outline-color:var(--bs-cyan); }
.entry-footer { display:flex; justify-content:space-between; align-items:center; gap:20px; min-height:72px; padding-block:18px; font-size:12px; color:var(--bs-text-muted); letter-spacing:.5px; }
.entry-footer > span:first-child { display:flex; align-items:center; gap:12px; }
.entry-footer i { width:3px; height:3px; border-radius:50%; background:var(--bs-cyan); }
.entry-footer > span:last-child { font-size:10px; letter-spacing:2px; }
@supports not (backdrop-filter:blur(1px)) { .entry-panel { background:rgba(12,47,61,.94); } }
@media (hover:hover) and (pointer:fine) {
  button.primary:not(:disabled):hover { background:linear-gradient(90deg,#00aee0,var(--bs-lime)); border-color:transparent; color:var(--bs-night); }
}
@media (max-width:1100px) {
  .sidebar .brand-logo { width:156px; height:48px; }
  main.entry-main { grid-template-columns:minmax(0,1fr) 380px; gap:32px; }
  .entry-story h1 { font-size:38px; }
  .entry-panel { padding:28px; }
}
@media (max-width:800px) {
  .entry-header,.entry-main,.entry-footer { padding-inline:28px; }
  .entry-header { min-height:84px; }
  .entry-header .brand-logo { width:160px; height:49px; }
  main.entry-main { grid-template-columns:1fr; padding-block:16px 32px; gap:28px; max-width:620px; }
  .entry-story { padding-block:8px; }
  .entry-story h1 { font-size:clamp(31px,5.8vw,42px); }
  .entry-overline { font-size:11px; letter-spacing:2px; margin-bottom:18px; }
  .entry-description { font-size:14px; line-height:1.8; margin-top:18px; }
  .entry-signature { display:none; }
  .entry-panel { padding:26px; border-radius:20px; }
  .entry-panel-heading h2 { font-size:27px; }
  .entry-footer { flex-wrap:wrap; justify-content:center; text-align:center; gap:10px; padding-block:20px; }
  .entry-shade { background:linear-gradient(180deg,rgba(3,16,22,.8),rgba(3,16,22,.5) 35%,rgba(3,16,22,.76)); }
  .entry-backdrop { background-position:58% center; }
}
@media (max-width:700px) {
  .sidebar .brand { flex-direction:row; align-items:center; gap:18px; }
  .sidebar .brand-logo { width:148px; height:45px; }
  .brand-app { border-left:1px solid var(--line); padding-left:16px; letter-spacing:.08em; }
  .sidebar nav { margin-top:18px; }
  .nav-btn.active { box-shadow:inset 0 -2px var(--bs-brand); }
  .sidebar-foot { justify-content:flex-end; gap:8px; padding-top:12px; font-size:12px; }
  button,.actions button,.sidebar-foot button { min-height:44px; }
  input,select,textarea { font-size:16px; }
  .entry-panel input { font-size:16px; }
  .actions { flex-wrap:wrap; }
  .panel-head { flex-wrap:wrap; }
}
@media (max-width:400px) {
  .entry-header,.entry-main,.entry-footer { padding-inline:20px; }
  .entry-panel { padding:22px; }
  .entry-story h1 { font-size:30px; }
  .entry-footer { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
