/* REDTURBAN Mail console design system (v0.7.81.0)
   1. tokens  2. fonts  3. shell  4. legacy normalisation (scoped to .rt-content)  5. responsive / a11y */

@font-face{font-family:"IBM Plex Sans";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:600;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}

:root{
  --c-spine:#0F1E33;--c-spine-hover:#182C4A;--c-spine-ink:#D3DDEB;--c-spine-dim:#8798B3;--c-spine-line:#22385A;
  --c-canvas:#F3F5F8;--c-surface:#FFFFFF;--c-sunken:#EEF1F5;--c-line:#DCE2EA;--c-line-strong:#C3CCD8;
  --c-ink:#172338;--c-muted:#5B6B82;--c-link:#1F5FBF;
  --c-red:#C8161D;--c-red-hover:#A81218;--c-focus:#2E6FD8;
  --c-ok:#18794E;--c-ok-bg:#E5F3EB;--c-warn:#8A5300;--c-warn-bg:#FCF0DA;--c-crit:#B42318;--c-crit-bg:#FCEBE9;--c-info:#1F5FBF;--c-info-bg:#E7EFFB;
  --f-sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --r-panel:8px;--r-control:6px;--spine-w:248px;--bar-h:56px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --c-spine:#0A1526;--c-spine-hover:#13243D;--c-spine-line:#1C2F4B;
  --c-canvas:#0E1827;--c-surface:#142134;--c-sunken:#0B1421;--c-line:#25364D;--c-line-strong:#34475F;
  --c-ink:#E3EAF4;--c-muted:#97A7BE;--c-link:#86B4F4;
  --c-red:#D92A31;--c-red-hover:#E5444A;--c-focus:#7FA8F0;
  --c-ok:#5CC994;--c-ok-bg:#12301F;--c-warn:#E6B656;--c-warn-bg:#33270F;--c-crit:#F2827B;--c-crit-bg:#3A1714;--c-info:#86B4F4;--c-info-bg:#14284A;
  color-scheme:dark;
}}

/* ---------- 3. shell ---------- */
body.rt-shell{margin:0!important;padding:0!important;background:var(--c-canvas)!important;color:var(--c-ink)!important;
  font:14px/1.55 var(--f-sans)!important;-webkit-font-smoothing:antialiased}
body.rt-shell::before{display:none!important}
.rt-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rt-skip{position:absolute;left:12px;top:-40px;z-index:100;background:var(--c-surface);color:var(--c-ink);padding:8px 12px;border-radius:var(--r-control)}
.rt-skip:focus{top:12px}
.rt-app{display:grid;grid-template-columns:var(--spine-w) minmax(0,1fr);min-height:100vh}

.rt-spine{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;background:var(--c-spine);color:var(--c-spine-ink);
  border-top:3px solid transparent;border-image:linear-gradient(90deg,#D71920 0 34%,#D4A017 34% 67%,#2E7D32 67%) 1;overflow:hidden}
.rt-spine-brand{display:flex;align-items:center;gap:10px;padding:16px 18px 14px;color:#fff!important;text-decoration:none!important;font-weight:600;font-size:15px;letter-spacing:-.005em}
.rt-spine-brand img{flex:0 0 30px;border-radius:50%}
.rt-find{position:relative;margin:2px 14px 10px}
.rt-find input{width:100%;box-sizing:border-box;height:34px;padding:0 30px 0 10px;border-radius:var(--r-control);border:1px solid var(--c-spine-line);
  background:rgba(255,255,255,.06);color:#fff;font:inherit;font-size:13px}
.rt-find input::placeholder{color:var(--c-spine-dim)}
.rt-find kbd{position:absolute;right:8px;top:7px;font:12px/18px var(--f-mono);color:var(--c-spine-dim);border:1px solid var(--c-spine-line);border-radius:4px;padding:0 5px}
.rt-nav{flex:1;overflow-y:auto;padding:4px 10px 16px;scrollbar-width:thin;scrollbar-color:var(--c-spine-line) transparent}
.rt-nav-top{padding-bottom:6px;margin-bottom:6px;border-bottom:1px solid var(--c-spine-line)}
.rt-nav-group summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;
  padding:9px 8px 5px;color:var(--c-spine-dim);font-size:12.5px;font-weight:500;border-radius:4px}
.rt-nav-group summary::-webkit-details-marker{display:none}
.rt-nav-group summary::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);transition:transform .15s}
.rt-nav-group[open] summary::after{transform:rotate(45deg)}
.rt-nav-group summary:hover{color:var(--c-spine-ink)}
.rt-nav-item{position:relative;display:block;padding:6px 10px 6px 12px;margin:1px 0;border-radius:var(--r-control);color:var(--c-spine-ink)!important;
  text-decoration:none!important;font-size:13.5px;line-height:1.35}
.rt-nav-item:hover{background:var(--c-spine-hover);color:#fff!important}
.rt-nav-item.is-active{background:var(--c-spine-hover);color:#fff!important;font-weight:500}
.rt-nav-item.is-active::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:2px;background:var(--c-red)}
.rt-nav-item[target="_blank"]::after{content:" (new tab)";color:var(--c-spine-dim);font-size:11.5px}
.rt-nav-empty{margin:10px 8px;color:var(--c-spine-dim);font-size:13px}
.rt-spine-foot{padding:10px 18px 14px;border-top:1px solid var(--c-spine-line);color:var(--c-spine-dim);font-size:12px}

.rt-main{min-width:0;display:flex;flex-direction:column}
.rt-bar{position:sticky;top:0;z-index:20;height:var(--bar-h);display:flex;align-items:center;gap:16px;padding:0 28px;
  background:var(--c-surface);border-bottom:1px solid var(--c-line)}
.rt-menu{display:none}
.rt-crumbs{display:flex;gap:8px;align-items:center;min-width:0;font-size:13.5px;color:var(--c-muted)}
.rt-crumbs span+span::before{content:"/";margin-right:8px;color:var(--c-line-strong)}
.rt-crumbs [aria-current]{color:var(--c-ink);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-bar-end{margin-left:auto;display:flex;align-items:center;gap:16px;font-size:13.5px}
.rt-user{color:var(--c-muted)}
.rt-signout{color:var(--c-ink)!important;text-decoration:none!important;padding:6px 10px;border:1px solid var(--c-line);border-radius:var(--r-control)}
.rt-signout:hover{border-color:var(--c-line-strong);background:var(--c-sunken)}
.rt-content{flex:1;padding:24px 28px 56px;outline:none}

/* ---------- 4. legacy normalisation: page markup predates the shell ---------- */
/* Legacy page headers and nav bars are replaced by the shell */
.rt-content > .wrap > .top > .nav,.rt-content > .wrap > .top > nav,.rt-content > .wrap > .top > .brand,
.rt-content > header.bar,.rt-content > .shell > .brand,.rt-content .rt-heritage-strip{display:none!important}
.rt-content > .wrap > .top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin:0 0 4px}
.rt-content > .wrap > .top:not(:has(> :not(.nav,nav,.brand))){display:none}
.rt-content .wrap,.rt-content > main,.rt-content > .shell{max-width:1280px!important;margin:0!important;padding:0!important;background:none!important}

.rt-content h1{font-size:24px!important;line-height:1.25!important;font-weight:600!important;letter-spacing:-.012em;margin:4px 0 6px!important;color:var(--c-ink)!important}
.rt-content h2{font-size:17px!important;line-height:1.3!important;font-weight:600!important;margin:0 0 10px!important;color:var(--c-ink)!important}
.rt-content h3{font-size:15px!important;font-weight:600!important;color:var(--c-ink)!important}
.rt-content p,.rt-content li{max-width:80ch}
.rt-content .muted,.rt-content .sub,.rt-content small{color:var(--c-muted)!important}
.rt-content a{color:var(--c-link)}
.rt-content a:not(.btn):not(.button):hover{text-decoration:underline}

.rt-content .panel,.rt-content .card,.rt-content .hero,.rt-content .safe,.rt-content .box,.rt-content section.panel{
  background:var(--c-surface)!important;border:1px solid var(--c-line)!important;border-radius:var(--r-panel)!important;
  box-shadow:none!important;color:var(--c-ink)!important;padding:20px 22px}
.rt-content .hero{background:var(--c-surface)!important;padding:22px!important}
.rt-content .stat,.rt-content .kpi,.rt-content .metric{background:var(--c-surface)!important;border:1px solid var(--c-line)!important;border-radius:var(--r-panel)!important;box-shadow:none!important}

.rt-content input:not([type=checkbox]):not([type=radio]):not([type=submit]),.rt-content select,.rt-content textarea{
  background:var(--c-surface)!important;color:var(--c-ink)!important;border:1px solid var(--c-line-strong)!important;border-radius:var(--r-control)!important;
  font:inherit!important;font-size:14px!important;padding:8px 10px!important;min-height:36px;box-sizing:border-box}
.rt-content input::placeholder,.rt-content textarea::placeholder{color:#8a97aa}
.rt-content label{color:var(--c-ink);font-weight:500;font-size:13px}

.rt-content button,.rt-content .btn,.rt-content .button,.rt-content input[type=submit]{
  background:var(--c-red)!important;color:#fff!important;border:1px solid var(--c-red)!important;border-radius:var(--r-control)!important;
  box-shadow:none!important;font:inherit!important;font-size:14px!important;font-weight:500!important;padding:8px 14px!important;min-height:36px;cursor:pointer;text-decoration:none!important}
.rt-content button:hover,.rt-content .btn:hover,.rt-content .button:hover{background:var(--c-red-hover)!important;border-color:var(--c-red-hover)!important}
.rt-content button.secondary,.rt-content .secondary,.rt-content .btn.ghost,.rt-content button.ghost,.rt-content .btn-secondary,.rt-content button[value=cancel]{
  background:var(--c-surface)!important;color:var(--c-ink)!important;border:1px solid var(--c-line-strong)!important}
.rt-content button.secondary:hover,.rt-content .secondary:hover{background:var(--c-sunken)!important}
.rt-content button:disabled,.rt-content button[disabled]{opacity:.55;cursor:not-allowed}

.rt-content table{width:100%;border-collapse:collapse;font-size:13.5px;background:var(--c-surface)}
.rt-content th{text-align:left;font-weight:500;color:var(--c-muted)!important;background:var(--c-sunken)!important;border-bottom:1px solid var(--c-line)!important;padding:9px 12px!important}
.rt-content td{border-bottom:1px solid var(--c-line)!important;padding:9px 12px!important;color:var(--c-ink);vertical-align:top}
.rt-content tr:last-child td{border-bottom:0!important}

.rt-content pre,.rt-content code{font-family:var(--f-mono)!important;font-size:12.5px!important}
.rt-content pre{background:var(--c-sunken)!important;color:var(--c-ink)!important;border:1px solid var(--c-line)!important;border-radius:var(--r-control)!important;
  padding:12px 14px!important;overflow:auto;max-width:100%}

/* Links styled as buttons navigate; they are secondary. Red is reserved for actions (buttons) or an explicit .primary. */
.rt-content a.btn:not(.primary),.rt-content a.button:not(.primary){background:var(--c-surface)!important;color:var(--c-ink)!important;border:1px solid var(--c-line-strong)!important}
.rt-content a.btn:not(.primary):hover,.rt-content a.button:not(.primary):hover{background:var(--c-sunken)!important;text-decoration:none!important}
/* Legacy pages hard-code dark-theme border colours; map them all to the console line colour. */
body.rt-shell .rt-content *{border-color:var(--c-line)}
/* When the legacy header held only brand + nav it is hidden; drop the gap it leaves. */
.rt-content > .wrap > .top:not(:has(> :not(.nav,nav,.brand))) + *{margin-top:0!important}

/* Legacy dark-theme surfaces (enumerated from all pages): mapped to console surfaces with readable ink. */
.rt-content .arch,.rt-content .pre,.rt-content .progress{background:var(--c-sunken)!important;color:var(--c-ink)!important;border:1px solid var(--c-line)!important;border-radius:var(--r-control)!important}
.rt-content .arch,.rt-content .pre{font-family:var(--f-mono)!important;font-size:12.5px!important}
.rt-content .metrics>div,.rt-content .metric,.rt-content .step,.rt-content .deploy-step,.rt-content .deploy-phase,.rt-content .phase-summary,
.rt-content .side,.rt-content .field,.rt-content .check,.rt-content .choice label{background:var(--c-surface)!important;color:var(--c-ink)!important;border-color:var(--c-line)!important;box-shadow:none!important}
.rt-content .metrics>div span,.rt-content .deploy-step{color:var(--c-muted)!important}
.rt-content .metrics>div strong{color:var(--c-ink)!important;font-weight:600}
.rt-content .goodnote{background:var(--c-ok-bg)!important;color:var(--c-ink)!important;border:1px solid var(--c-line)!important;border-left:3px solid var(--c-ok)!important}
.rt-content .failure{background:var(--c-crit-bg)!important;color:var(--c-ink)!important;border:1px solid var(--c-line)!important;border-left:3px solid var(--c-crit)!important}
.rt-content :not(pre)>code{background:var(--c-sunken)!important;color:var(--c-ink)!important;border:1px solid var(--c-line);border-radius:4px!important;padding:1px 5px!important}
/* The legacy footer was fixed to the window and covered content; inside the console it flows with the page. */
.rt-content .site-footer,.rt-content .footer{position:static!important;left:auto!important;right:auto!important;z-index:auto!important;
  padding:16px 0 0!important;text-align:left!important;font-size:12.5px!important}

/* status: colour only where state exists, always paired with text */
.rt-content .pill,.rt-content .badge,.rt-content .tag{display:inline-block;background:var(--c-sunken)!important;color:var(--c-ink)!important;
  border:1px solid var(--c-line)!important;border-radius:4px!important;padding:2px 8px!important;font-size:12.5px!important;font-weight:500!important}
.rt-content .ok,.rt-content .green,.rt-content .pass,.rt-content .good{color:var(--c-ok)!important}
.rt-content .warn,.rt-content .amber,.rt-content .warning{color:var(--c-warn)!important}
.rt-content .err,.rt-content .bad,.rt-content .fail,.rt-content .critical,.rt-content .danger{color:var(--c-crit)!important}
.rt-content .notice,.rt-content .alert,.rt-content .flash,.rt-content .msg{background:var(--c-info-bg)!important;color:var(--c-ink)!important;
  border:1px solid var(--c-line)!important;border-left:3px solid var(--c-info)!important;border-radius:var(--r-control)!important;padding:10px 14px!important}
.rt-content .notice.err,.rt-content .alert.err,.rt-content .flash.err,.rt-content .msg.err,.rt-content .error{background:var(--c-crit-bg)!important;border-left-color:var(--c-crit)!important;color:var(--c-ink)!important}
.rt-content .notice.ok,.rt-content .flash.ok,.rt-content .msg.ok,.rt-content .success{background:var(--c-ok-bg)!important;border-left-color:var(--c-ok)!important;color:var(--c-ink)!important}
.rt-content hr{border:0;border-top:1px solid var(--c-line)}
.rt-content .site-footer,.rt-content .footer{background:transparent!important;color:var(--c-muted)!important;border-top:1px solid var(--c-line)!important;margin-top:32px!important}
.rt-content .site-footer b,.rt-content .footer b{color:var(--c-ink)!important}

/* ---------- 5. focus, motion, responsive, print ---------- */
body.rt-shell :focus-visible{outline:2px solid var(--c-focus)!important;outline-offset:2px}
.rt-spine :focus-visible{outline-color:#9DBDF5!important}
@media (prefers-reduced-motion:reduce){body.rt-shell *{transition:none!important;animation:none!important}}
@media (max-width:960px){
  .rt-app{grid-template-columns:minmax(0,1fr)}
  .rt-spine{position:fixed;inset:0 auto 0 0;width:min(84vw,300px);z-index:50;transform:translateX(-105%);transition:transform .2s ease}
  .rt-app.is-nav-open .rt-spine{transform:none;box-shadow:0 0 0 100vmax rgba(10,20,36,.45)}
  .rt-menu{display:inline-flex;align-items:center;height:34px;padding:0 12px;border:1px solid var(--c-line);border-radius:var(--r-control);background:var(--c-surface);color:var(--c-ink);font:inherit;font-size:13.5px;cursor:pointer}
  .rt-bar{padding:0 16px}.rt-content{padding:18px 16px 40px}.rt-user{display:none}
}
@media print{.rt-spine,.rt-bar{display:none!important}.rt-app{display:block}.rt-content{padding:0}}

/* ---------- 6. sign-in (login.php: same tokens; brand story on the navy spine colour, form on the canvas) ---------- */
body.rt-auth{margin:0;min-height:100vh;color:var(--c-ink);font:15px/1.55 var(--f-sans);-webkit-font-smoothing:antialiased;
  background:linear-gradient(90deg,var(--c-spine) 0 50%,var(--c-canvas) 50% 100%)!important}
.rt-auth .shell{max-width:none!important;margin:0!important;padding:0!important;min-height:100vh;display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto 1fr auto;column-gap:0}
.rt-auth .grid{display:contents}
.rt-auth .shell>.brand,.rt-auth .rt-descriptor,.rt-auth .hero{grid-column:1;padding-left:max(48px,calc(50vw - 560px));padding-right:56px}
.rt-auth .shell>.brand{grid-row:1;display:flex;align-items:center;gap:12px;padding-top:40px;color:#fff;font-size:18px;font-weight:600;letter-spacing:-.005em;
  border-top:3px solid transparent;border-image:linear-gradient(90deg,#D71920 0 34%,#D4A017 34% 67%,#2E7D32 67%) 1}
.rt-auth .shell>.brand::before{content:"";width:34px;height:34px;flex:0 0 34px;background:url(brand/REDTURBAN_Vector_App_Mark.svg) center/contain no-repeat}
.rt-auth .rt-descriptor{grid-row:2;margin:6px 0 0!important;color:var(--c-spine-dim)!important;font-size:13px;letter-spacing:0;text-transform:none}
.rt-auth .hero{grid-row:3;align-self:center;background:none!important;border:0!important;box-shadow:none!important;padding-top:24px;padding-bottom:48px;max-width:560px;color:var(--c-spine-ink)}
.rt-auth .hero .pill{display:none}
.rt-auth .hero h1{color:#fff;font-size:36px;line-height:1.15;font-weight:600;letter-spacing:-.02em;margin:0 0 14px;max-width:16ch}
.rt-auth .hero p{color:var(--c-spine-ink);max-width:46ch;margin:0 0 10px}
.rt-auth .hero p.muted{color:var(--c-spine-dim)!important;font-size:14px}
.rt-auth .rt-tagline{color:#E2B93B;font-family:var(--f-sans);font-style:italic;font-size:14px;margin-top:22px}
.rt-auth .login{grid-column:2;grid-row:1/4;align-self:center;justify-self:start;width:min(400px,calc(100% - 96px));margin-left:clamp(32px,8vw,120px);
  background:var(--c-surface)!important;border:1px solid var(--c-line)!important;border-radius:var(--r-panel)!important;box-shadow:none!important;padding:28px!important}
.rt-auth .login h2{font-size:20px;font-weight:600;margin:0 0 18px;color:var(--c-ink)}
.rt-auth .login label{display:block;font-size:13px;font-weight:500;color:var(--c-ink);margin:14px 0 6px}
.rt-auth .login input{width:100%;box-sizing:border-box;height:40px;padding:0 12px;border:1px solid var(--c-line-strong);border-radius:var(--r-control);
  background:var(--c-surface);color:var(--c-ink);font:inherit;font-size:15px}
.rt-auth .login button{width:100%;margin-top:22px;height:42px;border:0;border-radius:var(--r-control);background:var(--c-red);color:#fff;font:inherit;font-weight:500;cursor:pointer;box-shadow:none}
.rt-auth .login button:hover{background:var(--c-red-hover)}
.rt-auth .login .err{margin:0 0 6px;padding:10px 12px;border-radius:var(--r-control);background:var(--c-crit-bg);border-left:3px solid var(--c-crit);color:var(--c-ink)}
.rt-auth .shell>p{grid-column:2;grid-row:4;margin:0 0 32px clamp(32px,8vw,120px)!important;text-align:left!important;font-size:14px}
.rt-auth .shell>p a{color:var(--c-link)}
.rt-auth :focus-visible{outline:2px solid var(--c-focus);outline-offset:2px}
@media (max-width:860px){
  body.rt-auth{background:var(--c-canvas)!important}
  .rt-auth .shell{display:block}
  .rt-auth .shell>.brand,.rt-auth .rt-descriptor,.rt-auth .hero{background:var(--c-spine)!important;padding-left:24px;padding-right:24px}
  .rt-auth .rt-descriptor{margin:0!important;padding-top:4px}
  .rt-auth .shell>.brand{margin:0!important;padding-bottom:6px}.rt-auth .hero{border-radius:0!important;margin:0!important}
  .rt-auth .shell>.brand{padding-top:24px}.rt-auth .hero{padding-bottom:28px;max-width:none}.rt-auth .hero h1{font-size:28px}
  .rt-auth .login{width:auto;margin:24px!important}.rt-auth .shell>p{margin:0 24px 32px!important}
}
