/* Shared interface layer. Existing page IDs and workflow controls are retained. */
/* Colours visually matched to the supplied Tracetec cover. */
:root { --one-ink:#111111; --one-muted:#606065; --one-line:#d8d8dc; --one-red:#e92c38; --one-surface:#e7e7e9; }
html { font-size:15px; }
body { color:var(--one-ink); background:var(--one-surface); font-family:Inter, "Segoe UI", Arial, sans-serif; }
a { color:#225e98; }
h1,h2,h3,h4,h5 { letter-spacing:-.025em; }
h2 { font-size:1.8rem; font-weight:650; }
:focus-visible { outline:3px solid #397bc0; outline-offset:3px; }
.skip-link { position:fixed; top:-100px; left:16px; z-index:3000; padding:12px 20px; background:white; }
.skip-link:focus { top:12px; }
nav.navbar { height:auto; min-height:76px; border-bottom:1px solid var(--one-line); box-shadow:0 2px 12px #202b3908!important; }
.navbar-brand { display:flex; align-items:center; gap:6px; }
.navbar-brand img { width:165px; height:auto; }
#tTone { font-family:inherit; font-size:1.55rem; font-weight:300; color:var(--one-muted); }
.navbar .nav-link { font-size:.93rem; font-weight:550; border-radius:8px; padding:11px 14px!important; color:#536174!important; }
.navbar .nav-link:hover { background:#f1f4f8; color:var(--one-ink)!important; }
.navbar .nav-link.active { background:#fcecee; color:#a9232c!important; }
.navbar-collapse { padding:10px 0; }
main#main-content { padding:100px 28px 52px; height:auto!important; min-height:100vh; }
main>header { width:100%; max-width:none; padding:0; margin:8px 0 26px; background:transparent; border:0; border-radius:0; }
main>header>h1, main>header>h2, main>header>h5 { text-align:left; }
main>header h5 { margin-top:8px; color:var(--one-muted); font-size:.88rem; font-weight:400; }
main>.container-fluid { padding-left:0; padding-right:0; }
.environment-note { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:24px; font-size:.8rem; color:var(--one-muted); }
.environment-badge { padding:5px 10px; border:1px solid #d6dde6; border-radius:5px; color:#455469; background:#fff; font-weight:600; }
.eyebrow { font-size:.72rem; font-weight:700; letter-spacing:.15em; color:var(--one-muted); margin-bottom:14px; }
.home-intro { padding-top:15px; margin-bottom:32px; padding-bottom:22px; border-bottom:4px solid var(--one-red); }
.home-intro h1 { font-size:clamp(1.9rem,3.2vw,2.8rem); font-weight:650; margin-bottom:12px; }
.home-intro>p:last-child { color:var(--one-muted); font-size:1.04rem; }
#landing>div { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.card { border:1px solid var(--one-line); border-radius:12px; box-shadow:0 3px 12px #202b3904!important; overflow:hidden; }
.card-header { background:#fff; padding:18px 20px!important; border-bottom:1px solid #edf0f4; }
.card-header h5 { font-size:1rem; font-weight:650; }
.card-body { padding:20px; }
.card-footer { background:#fff; border-top:1px solid #edf0f4; padding:16px 20px; }
.module-card { margin:0!important; text-align:left!important; transition:transform .16s,box-shadow .16s,border-color .16s; }
.module-card:hover { transform:translateY(-3px); border-color:#bcc8d7; box-shadow:0 10px 24px #24354c0d!important; }
.module-card a { display:flex; flex-direction:column; color:var(--one-ink); padding:26px; }
.module-card .card-body { padding:0 0 25px; flex:0; }
.module-card .card-body i { font-size:1.6rem; padding:13px; width:54px; height:54px; border-radius:12px; color:#ae2731; background:#fceff0; }
.module-card .card-footer { border:0; padding:0; }
.module-card h5 { display:flex; justify-content:space-between; font-size:1.15rem; font-weight:650; }
.module-arrow { color:#8a96a6; font-weight:400; }
.module-description { color:var(--one-muted); font-size:.9rem; line-height:1.6; margin:10px 0 0; }
.table { color:var(--one-ink); font-size:.9rem; }
.table>:not(caption)>*>* { padding:12px 14px; border-color:#edf0f4; vertical-align:middle; }
.table thead { color:#5b6879; background:#f8fafc; font-size:.78rem; }
.table thead th { font-weight:650; }
.table.detail-table tr th:first-child { width:35%; font-weight:500; color:var(--one-muted); }
.table-hover>tbody>tr:hover { --bs-table-accent-bg:#f4f7fb; }
.table-secondary { --bs-table-bg:#edf1f6; --bs-table-striped-bg:#edf1f6; }
.btn { border-radius:7px; font-weight:550; padding:9px 15px; }
.btn-primary { background:#bd2934; border-color:#bd2934; }
.btn-primary:hover,.btn-primary:focus { background:#9d1f29; border-color:#9d1f29; }
.btn-outline-primary { color:#a9232c; border-color:#d8a7ad; }
.btn-outline-primary:hover { background:#bd2934; border-color:#bd2934; color:white; }
.form-control,.form-select { border-radius:8px; border-color:#ccd5e0; }
.form-control:focus,.form-select:focus { border-color:#799bc2; box-shadow:0 0 0 3px #3175bd15; }
input[type="text"].editable:not([disabled]),input[type="password"].editable:not([disabled]),select.editable:not([disabled]) { padding:8px 10px; min-height:38px; border:1px solid #c4cedb; border-radius:6px; outline:none; width:100%; background:#fff; }
input.editable:focus-visible,select.editable:focus-visible { outline:2px solid #397bc0; outline-offset:1px; }
input.editable:disabled { color:var(--one-ink)!important; padding:5px 0; }
.table-scroll { width:100%; overflow-x:auto; }
.table-scroll:focus-visible { outline-offset:-3px; }
#dashboard .card { height:calc(100% - 1.5rem); }
#dashboard .card-body { min-width:0; }
#dashboard #resources { color:var(--one-muted); }
.empty-state td { padding:28px 16px!important; text-align:center; color:var(--one-muted); font-size:.88rem; }
#basestation-map { min-height:520px; height:calc(100vh - 235px); border:1px solid var(--one-line); border-radius:12px; overflow:hidden; }
#loading,#paused { top:88px; right:22px; }
#alert { top:88px; right:50px; }
footer.footer { position:static!important; padding:16px 24px; color:var(--one-muted); font-size:.76rem; background:var(--one-surface); }
footer>div>span { background:transparent; box-shadow:none; }
#login { min-height:100vh; height:auto; padding:32px 16px; background:linear-gradient(to bottom,var(--one-surface) 0%,var(--one-surface) 52%,var(--one-red) 52%,var(--one-red) 100%); }
#login form { width:420px; max-width:100%; padding:38px!important; border:1px solid #e0e5ec!important; border-radius:16px!important; box-shadow:0 20px 60px #1c2b4310; }
#login img { width:230px; max-width:100%; height:auto; margin-bottom:30px!important; }
#login h3 { font-size:1.8rem; font-weight:650; }
.login-description { margin-bottom:26px; color:var(--one-muted); }
#login .form-floating { margin-bottom:14px; }
#login .btn { background:#bd2934; border-color:#bd2934; min-height:46px; }
#login .btn:hover { background:#9d1f29; }
@media(min-width:1200px) {
 nav.navbar { width:235px; height:100vh; bottom:0; border-right:1px solid var(--one-line); align-items:stretch; }
 nav.navbar>.container-fluid { flex-direction:column; align-items:stretch; justify-content:flex-start; padding:32px 18px; }
 .navbar-brand { margin:0 0 44px; padding:0 5px; }
 .navbar-brand img { width:153px; }
 #tTone { font-size:1.3rem; }
 .navbar-collapse { display:flex!important; flex-direction:column; align-items:stretch; flex-grow:1; padding:0; }
 .navbar-nav { flex-direction:column!important; margin:0!important; gap:6px; height:100%; }
 .navbar-nav .nav-item:last-child { margin-top:auto; border-top:1px solid var(--one-line); padding-top:16px; }
 main#main-content { margin-left:235px; padding:30px 36px 36px; }
 footer.footer { margin-left:235px; }
 #loading,#paused { top:32px; }
 #alert { top:32px; }
}
@media(max-width:850px) { #landing>div { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:575px) {
 main#main-content { padding:94px 16px 24px; }
 .navbar-brand img { width:140px; }
 .navbar-toggler { padding:8px; }
 #landing>div { grid-template-columns:1fr; gap:14px; }
 .module-card a { padding:22px; }
 .home-intro { padding-top:0; }
 .environment-note { gap:6px; margin-bottom:20px; font-size:.74rem; }
 .card-body { padding:14px; }
 .table.detail-table tr th:first-child { white-space:normal!important; }
 #login form { padding:28px!important; }
 main header form .col-sm-2,main header form .col-sm-8,main header form .col-sm-10 { margin-bottom:8px; }
}
/* Darker red for text and buttons keeps the brand palette readable. */
a { color:#bd1c28; }
h1,h2,h3,h4,h5 { color:var(--one-ink); }
.navbar .nav-link { color:#55555b!important; }
.navbar .nav-link:hover { background:#eeeeef; }
.navbar .nav-link.active { background:#fdecef; color:#bd1c28!important; box-shadow:inset 3px 0 var(--one-red); }
.module-card .card-body i { color:var(--one-red); background:#fdecef; }
.module-arrow { color:#74747b; }
.table thead { color:var(--one-muted); background:#f7f7f8; }
.table-secondary { --bs-table-bg:#ededee; --bs-table-striped-bg:#ededee; }
.table-hover>tbody>tr:hover { --bs-table-accent-bg:#f5f5f6; }
.btn-primary,#login .btn { background:#bd1c28; border-color:#bd1c28; }
.btn-primary:hover,.btn-primary:focus,#login .btn:hover { background:#a01822; border-color:#a01822; }
.btn-outline-primary { color:#bd1c28; border-color:var(--one-red); }
.btn-outline-primary:hover { background:#bd1c28; border-color:#bd1c28; }
.form-control:focus,.form-select:focus { border-color:var(--one-red); box-shadow:0 0 0 3px #e92c3818; }
:focus-visible,input.editable:focus-visible,select.editable:focus-visible { outline-color:#bd1c28; }
@media(prefers-reduced-motion:reduce) { .module-card { transition:none; } .text-blink { animation:none; } }
