/* =====================================================================
   SMATENERGY Design System — "Instrument Panel"
   Grounded in the subject: fuel-station telemetry read like gauges on
   real equipment, not a generic admin template. Cool graphite + steel
   teal (pressure-gauge metal) with signal amber (pump/hazard signage)
   reserved for accents and live states. Crisp panels over soft-shadow
   cards; tabular numerals on every readout; one deliberate motion —
   the live pulse — instead of hover animation on everything.
   ===================================================================== */
:root{
  --sg-primary:#0E7C74;--sg-primary-dark:#095B55;--sg-primary-soft:#E3F2F0;
  --sg-accent:#E8A317;--sg-accent-soft:#FBEDD2;
  --sg-ink:#10161C;--sg-muted:#5B6672;--sg-bg:#EEF1F1;--sg-surface:#fff;
  --sg-border:#DDE3E3;--sg-sidebar:#14181D;--sg-success:#168a4b;
  --sg-danger:#d92d20;--sg-warning:#b9790c;--sg-info:#0E7C74;--sg-radius:9px;
  --sg-shadow:0 1px 2px rgba(16,24,28,.05);
  --sg-font-display:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --sg-font-body:'Inter',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{min-height:100vh;display:flex;flex-direction:column;background:var(--sg-bg)!important;color:var(--sg-ink);font-family:var(--sg-font-body);font-size:13px;line-height:1.5;overflow-x:hidden}
main{flex:1}.text-muted{color:var(--sg-muted)!important}.small{font-size:.75rem!important}
.container{--bs-gutter-x:1.5rem}.page-content{width:100%}
h1,h2,h3,h4,h5,h6,.kpi-value,.tank-level,.tank-level-value,.hero-title,.section-title,.auth-card-head h1,.auth-showcase h1,.landing-stat strong,.hero-metric strong{font-family:var(--sg-font-display);letter-spacing:-.02em}
.tabular,.kpi-value,.tank-level,.tank-level-value,.tank-visual .tank-level,.detail-stat strong,.landing-stat strong,.hero-metric strong{font-variant-numeric:tabular-nums}

/* Global controls */
.btn{font-size:.78rem;font-weight:650;border-radius:7px;padding:.55rem .88rem;line-height:1.25;white-space:normal}
.btn-lg{font-size:.84rem;padding:.7rem 1rem}.btn-sm{font-size:.7rem;padding:.42rem .65rem}
.btn-primary{--mdb-btn-bg:var(--sg-primary);--mdb-btn-border-color:var(--sg-primary);--mdb-btn-hover-bg:var(--sg-primary-dark);--mdb-btn-hover-border-color:var(--sg-primary-dark);--mdb-btn-active-bg:var(--sg-primary-dark)}
.btn-warning{--mdb-btn-bg:var(--sg-accent);--mdb-btn-border-color:var(--sg-accent);color:#231a04;--mdb-btn-hover-bg:#d29310;--mdb-btn-hover-border-color:#d29310;--mdb-btn-color:#231a04;--mdb-btn-hover-color:#231a04}
.text-primary{color:var(--sg-primary)!important}.bg-primary{background:var(--sg-primary)!important}
.bg-primary-subtle{background:var(--sg-primary-soft)!important}.bg-warning-subtle{background:var(--sg-accent-soft)!important}.bg-info-subtle{background:var(--sg-primary-soft)!important}
.text-warning{color:#8a5f0c!important}.text-info{color:var(--sg-primary)!important}
.form-control,.form-select{font-size:.8rem;border-color:#cfd8d8;border-radius:7px;min-height:40px;box-shadow:none!important;background:#fff}
.form-control:focus,.form-select:focus{border-color:var(--sg-primary);box-shadow:0 0 0 3px rgba(14,124,116,.1)!important}
textarea.form-control{min-height:100px;resize:vertical}.form-label{font-size:.73rem;font-weight:700;color:#344054;margin-bottom:5px}.form-text{font-size:.7rem}
.form-outline{margin-bottom:1rem}.form-outline .form-control{background:#fff}.form-check-label{font-size:.76rem}.input-group>.form-control{min-width:0}
.table{--mdb-table-cell-padding-y:.68rem;--mdb-table-cell-padding-x:.8rem;margin-bottom:0}.table-responsive{border-radius:8px}.badge{font-size:.65rem;letter-spacing:.01em;padding:.38em .6em}
.alert{font-size:.77rem;border-radius:8px;border:1px solid transparent}
.card,.smat-card{border:1px solid var(--sg-border)!important;border-radius:var(--sg-radius)!important;box-shadow:var(--sg-shadow)!important;background:var(--sg-surface)}
.card-header{background:#fff!important;border-bottom:1px solid var(--sg-border)!important;border-radius:var(--sg-radius) var(--sg-radius) 0 0!important;padding:13px 16px;font-size:.78rem}
.card-body{padding:16px}.modal-content{border:0;border-radius:12px;box-shadow:0 20px 60px rgba(16,24,28,.18)}.modal-header,.modal-footer{border-color:var(--sg-border);padding:13px 16px}.modal-body{padding:16px}

/* Navbar */
.smat-navbar{min-height:60px;background:var(--sg-sidebar)!important;border-bottom:1px solid rgba(255,255,255,.06);z-index:1030}
.smat-brand{font-family:var(--sg-font-display);font-size:.95rem;letter-spacing:0}.smat-brand-mark{width:31px;height:31px;display:inline-flex;align-items:center;justify-content:center;border-radius:7px;background:linear-gradient(135deg,var(--sg-primary),#14a89c);box-shadow:0 0 0 1px rgba(255,255,255,.08) inset}
.smat-navbar .nav-link{font-size:.76rem;color:rgba(255,255,255,.68)!important;border-radius:6px;padding:.45rem .65rem}.smat-navbar .nav-link:hover{color:#fff!important;background:rgba(255,255,255,.06)}
.smat-navbar .navbar-toggler{border:0;padding:.35rem}.smat-navbar .dropdown-menu{border:1px solid var(--sg-border);border-radius:9px;box-shadow:0 15px 35px rgba(16,24,28,.14);font-size:.76rem}

/* Portal shell — console sidebar */
.portal-shell{display:flex;min-height:calc(100vh - 60px)}
.portal-sidebar{width:218px;flex:0 0 218px;background:var(--sg-sidebar);color:#fff;padding:14px 9px 10px;position:static;height:auto;overflow:visible;display:flex;flex-direction:column;background-image:linear-gradient(180deg,rgba(255,255,255,.025),transparent 120px)}
.portal-sidebar-label{color:#7C8A87;font-size:.56rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;padding:9px 8px 4px;font-family:var(--sg-font-display)}
.portal-nav a{display:flex;align-items:center;gap:8px;padding:6px 8px;margin:1px 0;color:#B7C1BF;border-radius:7px;text-decoration:none;font-size:.74rem;transition:background-color .14s,color .14s}.portal-nav a i{width:16px;text-align:center;font-size:.69rem}
.portal-nav a:hover,.portal-nav a.active{color:#fff;background:rgba(255,255,255,.07)}.portal-nav a.active{box-shadow:inset 3px 0 0 var(--sg-accent)}
.portal-main{flex:1;min-width:0;padding:0}.portal-container{max-width:1480px;padding-top:20px;padding-bottom:24px}.portal-mobile-bar{display:none}.sidebar-overlay{display:none}
.page-heading{margin-bottom:20px}.page-heading h1{font-size:1.38rem;font-weight:700;margin:0}.page-heading p{margin:3px 0 0;color:var(--sg-muted);font-size:.77rem}.page-heading .eyebrow{font-size:.6rem;color:var(--sg-primary);font-weight:800;text-transform:uppercase;letter-spacing:.1em;font-family:var(--sg-font-display)}
.page-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.page-title-row h1{margin:0;font-size:1.32rem;font-weight:700}

/* Sidebar system-status readout — one deliberate "live" moment */
.sidebar-status{margin-top:10px;padding:9px 10px;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;gap:8px;font-size:.63rem;color:#8B9793;font-family:var(--sg-font-display)}
.sidebar-status .led{width:7px;height:7px;border-radius:50%;background:var(--sg-success);box-shadow:0 0 0 3px rgba(22,163,74,.18);flex-shrink:0;animation:sg-pulse 2.2s ease-in-out infinite}
@keyframes sg-pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* KPI / instrument cards — corner-bracket accent instead of blurred circle */
.kpi-card{position:relative;overflow:hidden;border-top:2px solid var(--sg-border)!important}
.kpi-card:before{content:"";position:absolute;top:-1px;left:14px;width:22px;height:2px;background:var(--sg-primary)}
.kpi-icon{width:36px;height:36px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:.78rem}
.kpi-value{font-size:1.5rem;line-height:1;font-weight:600;letter-spacing:-.02em}
.kpi-label{color:var(--sg-muted);font-size:.61rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-family:var(--sg-font-display)}

.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;box-shadow:0 0 0 4px rgba(22,163,74,.08)}.status-dot.online{background:var(--sg-success)}.status-dot.offline{background:#98a2b3;box-shadow:0 0 0 4px rgba(152,162,179,.08)}.status-dot.critical{background:var(--sg-danger);box-shadow:0 0 0 4px rgba(217,45,32,.08)}.status-dot.warning{background:var(--sg-accent);box-shadow:0 0 0 4px rgba(232,163,23,.1)}
.status-dot.live{animation:sg-pulse 2.2s ease-in-out infinite}
.tank-gauge-card{border-radius:var(--sg-radius)!important;overflow:hidden;transition:border-color .14s,box-shadow .14s}.tank-gauge-card:hover{border-color:#c3cccb!important;box-shadow:0 4px 14px rgba(16,24,28,.06)!important}.tank-meta{font-size:.68rem;color:var(--sg-muted)}.tank-level{font-size:1.65rem;font-weight:650;letter-spacing:-.02em}
.progress{background:#E3E8E7!important;border-radius:5px!important;overflow:hidden;height:10px}.progress.progress-sm{height:8px}.progress.progress-lg{height:22px}.progress.progress-xl{height:26px}.progress-bar{border-radius:5px;min-width:0}.progress-bar[style*="--progress-width"]{width:var(--progress-width)!important}
.quick-action{text-decoration:none;color:inherit;border:1px solid var(--sg-border);border-radius:8px;padding:11px;display:flex;align-items:center;gap:10px;transition:border-color .14s,box-shadow .14s;background:#fff}.quick-action:hover{border-color:var(--sg-primary);color:inherit;box-shadow:0 3px 10px rgba(16,24,28,.06)}.quick-action i{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:7px;background:var(--sg-primary-soft);color:var(--sg-primary);font-size:.76rem}
.table-modern{vertical-align:middle}.table-modern thead th{color:var(--sg-muted);font-size:.61rem;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--sg-border);white-space:nowrap;font-family:var(--sg-font-display)}.table-modern tbody td{border-color:#eef1f1;font-size:.74rem}.table-modern tbody td.tabular,.table-modern tbody td .tabular{font-variant-numeric:tabular-nums}.message-cell{min-width:280px;max-width:460px}.metric-caption{font-size:.68rem;color:var(--sg-muted)}
.insight-card{border-left:3px solid var(--sg-primary)!important;transition:border-color .14s}.insight-card.warning{border-left-color:var(--sg-accent)!important}.insight-card.danger{border-left-color:var(--sg-danger)!important}.insight-card:hover{border-color:#c3cccb!important}

/* Public landing */
.hero-section{position:relative;overflow:hidden;background:radial-gradient(circle at 83% 16%,rgba(232,163,23,.18),transparent 24%),radial-gradient(circle at 15% 90%,rgba(14,124,116,.32),transparent 32%),linear-gradient(135deg,#0A1013,#101E1C 65%,#123A35);color:#fff}
.hero-inner{position:relative;z-index:1}.hero-title{font-size:clamp(2.4rem,5vw,4.4rem);line-height:1.02;font-weight:600;letter-spacing:-.025em;margin:18px 0 16px;max-width:820px}.hero-copy{font-size:.95rem;line-height:1.75;max-width:720px;font-family:var(--sg-font-body)}.hero-badge,.eyebrow{display:inline-flex;align-items:center;gap:7px;padding:5px 9px;border:1px solid rgba(255,255,255,.13);border-radius:6px;background:rgba(255,255,255,.05);font-size:.62rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-family:var(--sg-font-display)}.section-title{font-size:clamp(1.6rem,3vw,2.25rem);font-weight:600;letter-spacing:-.02em}.section-copy{font-size:.82rem;line-height:1.7}.section-copy-limit{max-width:680px}.landing-stat{padding:18px 10px;text-align:center;border-right:1px solid var(--sg-border)}.landing-stat strong{display:block;font-size:1.5rem;font-weight:650}.landing-stat span{display:block;color:var(--sg-muted);font-size:.68rem;margin-top:3px}.feature-card{height:100%;transition:border-color .14s}.feature-card:hover{border-color:#c3cccb!important}.icon-box{width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:var(--sg-primary-soft);color:var(--sg-primary);margin-bottom:14px}.hero-panel{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:18px;box-shadow:0 20px 55px rgba(0,0,0,.25)}.hero-metric{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:10px;padding:12px}.hero-metric span,.hero-metric small{display:block;color:rgba(255,255,255,.64);font-size:.65rem}.hero-metric strong{display:block;font-size:1.35rem;margin:3px 0}.hero-metric small{color:#7FD9C4}.hero-tank{padding:12px;border-radius:10px;background:rgba(0,0,0,.15);font-size:.72rem}.hero-event{display:flex;align-items:center;gap:10px;padding:11px;border-radius:10px;background:rgba(255,255,255,.04)}.hero-event>i{font-size:.8rem}.hero-event div{flex:1}.hero-event strong,.hero-event small{display:block}.hero-event small{color:rgba(255,255,255,.6);font-size:.65rem}
.gradient-callout{background:linear-gradient(120deg,var(--sg-primary-soft),var(--sg-accent-soft))!important}

/* Auth pages */
.auth-page{min-height:calc(100vh - 60px);display:flex;align-items:center;justify-content:center;padding:40px 18px;background:radial-gradient(circle at 15% 10%,rgba(14,124,116,.08),transparent 25%),radial-gradient(circle at 90% 80%,rgba(232,163,23,.09),transparent 25%),var(--sg-bg)}
.auth-wrap{width:min(560px,100%)}.auth-login-wrap{width:min(1060px,100%)}.auth-brand{display:flex;align-items:center;gap:10px;margin:0 auto 18px;width:max-content}.auth-brand strong,.auth-brand small{display:block}.auth-brand strong{font-size:.9rem;font-family:var(--sg-font-display)}.auth-brand small{font-size:.62rem;color:var(--sg-muted)}.auth-card{background:#fff;border:1px solid var(--sg-border);border-radius:12px;padding:26px;box-shadow:0 18px 55px rgba(16,24,28,.08)}.auth-card-head h1{font-size:1.5rem;font-weight:650;letter-spacing:-.02em;margin:12px 0 5px}.auth-card-head p{font-size:.75rem;color:var(--sg-muted);margin:0 0 20px}.auth-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:18px;align-items:stretch}.auth-showcase{border-radius:12px;padding:28px;background:var(--sg-sidebar);color:#fff;min-height:100%;display:flex;flex-direction:column;justify-content:center}.auth-showcase .eyebrow{color:#fff}.auth-showcase h1{font-size:2rem;line-height:1.05;letter-spacing:-.02em;margin:15px 0 12px}.auth-showcase>p{color:rgba(255,255,255,.66);font-size:.76rem;line-height:1.7}.showcase-points{display:grid;gap:13px;margin-top:20px}.showcase-points>div{display:flex;gap:10px;align-items:flex-start}.showcase-points>div>i{width:31px;height:31px;display:flex;align-items:center;justify-content:center;border-radius:7px;background:rgba(255,255,255,.07);color:#7FD9C4;font-size:.72rem}.showcase-points b,.showcase-points small{display:block}.showcase-points b{font-size:.72rem}.showcase-points small{color:rgba(255,255,255,.56);font-size:.64rem;margin-top:2px}.auth-divider{display:flex;align-items:center;gap:10px;color:#98a2b3;font-size:.65rem;margin:18px 0}.auth-divider:before,.auth-divider:after{content:"";height:1px;background:var(--sg-border);flex:1}.auth-foot,.auth-help,.auth-trust{font-size:.67rem;color:var(--sg-muted)}.auth-foot{text-align:center;margin-top:14px}.auth-help{display:flex;justify-content:center;gap:8px;margin-top:14px}.auth-trust{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:16px}.auth-trust span{display:inline-flex;align-items:center;gap:5px}.auth-trust i{color:var(--sg-primary)}

/* Alerts, lists, utility */
.list-group-item{border-color:#eef1f1;font-size:.74rem}.empty-state{text-align:center;padding:35px 18px;color:var(--sg-muted)}.empty-state i{font-size:1.5rem;margin-bottom:10px}.nowrap{white-space:nowrap}.overflow-auto-x{overflow-x:auto}.sticky-actions{position:sticky;bottom:0;background:rgba(255,255,255,.95);padding:10px 0;z-index:5;border-top:1px solid var(--sg-border)}

/* Custom alert UI — intentionally no SweetAlert */
.toast-stack{position:fixed;right:18px;bottom:18px;z-index:2000;display:grid;gap:8px}.smat-toast{min-width:260px;max-width:380px;background:var(--sg-sidebar);color:#fff;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:11px 13px;box-shadow:0 16px 40px rgba(16,24,28,.22);font-size:.75rem}.smat-toast.success{border-left:3px solid var(--sg-success)}.smat-toast.error{border-left:3px solid #ef5b5b}.smat-toast.warning{border-left:3px solid var(--sg-accent)}.confirm-panel{position:fixed;inset:0;background:rgba(10,16,19,.55);backdrop-filter:blur(3px);z-index:2050;display:grid;place-items:center;padding:18px}.confirm-box{width:min(430px,100%);background:#fff;border-radius:12px;padding:22px;box-shadow:0 25px 70px rgba(0,0,0,.22)}

/* Responsive */
@media(max-width:1199.98px){.portal-container{padding-top:20px}.hero-title{font-size:3.1rem}.landing-stat:nth-child(2){border-right:0}}
@media(max-width:991.98px){
  .portal-shell{display:block}.portal-sidebar{position:absolute;left:-250px;top:56px;z-index:1600;height:auto;max-height:none;transition:left .22s ease;box-shadow:15px 0 40px rgba(0,0,0,.18)}.portal-sidebar.open{left:0}.sidebar-overlay.open{display:block;position:fixed;inset:60px 0 0;background:rgba(10,16,19,.5);z-index:1500}
  .portal-mobile-bar{display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid var(--sg-border);padding:9px 13px;position:sticky;top:60px;z-index:1200}.portal-mobile-bar .btn{padding:.45rem .6rem}.portal-mobile-title{font-size:.75rem;font-weight:700;font-family:var(--sg-font-display)}.portal-mobile-role{font-size:.63rem;color:var(--sg-muted)}
  .portal-container{padding-top:18px;padding-bottom:24px}.auth-grid{grid-template-columns:1fr}.auth-showcase{display:none}.auth-login-wrap{width:min(560px,100%)}.hero-section .hero-title{max-width:680px}.hero-panel{margin-top:4px}
}
@media(max-width:767.98px){
  .container{--bs-gutter-x:1rem}.page-title-row{align-items:flex-start;flex-direction:column}.page-title-row .btn{width:100%}.card-body{padding:14px}.card-header{padding:12px 14px}.kpi-value{font-size:1.32rem}.kpi-label{font-size:.59rem}.table-modern tbody td{font-size:.7rem}.table-modern thead th{font-size:.57rem}.message-cell{min-width:240px}.landing-stat{border-right:0!important;border-bottom:1px solid var(--sg-border)}.landing-stat:nth-last-child(-n+2){border-bottom:0}.hero-section .row{--mdb-gutter-x:1rem}.hero-title{font-size:2.5rem}.hero-copy{font-size:.83rem}.hero-panel{padding:14px}.auth-page{padding:28px 12px}.auth-card{padding:20px}.auth-card-head h1{font-size:1.3rem}.auth-trust{gap:10px;font-size:.62rem}.modal-dialog{margin:.75rem}.modal-body{max-height:70vh;overflow-y:auto}
}
@media(max-width:575.98px){
  body{font-size:12.5px}.portal-main{width:100%}.portal-container{padding:15px 11px 22px}.page-heading{margin-bottom:15px}.page-heading h1{font-size:1.16rem}.page-heading p{font-size:.7rem}.kpi-value{font-size:1.2rem}.kpi-label{font-size:.56rem}.btn{font-size:.72rem}.btn-lg{font-size:.78rem}.form-control,.form-select{min-height:38px;font-size:.76rem}.form-label{font-size:.68rem}.hero-section .container{padding-top:38px!important;padding-bottom:38px!important}.hero-title{font-size:2.15rem}.hero-section .btn-lg{width:100%}.hero-section .d-flex.gap-4{gap:10px!important}.hero-section .d-flex.gap-4 span{font-size:.62rem}.smat-navbar{min-height:56px}.portal-sidebar{top:56px;height:auto}.portal-mobile-bar{top:56px}.sidebar-overlay.open{inset:56px 0 0}.toast-stack{right:10px;left:10px;bottom:10px}.smat-toast{min-width:0;max-width:none}.auth-page{min-height:calc(100vh - 56px)}.auth-brand{margin-bottom:13px}.auth-card{padding:17px}.auth-card-head h1{font-size:1.18rem}.auth-help{flex-wrap:wrap}.table-responsive{margin-right:-1px}.table td,.table th{padding:.58rem .55rem}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

.setup-container{max-width:700px;margin-left:auto;margin-right:auto}.contact-page{max-width:720px;margin-left:auto;margin-right:auto}.account-page{max-width:900px;margin-left:auto;margin-right:auto}.section-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}.section-toolbar h2,.section-toolbar h6{line-height:1.2}


/* =====================================================================
   SMATENERGY UI STABILITY PASS
   Keep page layouts predictable across MDB5 + Bootstrap utilities.
   ===================================================================== */
.container{width:100%;margin-left:auto;margin-right:auto;padding-left:var(--sg-gutter,1rem);padding-right:var(--sg-gutter,1rem)}
.portal-container{width:100%;max-width:1500px;margin-left:auto;margin-right:auto;padding-left:clamp(14px,2vw,24px);padding-right:clamp(14px,2vw,24px)}
.page-content{min-width:0}.page-heading,.page-title-row{min-width:0}.page-heading h1,.page-title-row h1{overflow-wrap:anywhere}
.card{min-width:0;overflow:hidden}.card-body{min-width:0}.row{min-width:0}.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table{min-width:640px}.table-modern{min-width:720px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.3rem}.btn i{line-height:1}.form-control,.form-select{width:100%}.input-group>.btn{flex:0 0 auto}.modal{--mdb-modal-margin:1rem}.modal-dialog{width:auto;max-width:calc(100% - 2rem)}
.status-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid #d7dede;border-radius:5px;padding:4px 8px;font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.035em;background:#F4F6F6;color:#475047;white-space:nowrap;font-family:var(--sg-font-display)}.status-pill.active,.status-pill.normal,.status-pill.online{background:#ecfdf3;border-color:#b7ebcc;color:#087443}.status-pill.warning{background:var(--sg-accent-soft);border-color:#eecb85;color:#8a5f0c}.status-pill.critical,.status-pill.danger,.status-pill.fault{background:#fff1f0;border-color:#ffc7c3;color:#b42318}.status-pill.offline,.status-pill.suspended{background:#f0f2f2;border-color:#dbe1e1;color:var(--sg-muted)}.status-pill.provisioned{background:var(--sg-primary-soft);border-color:#b9dcd8;color:var(--sg-primary-dark)}
.device-secret{padding:12px;border:1px dashed #b9c9c7;border-radius:8px;background:#F7F9F9}.device-secret code{font-size:.82rem;word-break:break-all}.gradient-callout{overflow:hidden}

/* Tank gauges — graduated scale, like a real dip readout */
.tank-visual{height:250px;position:relative;border-radius:14px;background:linear-gradient(180deg,#F0F3F3,#E4E9E8);overflow:hidden;border:1px solid var(--sg-border);display:flex;align-items:flex-end;justify-content:center}
.tank-visual:before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(to top,rgba(16,24,28,.05) 0,rgba(16,24,28,.05) 1px,transparent 1px,transparent 10%);pointer-events:none;z-index:2}
.tank-fill{position:absolute;inset:auto 0 0;background:linear-gradient(180deg,#2FA894,var(--sg-primary));transition:height .4s ease}.tank-fill.warning{background:linear-gradient(180deg,#F2BE55,var(--sg-accent))}.tank-fill.critical{background:linear-gradient(180deg,#f87171,#dc2626)}.tank-fill.offline{background:#98a2b3}
.tank-visual-content{position:relative;z-index:3;text-align:center;margin-bottom:70px;text-shadow:0 1px 2px rgba(255,255,255,.6)}.tank-visual .tank-level{font-size:3rem;line-height:1;font-weight:650;color:#101828}.tank-volume{font-size:.8rem;color:#475467;margin-top:7px;font-weight:600}
.detail-stat{border:1px solid #E4E9E8;border-radius:8px;padding:11px;background:#FAFBFB;height:100%}.detail-stat span{display:block;color:var(--sg-muted);font-size:.62rem;text-transform:uppercase;font-weight:700;letter-spacing:.05em;font-family:var(--sg-font-display)}.detail-stat strong{display:block;font-size:1rem;margin-top:5px}
.device-mini{display:flex;gap:10px;align-items:center;border:1px solid #E4E9E8;background:#FAFBFB;border-radius:8px;padding:10px}.device-mini>i{width:34px;height:34px;border-radius:7px;background:var(--sg-primary-soft);color:var(--sg-primary);display:grid;place-items:center}.device-mini strong,.device-mini small{display:block}.device-mini small{font-size:.65rem;color:var(--sg-muted);margin-top:2px}
.tank-gauge-card{position:relative}.tank-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.tank-level-panel{position:relative;height:112px;border-radius:10px;overflow:hidden;background:#E9EDEC;border:1px solid var(--sg-border);margin:13px 0 10px;display:flex;align-items:center;justify-content:center}
.tank-level-panel:before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(to top,rgba(16,24,28,.055) 0,rgba(16,24,28,.055) 1px,transparent 1px,transparent 12.5%);pointer-events:none;z-index:2}
.tank-level-fill{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(180deg,#2FA894,var(--sg-primary));opacity:.97}.tank-level-fill.warning{background:linear-gradient(180deg,#F2BE55,var(--sg-accent))}.tank-level-fill.critical{background:linear-gradient(180deg,#f87171,#dc2626)}.tank-level-fill.offline{background:#98a2b3}
.tank-level-value{position:relative;z-index:3;font-size:1.85rem;font-weight:650;color:#101828}.tank-level-volume{position:absolute;z-index:3;top:60%;font-size:.62rem;color:#475467;font-weight:600}
.tank-card-footer{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:.63rem;color:var(--sg-muted)}.tank-card-actions{display:flex;gap:6px;align-items:center}.tank-card-actions .btn{padding:.34rem .55rem}
@media(min-width:576px){.container{--sg-gutter:1.5rem}}
@media(min-width:768px){.container{--sg-gutter:1.5rem}}
@media(min-width:992px){.portal-container{padding-left:clamp(18px,2vw,28px);padding-right:clamp(18px,2vw,28px)}.modal-dialog{max-width:var(--mdb-modal-width,500px)}}
@media(max-width:767.98px){.portal-container{padding-left:12px;padding-right:12px}.page-title-row .btn{width:auto}.table{min-width:620px}.table-modern{min-width:700px}.tank-visual{height:210px}.tank-visual .tank-level{font-size:2.5rem}.tank-card-footer{flex-wrap:wrap}.modal-dialog{max-width:calc(100% - 1rem);margin:.5rem auto}.modal-content{max-height:calc(100vh - 1rem)}.modal-body{overflow-y:auto}.device-mini{align-items:flex-start}}
@media(max-width:575.98px){.portal-container{padding-left:10px;padding-right:10px}.page-title-row .btn{width:100%}.tank-level-panel{height:105px}.tank-level-value{font-size:1.65rem}.tank-level-volume{font-size:.58rem}.card-body{padding:13px}.container{--sg-gutter:1rem}}

/* =====================================================================
   SMATENERGY REDESIGN — 2026 visual layer
   ===================================================================== */
:root{
  --sg-primary:#087f73;--sg-primary-dark:#045c54;--sg-accent:#f2b21b;
  --sg-ink:#0b1720;--sg-muted:#61707b;--sg-bg:#f3f6f6;--sg-border:#e1e8e7;
  --sg-sidebar:#0a171a;--sg-radius:12px;
}
body{font-size:13px;background:#f3f6f6!important}
.smat-navbar{min-height:66px;background:#0a171a!important;border-bottom:1px solid rgba(255,255,255,.08)}
.smat-brand{font-size:1.05rem;letter-spacing:.04em}.smat-brand-mark{width:35px;height:35px;border-radius:10px}
.smat-navbar .nav-link{font-size:.77rem;padding:.55rem .7rem}
.portal-sidebar{width:252px;flex-basis:252px;padding:14px 12px 0;background:#0a171a;top:66px;height:calc(100vh - 66px)}
.portal-shell{min-height:calc(100vh - 66px)}
.portal-brand{padding:9px 11px 17px;margin-bottom:5px;border-bottom:1px solid rgba(255,255,255,.09)}
.portal-brand-link{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font:700 1.15rem var(--sg-font-display);letter-spacing:.05em}
.portal-brand-mark{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:11px;background:linear-gradient(135deg,#0c8f82,#0a6059);box-shadow:0 8px 24px rgba(0,0,0,.25)}
.portal-brand small{display:block;color:#7f9290;font:700 .5rem var(--sg-font-display);letter-spacing:.16em;margin:7px 0 0 49px}
.portal-nav a{padding:10px 11px;margin:3px 0;border-radius:9px;font-size:.75rem}
.portal-nav a.active{background:rgba(8,127,115,.16);box-shadow:inset 3px 0 0 var(--sg-accent);color:#fff}
.portal-nav a i{width:18px}
.portal-main{background:linear-gradient(180deg,#f7f9f9 0,#f3f6f6 260px)}
.portal-container{padding-top:30px;padding-bottom:42px}
.page-heading{margin-bottom:24px}.page-heading h1,.page-title-row h1{font-size:1.55rem;font-weight:700}.page-heading p{font-size:.8rem}
.kpi-card{border:1px solid #e2e9e8!important;border-top:0!important;border-radius:14px!important;box-shadow:0 5px 18px rgba(13,31,34,.045)!important}
.kpi-card:before{top:0;left:0;width:48px;height:3px;border-radius:0 0 4px 0}
.kpi-card .card-body{padding:19px}.kpi-icon{width:40px;height:40px;border-radius:11px}.kpi-value{font-size:1.7rem}
.card{box-shadow:0 4px 18px rgba(13,31,34,.04)!important}
.insight-card{border-radius:11px!important;background:#fbfcfc!important}.quick-action{border:1px solid #e1e8e7;border-radius:12px!important;background:#fff;box-shadow:0 3px 12px rgba(13,31,34,.035);padding:13px 14px}
.quick-action:hover{border-color:#a8cfca;background:#fbfefe}
.tank-gauge-card{border-radius:14px!important}.tank-level-panel{border-radius:10px!important}
.table-modern thead th{background:#f7f9f9!important;color:#64727a!important;font-size:.62rem;text-transform:uppercase;letter-spacing:.07em}
.portal-footer{background:#fff;border-top:1px solid #e1e8e7;padding:11px 18px;color:#7a878d;font-size:.68rem}
.portal-footer .container-fluid{display:flex;justify-content:space-between;gap:10px}

/* Landing page */
.sg-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 85% 20%,rgba(14,139,128,.24),transparent 28%),linear-gradient(135deg,#071417 0%,#0b2427 58%,#0a171a 100%);color:#fff}
.sg-hero-grid{position:absolute;inset:0;opacity:.2;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(90deg,#000,transparent 90%)}
.sg-hero .container{z-index:1}.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(255,255,255,.045);font:700 .59rem var(--sg-font-display);letter-spacing:.13em;color:#b9cfcc}
.hero-live-dot{width:7px;height:7px;border-radius:50%;background:#37c78a;box-shadow:0 0 0 4px rgba(55,199,138,.12)}
.sg-hero .hero-title{font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.02;font-weight:700;max-width:760px;margin:22px 0 20px;letter-spacing:-.045em}
.sg-hero .hero-title span{color:#45c5b8}.hero-copy{font-size:1rem;line-height:1.75;max-width:680px;color:#b8c8c8!important}
.hero-trust-row{display:flex;flex-wrap:wrap;gap:20px;margin-top:23px;color:#8ea19f;font-size:.68rem}.hero-trust-row i{color:#36bf91;margin-right:5px}
.hero-console{padding:19px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(8,22,25,.75);box-shadow:0 25px 70px rgba(0,0,0,.28);backdrop-filter:blur(12px)}
.console-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.console-head span:first-child{display:block;color:#77908d;font:700 .55rem var(--sg-font-display);letter-spacing:.14em}.console-head strong{display:block;font:600 1rem var(--sg-font-display);margin-top:4px}.console-live{font-size:.56rem!important;color:#61d2a2!important;letter-spacing:.08em}.console-live i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#4ad095;margin-right:5px}
.console-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.console-metric{padding:12px;border-radius:10px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.055)}.console-metric span,.console-metric small{display:block;color:#829694;font-size:.58rem}.console-metric strong{display:block;font:600 1.25rem var(--sg-font-display);margin:5px 0}.console-metric small.up{color:#56c99b}.console-section-label{color:#6f8582;font:700 .53rem var(--sg-font-display);letter-spacing:.13em;margin:18px 0 8px}.console-tank{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.07)}.console-tank>div{display:flex;justify-content:space-between;color:#dce7e6;font-size:.65rem}.console-tank strong{font-family:var(--sg-font-display)}.console-progress{height:6px!important;background:#213538!important;border-radius:99px!important;margin:7px 0}.console-progress i{display:block;height:100%;border-radius:99px;background:#16a495}.console-tank small{font-size:.56rem;color:#718784}.console-alert{display:flex;align-items:center;gap:9px;margin-top:13px;padding:10px;border-radius:10px;background:rgba(242,178,27,.08);border:1px solid rgba(242,178,27,.15)}.alert-icon{width:29px;height:29px;border-radius:8px;display:grid;place-items:center;background:rgba(242,178,27,.13);color:#f2b21b;font-size:.7rem}.console-alert strong,.console-alert small{display:block}.console-alert strong{font-size:.65rem}.console-alert small{font-size:.55rem;color:#899a98}.alert-arrow{margin-left:auto;color:#d6ad47;font-size:1.2rem}
.sg-proof-strip{background:#fff;border-bottom:1px solid #e6eceb}.proof-item{text-align:center;padding:23px 10px;border-right:1px solid #edf1f0}.proof-item strong{display:block;font:700 1.35rem var(--sg-font-display);color:#0b4e49}.proof-item span{display:block;color:#718087;font-size:.65rem;margin-top:3px}
.sg-section{padding:92px 0}.sg-light{background:#f5f8f7}.section-intro{max-width:700px;margin-bottom:42px}.section-intro.centered{text-align:center;margin-left:auto;margin-right:auto}.section-kicker{display:inline-block;color:#087f73;font:800 .6rem var(--sg-font-display);letter-spacing:.15em}.sg-dark .section-kicker{color:#5dd0c2}.section-intro h2,.sg-dark h2{font:700 clamp(2rem,3.4vw,3rem) var(--sg-font-display);line-height:1.08;letter-spacing:-.04em;margin:12px 0 15px}.section-intro p,.sg-dark p{color:#65747b;line-height:1.75;max-width:650px}.platform-feature{height:100%;display:flex;gap:22px;padding:34px;border:1px solid #dfe8e6;border-radius:17px;background:#fff;box-shadow:0 12px 35px rgba(15,44,43,.05)}.feature-number{font:700 .7rem var(--sg-font-display);color:#93a09e}.feature-icon,.role-icon{width:50px;height:50px;display:grid;place-items:center;border-radius:13px;background:#e5f4f2;color:#087f73;font-size:1rem;margin-bottom:18px}.platform-feature h3{font:700 1.4rem var(--sg-font-display);margin-bottom:10px}.platform-feature p{color:#66757b;line-height:1.75}.feature-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.feature-points span{padding:7px 9px;border-radius:7px;background:#f3f7f6;color:#506168;font-size:.62rem}.feature-points i{color:#087f73;margin-right:4px}.platform-stack{display:grid;gap:10px}.platform-stack>div{padding:21px;border-radius:14px;background:#fff;border:1px solid #e0e8e7}.platform-stack i{color:#087f73;font-size:1rem}.platform-stack h4{font:700 .9rem var(--sg-font-display);margin:10px 0 5px}.platform-stack p{font-size:.68rem;color:#718087;margin:0;line-height:1.65}
.role-card{height:100%;padding:26px;border:1px solid #e1e8e7;border-radius:15px;background:#fff;transition:transform .18s ease,box-shadow .18s ease}.role-card:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(15,44,43,.07)}.role-card>span{color:#a0adaa;font:700 .56rem var(--sg-font-display);letter-spacing:.1em}.role-card h3{font:700 1rem var(--sg-font-display);margin:7px 0}.role-card p{color:#6a787d;font-size:.69rem;line-height:1.7;min-height:70px}.role-card a{font-size:.64rem;font-weight:700;color:#087f73;text-decoration:none}.role-card a i{margin-left:5px}
.sg-dark{background:#0a171a;color:#fff}.sg-dark p{color:#9badab}.benefit-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.benefit-grid>div{padding:23px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.035);border-radius:14px}.benefit-grid i{color:#46c5b7;font-size:1rem}.benefit-grid h4{font:700 .85rem var(--sg-font-display);margin:12px 0 5px}.benefit-grid p{font-size:.64rem;margin:0;line-height:1.65}
.process-row{display:flex;align-items:stretch;justify-content:center}.process-step{flex:1;text-align:center;max-width:220px}.process-step>b{font:700 .58rem var(--sg-font-display);color:#99a7a5}.process-icon{width:54px;height:54px;margin:9px auto 13px;display:grid;place-items:center;border-radius:50%;background:#fff;border:1px solid #dfe8e6;color:#087f73;box-shadow:0 7px 20px rgba(15,44,43,.05)}.process-step h3{font:700 .9rem var(--sg-font-display);margin:0 0 5px}.process-step p{font-size:.64rem;color:#748187;line-height:1.6}.process-line{height:1px;background:#d8e2e0;flex:0 0 7%;margin-top:37px}
.sg-cta{padding:0 0 82px;background:#f5f8f7}.cta-panel{padding:44px 48px;border-radius:20px;background:linear-gradient(125deg,#0b4f4a,#087f73);display:flex;align-items:center;justify-content:space-between;gap:30px;color:#fff;box-shadow:0 20px 45px rgba(8,86,78,.18)}.cta-panel h2{font:700 2rem var(--sg-font-display);margin:10px 0 7px}.cta-panel p{margin:0;color:#c0ddda;font-size:.72rem}
.sg-footer{background:#071114;color:#9eafad;padding:62px 0 22px}.footer-main{display:grid;grid-template-columns:2fr 1fr 1fr 1.25fr;gap:45px;padding-bottom:45px}.footer-brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font:700 1.15rem var(--sg-font-display);letter-spacing:.05em}.footer-mark{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#087f73;color:#fff}.footer-brand-col p{font-size:.67rem;line-height:1.8;max-width:310px;margin:16px 0}.footer-socials{display:flex;gap:8px}.footer-socials a{width:30px;height:30px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#a8bab7;text-decoration:none;font-size:.65rem}.footer-col h4{color:#fff;font:700 .68rem var(--sg-font-display);text-transform:uppercase;letter-spacing:.1em;margin:3px 0 15px}.footer-col>a{display:block;color:#91a3a0;text-decoration:none;font-size:.66rem;margin:10px 0}.footer-col>a:hover{color:#fff}.footer-contact>div{display:flex;gap:10px;margin:10px 0;font-size:.65rem}.footer-contact>div i{color:#44c4b7;margin-top:3px}.footer-contact small{color:#697c79;font-size:.56rem}.footer-contact-btn{margin-top:16px!important;color:#fff!important}.footer-contact-btn i{margin-left:6px}.footer-bottom{display:flex;justify-content:space-between;gap:15px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08);font-size:.58rem}.footer-bottom div{display:flex;gap:8px}
@media(max-width:991px){.portal-sidebar{width:230px;flex-basis:230px}.sg-hero .hero-title{font-size:3.1rem}.footer-main{grid-template-columns:1.5fr 1fr 1fr}.footer-contact{grid-column:2}.cta-panel{padding:35px}}
@media(max-width:767px){.portal-brand{display:none}.sg-hero .hero-title{font-size:2.55rem}.hero-console{margin-top:5px}.sg-section{padding:65px 0}.platform-feature{padding:24px}.process-row{flex-direction:column;align-items:center;gap:5px}.process-line{width:1px;height:30px;flex:none;margin:0}.process-step{max-width:300px}.benefit-grid{grid-template-columns:1fr}.cta-panel{flex-direction:column;align-items:flex-start;padding:30px}.footer-main{grid-template-columns:1fr 1fr;gap:30px}.footer-brand-col{grid-column:1/-1}.footer-contact{grid-column:auto}.footer-bottom{flex-direction:column}.footer-bottom div{flex-wrap:wrap}}


/* Final navigation + landing spacing fixes */
.smat-navbar-toggler{display:none;align-items:center;justify-content:center;width:42px;height:40px;border:1px solid rgba(255,255,255,.28)!important;border-radius:8px!important;background:rgba(255,255,255,.06)!important;color:#fff!important;font-size:1.05rem;line-height:1;padding:0!important;box-shadow:none!important}
.smat-navbar-toggler:focus{outline:2px solid rgba(255,193,7,.75);outline-offset:2px}
.landing-main{padding:0!important;margin:0!important}
.sg-hero{margin-top:0!important}
@media(max-width:991px){.smat-navbar-toggler{display:inline-flex}.smat-navbar .navbar-collapse{padding:10px 0 14px}.smat-navbar .navbar-nav{align-items:stretch!important}.smat-navbar .nav-item{width:100%}.smat-navbar .nav-link{padding:.7rem .8rem}.smat-navbar .btn{margin-left:0!important;margin-top:4px}.portal-mobile-bar{z-index:1200}}

/* Dashboard compact navigation — keep the full sidebar visible without scrolling on desktop */
@media (min-width: 992px){
  .portal-sidebar{
    width:218px;
    flex-basis:218px;
    padding:10px 8px 0;
    position:static;
    top:auto;
    height:auto!important;
    min-height:calc(100vh - 66px);
    align-self:stretch;
  }
  .portal-brand{padding:6px 8px 10px;margin-bottom:3px}
  .portal-brand-link{gap:8px;font-size:1rem}
  .portal-brand-mark{width:32px;height:32px;border-radius:9px;font-size:.78rem}
  .portal-brand small{font-size:.43rem;letter-spacing:.13em;margin:5px 0 0 40px}
  .portal-sidebar > .px-2{padding-left:8px!important;padding-right:8px!important;margin-bottom:6px!important}
  .portal-sidebar-label{padding:8px 8px 4px;font-size:.53rem;letter-spacing:.11em}
  .portal-nav a{gap:8px;padding:6px 8px;margin:1px 0;border-radius:7px;font-size:.69rem;line-height:1.15}
  .portal-nav a i{width:16px;font-size:.68rem}
  .portal-sidebar-label.mt-3{margin-top:8px!important}
  .sidebar-status{padding:9px 8px;font-size:.56rem}
}

@media (min-width: 992px) and (max-height: 760px){
  .portal-brand{padding-bottom:7px}
  .portal-brand-link{font-size:.94rem}
  .portal-brand-mark{width:29px;height:29px}
  .portal-brand small{margin-top:3px}
  .portal-sidebar > .px-2{font-size:.68rem!important}
  .portal-sidebar-label{padding-top:6px;padding-bottom:3px}
  .portal-nav a{padding:5px 7px;font-size:.65rem}
  .portal-nav a i{font-size:.63rem}
  .sidebar-status{padding:7px 8px}
}

.report-stat-card{height:100%;padding:12px 13px;border:1px solid var(--sg-border);border-radius:9px;background:#fff}.report-stat-value{font-size:1.05rem;font-weight:700;letter-spacing:-.02em;margin-top:5px}.report-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--sg-border)}.report-row:last-child{border-bottom:0}.portal-sidebar .portal-brand small{font-size:.52rem}.portal-sidebar .portal-brand-link{gap:8px}.portal-sidebar .portal-brand-mark{width:28px;height:28px}.portal-sidebar > .px-2{margin-bottom:.4rem!important}

/* Granular access control */
.access-user-picker,.access-permission-card{border:1px solid var(--sg-border)!important;box-shadow:0 8px 24px rgba(15,44,43,.045)}
.access-target-summary{display:flex;align-items:center;gap:10px;min-height:42px;padding:8px 10px;border:1px solid var(--sg-border);border-radius:9px;background:#f8fbfa}
.access-avatar,.access-empty-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:#e5f4f2;color:#087f73;flex:0 0 auto}
.access-target-summary strong,.access-target-summary span{display:block}.access-target-summary strong{font-size:.76rem}.access-target-summary div:nth-child(2) span{font-size:.61rem;color:#718087;margin-top:2px}
.access-note{font-size:.69rem;line-height:1.6;border:0;background:#edf7f6;color:#47615e}
.access-permission-card .card-header{display:flex;justify-content:space-between;align-items:center;background:#f7faf9;border-bottom:1px solid var(--sg-border);font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}
.access-permission-card .card-header small{font-size:.58rem;font-weight:600;text-transform:none;letter-spacing:0;color:#81908e}
.access-permission-row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:13px 15px!important}
.access-permission-info{min-width:0}.access-permission-info strong{font-size:.72rem}.access-permission-info small{display:block;color:#728087;font-size:.6rem;margin-top:3px;line-height:1.45}.access-permission-info code{display:inline-block;color:#6f8582;font-size:.51rem;margin-top:4px;background:#f4f7f6;padding:2px 5px;border-radius:4px}
.access-live-dot{width:6px;height:6px;border-radius:50%;background:#0b9588;display:inline-block}.access-control-select{width:145px;flex:0 0 145px}.access-control-select .form-select{font-size:.64rem}.access-control-select small{display:block;font-size:.52rem;margin-top:4px;text-align:right}
.access-permission-disabled{opacity:.58}.access-empty-icon{width:48px;height:48px;margin:auto;font-size:1.1rem}
@media(max-width:767px){.access-permission-row{align-items:flex-start;flex-direction:column}.access-control-select{width:100%;flex-basis:auto}.access-target-summary .status-pill{font-size:.52rem}.access-note{font-size:.65rem}}


/* 2026 dashboard refinement: compact typography + contextual smart insights */
.portal-main, .portal-sidebar { font-size: .93rem; }
.portal-sidebar-label { font-size: .68rem; letter-spacing: .1em; }
.portal-nav a { font-size: .86rem; padding: .62rem .72rem; }
.portal-nav a i { font-size: .84rem; width: 1.15rem; }
.portal-container h1.h4 { font-size: 1.22rem; }
.portal-container h2.h5 { font-size: 1.05rem; }
.portal-container .card-body { font-size: .9rem; }
.portal-container .form-label, .portal-container .form-control, .portal-container .form-select,
.portal-container .btn { font-size: .86rem; }
.portal-container .table { font-size: .84rem; }
.smart-insights { overflow: hidden; background: linear-gradient(135deg,#fff 0%,#fff9f9 100%); }
.smart-insights-head { display:flex; align-items:center; justify-content:space-between; padding:1rem 1.1rem .75rem; border-bottom:1px solid rgba(152,0,0,.08); }
.smart-insights-head h2 { margin:.2rem 0 0; font-size:1rem; font-weight:700; color:#202124; }
.smart-insights-eyebrow { color:#980000; font-size:.64rem; font-weight:800; letter-spacing:.11em; }
.smart-insights-live { font-size:.68rem; color:#667085; display:flex; align-items:center; gap:.35rem; }
.smart-insights-live span { width:7px;height:7px;border-radius:50%;background:#198754;display:inline-block;box-shadow:0 0 0 3px rgba(25,135,84,.12); }
.smart-insights-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem; padding:.75rem; }
.smart-insight { display:flex; align-items:flex-start; gap:.65rem; padding:.75rem; border:1px solid #edf0f2; border-radius:.8rem; text-decoration:none; color:inherit; background:#fff; transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease; min-width:0; }
.smart-insight:hover { transform:translateY(-1px); box-shadow:0 .35rem 1rem rgba(16,24,40,.08); border-color:rgba(152,0,0,.2); }
.smart-insight-icon { width:28px;height:28px;flex:0 0 28px;border-radius:8px;display:grid;place-items:center;background:#f6f7f8;color:#980000;font-size:.72rem; }
.smart-insight-copy { min-width:0; display:flex; flex-direction:column; gap:.2rem; }
.smart-insight-copy strong { font-size:.76rem; line-height:1.25; }
.smart-insight-copy small { font-size:.69rem; line-height:1.35; color:#667085; }
.smart-insight-arrow { margin-left:auto; font-size:.62rem; color:#98a2b3; padding-top:.15rem; }
.smart-danger .smart-insight-icon { color:#b42318;background:#fef3f2; }
.smart-warning .smart-insight-icon { color:#b54708;background:#fffaeb; }
.subscription-plan-option input { position:absolute; opacity:0; pointer-events:none; }
.subscription-plan-option input:checked + span { border-color:#980000 !important; box-shadow:0 0 0 2px rgba(152,0,0,.08); background:#fffafa; }
@media (max-width: 991.98px) {
  .smart-insights-grid { grid-template-columns:1fr; }
  .portal-main, .portal-sidebar { font-size:.91rem; }
}

/* Platform settings: tabbed configuration UI */
.settings-tabs{overflow:hidden}
.settings-tabbar{display:flex;gap:.25rem;padding:.55rem;background:#f7f9f9;border-bottom:1px solid var(--sg-border);overflow-x:auto}
.settings-tab{appearance:none;border:0;background:transparent;border-radius:8px;padding:.72rem .9rem;display:flex;align-items:center;gap:.55rem;color:#667085;min-width:170px;text-align:left;cursor:pointer;transition:.16s ease}
.settings-tab i{font-size:.8rem;color:#980000;width:18px;text-align:center}
.settings-tab span{font-size:.78rem;font-weight:700;color:#344054}
.settings-tab small{display:block;font-size:.58rem;color:#98a2b3;margin-left:auto;white-space:nowrap}
.settings-tab:hover{background:#fff}
.settings-tab.active{background:#fff;box-shadow:0 2px 8px rgba(16,24,40,.07);color:#980000}
.settings-tab.active span{color:#980000}
.settings-tabpanel{display:none;padding:1.25rem}
.settings-tabpanel.active{display:block}
.settings-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.1rem}
.settings-panel-head h2{font-size:1rem;font-weight:700;margin:0 0 .25rem}
.settings-panel-head p{font-size:.72rem;color:#667085;margin:0;max-width:680px}
.settings-status{font-size:.62rem;color:#667085;background:#f5f7f7;border:1px solid var(--sg-border);border-radius:999px;padding:.4rem .65rem;white-space:nowrap}
.settings-status i{color:#980000;margin-right:.25rem}
.gateway-divider{display:flex;align-items:center;gap:.6rem;margin:1.1rem 0 .7rem;color:#980000;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.gateway-divider:after{content:"";height:1px;background:var(--sg-border);flex:1}
.settings-note{display:flex;align-items:flex-start;gap:.55rem;margin-top:1rem;padding:.65rem .75rem;background:#f8fafb;border:1px solid #edf0f2;border-radius:8px;color:#667085;font-size:.64rem;line-height:1.45}
.settings-note i{color:#980000;margin-top:.1rem}
.settings-plan-table{font-size:.82rem}
.settings-plan-table th{font-size:.65rem;text-transform:uppercase;letter-spacing:.06em;color:#667085}
.settings-plan-table td{padding:.8rem .65rem}
.settings-tabpanel .form-label{font-size:.68rem;font-weight:600}
@media(max-width:767px){.settings-tab{min-width:145px;padding:.65rem .7rem}.settings-tab small{display:none}.settings-tabpanel{padding:.9rem}.settings-panel-head{flex-direction:column}.settings-status{align-self:flex-start}.settings-plan-table{min-width:620px}}


/* Native interaction layer: intentionally independent of MDB JavaScript. */
#mainNavToggle { cursor:pointer; }
#mainNav.show { display:block !important; }
#profileMenuToggle { cursor:pointer; }
.smat-navbar .dropdown.show > .dropdown-menu { display:block; }
.smat-navbar .dropdown-menu { position:absolute; right:0; }
.settings-tab { position:relative; z-index:2; pointer-events:auto !important; }
.settings-tabpanel { visibility:hidden; height:0; overflow:hidden; padding-top:0; padding-bottom:0; }
.settings-tabpanel.active { visibility:visible; height:auto; overflow:visible; padding-top:1.25rem; padding-bottom:1.25rem; }
@media (max-width: 991.98px) {
  .smat-navbar .navbar-collapse { display:none !important; }
  .smat-navbar .navbar-collapse.show { display:block !important; }
  .smat-navbar .navbar-nav { display:flex; }
}
@media (min-width: 992px) {
  .smat-navbar .navbar-collapse { display:flex !important; }
}

/* Legal + privacy surfaces */
.legal-page{padding:72px 0 90px;background:#f6f8fb;min-height:70vh}.legal-hero{max-width:820px;padding:48px 0 38px}.legal-hero h1{font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.045em;margin:8px 0 14px}.legal-hero p{font-size:1rem;color:#64748b;line-height:1.75;margin-bottom:10px}.legal-hero small{color:#94a3b8}.legal-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start}.legal-card,.legal-aside{background:#fff;border:1px solid #e7ebf0;border-radius:20px;box-shadow:0 12px 35px rgba(15,23,42,.06)}.legal-card{padding:30px}.legal-card section+section{border-top:1px solid #edf0f3;margin-top:26px;padding-top:26px}.legal-card h2{font-size:1rem;margin:0 0 8px;color:#111827}.legal-card p{font-size:.88rem;line-height:1.75;color:#64748b;margin:0}.legal-aside{padding:22px;position:sticky;top:90px}.legal-aside strong{font-size:.92rem}.legal-aside p{font-size:.8rem;color:#64748b;line-height:1.6}.footer-cookie-link{border:0;background:transparent;padding:0;text-align:left;color:inherit;font:inherit;cursor:pointer}.cookie-banner{position:fixed;left:20px;right:20px;bottom:20px;z-index:5000;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:18px 20px;background:#101722;color:#fff;border:1px solid rgba(255,255,255,.1);border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.25)}.cookie-banner p{font-size:.76rem;color:#cbd5e1;margin:4px 0 0;max-width:760px;line-height:1.55}.cookie-actions{display:flex;gap:8px;flex-shrink:0}.cookie-modal{position:fixed;inset:0;z-index:5100;background:rgba(2,6,23,.62);display:grid;place-items:center;padding:20px}.cookie-dialog{position:relative;width:min(520px,100%);background:#fff;border-radius:22px;padding:30px;box-shadow:0 30px 90px rgba(0,0,0,.28)}.cookie-dialog h2{font-size:1.35rem;margin:7px 0}.cookie-dialog>p{font-size:.82rem;color:#64748b;line-height:1.65}.cookie-close{position:absolute;right:16px;top:12px;border:0;background:transparent;font-size:28px;color:#64748b;cursor:pointer}.cookie-option{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:15px 0;border-top:1px solid #edf0f3}.cookie-option strong{display:block;font-size:.85rem}.cookie-option small{display:block;color:#64748b;font-size:.72rem;margin-top:3px}.cookie-option input{width:18px;height:18px;accent-color:#111827}.cookie-dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}@media(max-width:800px){.legal-layout{grid-template-columns:1fr}.legal-aside{position:static}.cookie-banner{left:10px;right:10px;bottom:10px;flex-direction:column;align-items:stretch}.cookie-actions{justify-content:flex-end}}

/* SMATENERGY compact typography override */
:root{font-size:14px}
body{font-size:12px;line-height:1.45}
.smat-navbar .nav-link{font-size:.68rem}
.smat-brand{font-size:.92rem}
.portal-brand-link{font-size:1rem}
.portal-nav a{font-size:.68rem;padding:8px 10px}
.portal-mobile-title{font-size:.68rem}.portal-mobile-role{font-size:.57rem}
.page-heading{margin-bottom:16px}
.page-heading h1,.page-title-row h1{font-size:1.22rem;line-height:1.25}
.page-heading p{font-size:.68rem}
.eyebrow{font-size:.55rem}
.card-body{font-size:.72rem}
.card-header{font-size:.7rem}
.kpi-value{font-size:1.38rem}
.kpi-label{font-size:.54rem}
.kpi-card .card-body{padding:14px}
.table,.table td,.table th{font-size:.66rem}
.table-modern tbody td{font-size:.64rem}
.table-modern thead th{font-size:.53rem}
.form-label{font-size:.62rem}
.form-control,.form-select{font-size:.7rem;min-height:36px}
.form-check-label{font-size:.66rem}
.btn{font-size:.66rem;padding:.42rem .68rem}
.btn-lg{font-size:.72rem}
.small,.small *{font-size:.62rem!important}
.text-muted{font-size:inherit}
.alert{font-size:.68rem;padding:.65rem .8rem}
.badge{font-size:.56rem}
.status-pill{font-size:.55rem;padding:3px 7px}
.metric-caption{font-size:.62rem}
.section-toolbar h2,.section-toolbar h6{font-size:.72rem}
.detail-stat span{font-size:.55rem}.detail-stat strong{font-size:.88rem}
.device-mini small{font-size:.58rem}.device-mini strong{font-size:.7rem}
.tank-level-value{font-size:1.65rem}.tank-volume{font-size:.68rem}.tank-card-footer{font-size:.58rem}
.portal-footer{font-size:.6rem}
/* Landing page compact type */
.hero-title{font-size:2.7rem;line-height:1.02}
.hero-copy{font-size:.76rem}
.hero-badge{font-size:.55rem}
.landing-stat{font-size:.7rem}.landing-stat strong{font-size:1.15rem}
.sg-hero h2,.sg-hero h3{font-size:1.15rem}
.sg-hero p{font-size:.7rem}
@media(max-width:1199.98px){.hero-title{font-size:2.35rem}}
@media(max-width:767.98px){body{font-size:11.5px}.hero-title{font-size:1.95rem}.hero-copy{font-size:.7rem}.page-heading h1,.page-title-row h1{font-size:1.08rem}.kpi-value{font-size:1.18rem}.card-body{padding:12px}.table td,.table th{padding:.5rem .45rem}}
@media(max-width:575.98px){body{font-size:11px}.hero-title{font-size:1.75rem}.btn{font-size:.63rem}.form-control,.form-select{font-size:.67rem}}