/* Shree Airlines brand palette (Brand Guidelines, Jan 2017) */
:root{
  --red:#da2424;        /* secondary/wordmark red (Pantone 2035 C) */
  --maroon:#a50c13;     /* primary/deep red (Pantone 484 C) */
  --yellow:#f7a41e;     /* deep yellow (Pantone 130 C) */
  --black:#1a1a1a;
  --ink:#242a2e;
  --muted:#7b7d7d;      /* secondary gray palette */
  --line:#ecf0f1;
  --line-2:#d0d3d4;
  --bg:#f4f6f7;
  --panel:#ffffff;
  --thead:#f0f3f4;
  --ok:#1b7f4b; --warn:#8a5a00;
  --radius:8px;
  --font:'Lato',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.5}
a{color:var(--maroon);text-decoration:none}
a:hover{text-decoration:underline}

.topbar{display:flex;align-items:center;justify-content:space-between;
  background:#fff;padding:.6rem 1.4rem;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center}
.brand:hover{text-decoration:none}
.brand-logo{height:34px;width:auto;display:block}
.topbar nav a{color:var(--ink);margin-left:1.5rem;font-weight:700;font-size:.95rem;
  padding-bottom:2px;border-bottom:2px solid transparent}
.topbar nav a:hover{color:var(--red);text-decoration:none;border-bottom-color:var(--yellow)}
.brandstrip{height:3px;background:linear-gradient(90deg,var(--red) 0%,var(--maroon) 45%,var(--yellow) 100%)}

.container{max-width:1040px;margin:1.4rem auto;padding:0 1.4rem}
.context-label{color:var(--muted);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;margin:.2rem 0 1rem}
.footer{max-width:1040px;margin:2.5rem auto 1.5rem;padding:0 1.4rem;color:var(--muted);font-size:.82rem}

h1{font-size:1.55rem;font-weight:700;margin:.2rem 0 1rem;color:var(--black)}
h2{font-size:1.05rem;font-weight:700;margin:0 0 .7rem;color:var(--maroon)}
.muted{color:var(--muted)}
.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.4rem}

.cards{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem}
.card{display:block;background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--red);
  border-radius:var(--radius);padding:1.1rem 1.5rem;min-width:180px}
.card:hover{text-decoration:none;border-color:var(--line-2);border-top-color:var(--maroon)}
.card-num{font-size:2.1rem;font-weight:700;color:var(--maroon);line-height:1.1}
.card-label{color:var(--muted)}

table.grid{width:100%;border-collapse:collapse;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin:.4rem 0 1rem}
.grid th,.grid td{text-align:left;padding:.55rem .75rem;border-bottom:1px solid var(--line);vertical-align:top}
.grid th{background:var(--thead);font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700}
.grid tr:last-child td{border-bottom:none}
.grid tr.retired td{color:var(--muted);font-style:italic}
.overdue{color:var(--maroon);font-weight:700}

.row-actions{display:flex;gap:.7rem;align-items:center;flex-wrap:wrap}
.row-actions form{display:inline;margin:0}
.btn{display:inline-block;background:var(--red);color:#fff;border:none;border-radius:6px;
  padding:.5rem 1rem;font-size:.92rem;font-weight:700;cursor:pointer;font-family:var(--font)}
.btn:hover{background:var(--maroon);text-decoration:none}
.btn-ghost{display:inline-block;padding:.5rem 1rem;color:var(--muted)}
.link{background:none;border:none;color:var(--maroon);cursor:pointer;padding:0;font:inherit;font-size:.9rem}
.link:hover{text-decoration:underline}
.link-danger{background:none;border:none;color:var(--red);cursor:pointer;padding:0;font:inherit;font-size:.9rem}
.link-danger:hover{text-decoration:underline}

.card-form,.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.2rem 1.3rem;margin-bottom:1.2rem}
.card-form{max-width:760px}
.panel h2{border-left:3px solid var(--yellow);padding-left:.55rem;margin-left:-.55rem}
fieldset{border:1px solid var(--line);border-radius:6px;margin:0 0 1rem;padding:.7rem 1rem 1rem}
legend{font-weight:700;color:var(--maroon);padding:0 .4rem;font-size:.95rem}
.field{margin-bottom:.8rem}
.field label{display:block;font-size:.82rem;color:var(--muted);margin-bottom:.25rem;font-weight:700}
.field.check label{display:inline;color:var(--ink);font-weight:400}
.input{width:100%;padding:.5rem .6rem;border:1px solid var(--line-2);border-radius:6px;font-size:.95rem;
  background:#fff;font-family:var(--font)}
.input:focus{outline:2px solid var(--red);outline-offset:0;border-color:var(--red)}
textarea.input{min-height:70px}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
.row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 1rem}
.checks ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.4rem 1.3rem}
.checks li label{display:inline;color:var(--ink);font-weight:400}
.errors{list-style:none;padding:0;margin:.25rem 0 0;color:var(--red);font-size:.82rem}
.form-actions{display:flex;gap:.8rem;align-items:center;margin-top:.4rem}
.inline-form{display:flex;gap:.8rem;align-items:flex-end;flex-wrap:wrap;margin-top:1rem;
  border-top:1px dashed var(--line-2);padding-top:1rem}
.inline-form .field{margin-bottom:0}
.inline-form .field .input{min-width:150px}

dl.detail{display:grid;grid-template-columns:190px 1fr;gap:.4rem 1rem;margin:0}
dl.detail dt{color:var(--muted);font-weight:700;font-size:.9rem}
.subhead{font-weight:700;color:var(--ink);margin:1rem 0 .3rem}

.flashes{margin-bottom:1rem}
.flash{padding:.6rem .9rem;border-radius:6px;margin-bottom:.5rem;border:1px solid transparent;font-size:.92rem}
.flash-success{background:#e7f6ee;border-color:#bde5cd;color:var(--ok)}
.flash-info{background:#fbe9e6;border-color:#f3ccc4;color:var(--maroon)}
.flash-error{background:#fbeaea;border-color:#f0c9c7;color:var(--red)}
.tag{display:inline-block;background:var(--thead);border:1px solid var(--line-2);border-radius:20px;
  padding:.05rem .55rem;font-size:.8rem;color:var(--ink);margin:0 .2rem .2rem 0}
.license-card{border:1px solid var(--line);border-radius:6px;padding:.8rem 1rem;margin-bottom:1rem;background:#fff}
.license-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.5rem}
.license-head .row-actions{margin-left:auto}
.badge{display:inline-block;padding:.12rem .6rem;border-radius:20px;font-size:.78rem;font-weight:700;border:1px solid transparent}
.badge-valid{background:#e7f6ee;color:#1b7f4b;border-color:#bde5cd}
.badge-due_soon{background:#fdf2e3;color:#8a5a00;border-color:#f3ddb4}
.badge-expired{background:#fbeaea;color:var(--maroon);border-color:#f0c9c7}
.badge-no_data,.badge-unknown,.badge-not_done{background:var(--thead);color:var(--muted);border-color:var(--line-2)}
.badge-complete{background:#e7f6ee;color:#1b7f4b;border-color:#bde5cd}

/* top bar right side + user menu */
.topbar-right{display:flex;align-items:center;gap:1.4rem}
.user-menu{display:flex;align-items:center;gap:.6rem;border-left:1px solid var(--line);padding-left:1.1rem}
.user-menu .who{font-size:.9rem;color:var(--muted);font-weight:700}
.user-menu form{margin:0}

/* login page */
.login-body{background:var(--bg)}
.login-wrap{display:flex;justify-content:center;padding:6vh 1rem}
.login-card{background:#fff;border:1px solid var(--line);border-top:3px solid var(--red);
  border-radius:var(--radius);padding:2rem 2rem 2.2rem;width:100%;max-width:360px;text-align:center}
.login-logo{height:40px;width:auto;margin:.2rem auto .3rem}
.login-sub{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;margin:0 0 1.4rem}
.login-card form{text-align:left}
.login-card .field label{margin-bottom:.3rem}
.btn-block{display:block;width:100%;margin-top:.6rem;text-align:center}

/* permission checkbox column layout for roles */
.checks-col ul{flex-direction:column;gap:.35rem}

/* --- HRS-aligned user module --- */
.user-menu{display:block;text-align:right;border-left:none;padding-left:0}
.user-menu .who{font-weight:700;color:var(--ink);font-size:.95rem;line-height:1.2}
.user-menu .who-role{color:var(--muted);font-size:.8rem;line-height:1.2}
.user-menu form{margin:0}
.signout{background:none;border:none;color:var(--red);cursor:pointer;font:inherit;font-weight:700;padding:0}
.signout:hover{text-decoration:underline}

.btn-outline{display:inline-block;background:#fff;color:var(--ink);border:1px solid var(--line-2);
  border-radius:6px;padding:.45rem .9rem;font-size:.9rem;font-weight:700;cursor:pointer;font-family:var(--font)}
.btn-outline:hover{border-color:var(--maroon);color:var(--maroon);text-decoration:none}
.btn-mini{padding:.2rem .55rem;font-size:.78rem}

.online{color:var(--ok);font-weight:700}
.sep{color:var(--line-2)}

/* roles matrix */
.matrix-scroll{overflow-x:auto}
table.matrix th.col-group{text-align:center;white-space:nowrap;vertical-align:top}
table.matrix th.col-group .btn-mini{margin-top:.35rem}
table.matrix .del-group{display:block;font-size:.72rem;color:var(--red);margin-top:.2rem}
table.matrix td.cell-check{text-align:center}
table.matrix td strong{font-weight:700}
/* freeze first column while scrolling */
table.matrix{overflow:visible !important}
table.matrix td:first-child,
table.matrix th:first-child{position:sticky;left:0;background:var(--panel);z-index:2;white-space:nowrap;border-right:2px solid var(--line)}
table.matrix thead th:first-child{z-index:3}
.cell-check{text-align:center}
.group-add{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:.6rem 0 1rem}
.group-add-label{font-weight:700;color:var(--ink)}
.group-add .input{width:auto;min-width:200px}
input[type=checkbox],input[type=radio]{accent-color:var(--maroon);width:16px;height:16px}

/* training status badges */
.badge{display:inline-block;padding:.15rem .55rem;border-radius:20px;font-size:.8rem;font-weight:700}
.badge-valid{background:#e7f6ee;color:var(--ok);border:1px solid #bde5cd}
.badge-expiring{background:#fdf3e3;color:var(--warn);border:1px solid #f2d9a8}
.badge-expired{background:#fbeaea;color:var(--red);border:1px solid #f0c9c7}
.badge-none{background:var(--thead);color:var(--muted);border:1px solid var(--line-2)}

/* build tag in footer */
.footer{display:flex;justify-content:space-between;align-items:center}
.build-tag{color:var(--line-2);font-size:.75rem;font-family:monospace}

/* editable functions row */
.fn-form{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .9rem}
.fn-check{display:flex;align-items:center;gap:.25rem;font-size:.92rem;font-weight:400;color:var(--ink)}

.chpw{color:var(--muted);font-size:.8rem}
.chpw:hover{color:var(--maroon)}

/* member filter bar */
.filter-bar{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:.8rem 1rem;margin-bottom:1rem}
.filter-label{font-weight:700;color:var(--muted);font-size:.85rem;margin-right:.4rem}
.filter-types{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;margin-bottom:.5rem}
.filter-search{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;
  border-top:1px dashed var(--line);padding-top:.6rem}
.search-input{width:240px}
.filter-hint{margin-top:.5rem;font-style:italic}

.btn-disabled{background:var(--line-2) !important;color:var(--muted) !important;cursor:not-allowed !important}

.input-file{display:block;padding:.4rem 0;font-size:.92rem}

/* dashboard table */
.dash-table{max-width:800px}
.dash-table tfoot tr{background:var(--thead);border-top:2px solid var(--line-2)}
.num-col{text-align:center}
.cell-warn{background:#fbeaea;color:var(--red);font-weight:700}
.cell-warn-light{background:#fdf3e3;color:var(--warn)}
.totals-row td{padding:.7rem .75rem}

/* scan panel */
.scan-section{margin:.6rem 0;display:flex;flex-direction:column;gap:.4rem}
.scan-current{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.scan-upload-form{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;
  border-top:1px dashed var(--line-2);padding-top:.5rem;margin-top:.2rem}

/* breadcrumbs */
.breadcrumb{font-size:.82rem;color:var(--muted);margin-bottom:.5rem}
.breadcrumb a{color:var(--muted)}
.breadcrumb a:hover{color:var(--maroon)}

/* doc rows */
.doc-row{border:1px solid var(--line);border-radius:6px;padding:.7rem 1rem;margin-bottom:.7rem}
.doc-row-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.4rem}
.doc-current{border-left:3px solid var(--ok)}
.panel-rule-link{font-size:.78rem;color:var(--muted);font-weight:400;margin-left:.6rem}
.panel-rule-link:hover{color:var(--maroon)}