/* ATT-Clouds Hotspot Portal | Copyright (c) 2026 ATT-Clouds. All rights reserved. */
/* UniFi-inspired daylight theme: clean white surfaces, quiet slate type and precise blue states. */

html[data-theme="light"]{
    color-scheme:light;
    --att-gold:#1478ff;
    --att-gold-light:#47a0ff;
    --att-gold-dark:#005bd7;
    --att-navy-900:#f4f7fb;
    --att-navy-800:#f7f9fc;
    --att-navy-700:#ffffff;
    --att-navy-600:#eaf1f9;
    --att-surface:#ffffff;
    --att-surface-solid:#ffffff;
    --att-surface-raised:#ffffff;
    --att-border:#dce5f0;
    --att-border-strong:#9bc6ff;
    --att-text:#172235;
    --att-muted:#68778b;
    --att-info:#1478ff;
    --att-focus:0 0 0 .22rem rgba(20,120,255,.16);
    --att-shadow-sm:0 5px 18px rgba(27,54,86,.07);
    --att-shadow:0 15px 40px rgba(27,54,86,.10);
    --att-shadow-lg:0 24px 64px rgba(27,54,86,.14);
    --bg:#f4f7fb;
    --bg-dark:#edf3f9;
    --text:#172235;
    --text-light:#68778b;
    --border:#dce5f0;
    --sidebar-bg:#ffffff;
    --sidebar-hover:#eef6ff;
    --sidebar-active:linear-gradient(135deg,#e8f3ff,#f6faff);
    --att-control-surface:linear-gradient(145deg,#ffffff,#f5f8fc);
    --att-control-border:#d4e0ed;
}

html[data-theme="light"] body{
    color-scheme:light;color:var(--att-text);
    background:radial-gradient(circle at 95% 0,rgba(20,120,255,.08),transparent 30%),linear-gradient(155deg,#f8fafd,#f1f5fa);
}
html[data-theme="light"] body::before{opacity:.38;background-image:linear-gradient(rgba(105,130,160,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(105,130,160,.08) 1px,transparent 1px)}
html[data-theme="light"] ::selection{color:#fff;background:#1478ff}
html[data-theme="light"] ::-webkit-scrollbar-thumb{background:#b9c8d9}

html[data-theme="light"] .sidebar{background:rgba(255,255,255,.97);border-color:#dce5f0;box-shadow:10px 0 30px rgba(31,59,91,.07)}
html[data-theme="light"] .sidebar-header,html[data-theme="light"] .sidebar-footer{background:#fff;border-color:#e1e8f0}
html[data-theme="light"] .sidebar-brand-text h4,html[data-theme="light"] .sidebar-user-name{color:#172235}
html[data-theme="light"] .sidebar-brand-text small,html[data-theme="light"] .sidebar-user-role,html[data-theme="light"] .sidebar-title{color:#7a899c}
html[data-theme="light"] .sidebar-brand-icon,html[data-theme="light"] .footer-emblem{background:#f7f9fc;border-color:#d9e3ee;box-shadow:0 8px 20px rgba(30,65,100,.08)}
html[data-theme="light"] .sidebar-item{color:#53657a}
html[data-theme="light"] .sidebar-item:hover{color:#075fcb;background:#f0f7ff;border-color:#d5e8ff}
html[data-theme="light"] .sidebar-item.active{color:#0869dc;background:linear-gradient(105deg,#e8f3ff,#f7fbff);border-color:#bfdbff;box-shadow:inset 0 0 22px rgba(20,120,255,.04)}
html[data-theme="light"] .sidebar-item.active::after{background:#1478ff;box-shadow:0 0 10px rgba(20,120,255,.35)}
html[data-theme="light"] .sidebar-item.active i{color:#1478ff;filter:none}

html[data-theme="light"] .topbar{background:rgba(255,255,255,.92);border-color:#dce5f0;box-shadow:0 8px 25px rgba(31,59,91,.06)}
html[data-theme="light"] .sidebar-toggle,html[data-theme="light"] .topbar-action,html[data-theme="light"] .topbar-profile{color:#42566e;background:#fff;border-color:#d9e3ee;box-shadow:0 3px 10px rgba(27,54,86,.05)}
html[data-theme="light"] .sidebar-toggle:hover,html[data-theme="light"] .topbar-action:hover,html[data-theme="light"] .topbar-action[aria-pressed="true"]{color:#0869dc;background:#eaf4ff;border-color:#b8d8ff}
html[data-theme="light"] .page-title,html[data-theme="light"] .topbar-profile-name{color:#172235}
html[data-theme="light"] .topbar-profile-avatar,html[data-theme="light"] .sidebar-avatar{color:#fff;background:linear-gradient(135deg,#1478ff,#49a1ff)}

html[data-theme="light"] .card,html[data-theme="light"] .dashboard-card,html[data-theme="light"] .stat-card,html[data-theme="light"] .router-card,html[data-theme="light"] .action-card,html[data-theme="light"] .current-router-card,html[data-theme="light"] .empty-state,
html[data-theme="light"] [class*="monitor-panel"],html[data-theme="light"] [class*="monitor-stat"],html[data-theme="light"] [class*="router-form"],html[data-theme="light"] [class*="router-card-shell"]{
    color:#172235;background:#fff;border-color:#dce5f0;box-shadow:var(--att-shadow-sm);backdrop-filter:none;
}
html[data-theme="light"] .card:hover,html[data-theme="light"] .stat-card:hover,html[data-theme="light"] .router-card:hover,html[data-theme="light"] .action-card:hover{border-color:#b9d8ff}
html[data-theme="light"] .card-header,html[data-theme="light"] .card-footer{color:#172235;background:#f8fafc;border-color:#e1e8f0}
html[data-theme="light"] .dashboard-icon,html[data-theme="light"] .stat-icon,html[data-theme="light"] .action-card-icon,html[data-theme="light"] .current-router-icon{color:#1478ff;background:#eaf4ff;border-color:#cce3ff}
html[data-theme="light"] h1,html[data-theme="light"] h2,html[data-theme="light"] h3,html[data-theme="light"] h4,html[data-theme="light"] h5,html[data-theme="light"] h6{color:#172235}
html[data-theme="light"] .text-dark{color:#172235!important}
html[data-theme="light"] .text-muted{color:#68778b!important}
html[data-theme="light"] .bg-light,html[data-theme="light"] .bg-white{background-color:#f7f9fc!important}
html[data-theme="light"] .border,html[data-theme="light"] .border-top,html[data-theme="light"] .border-bottom{border-color:#dce5f0!important}

html[data-theme="light"] .table{--bs-table-bg:transparent;--bs-table-color:#24334a;--bs-table-border-color:#e1e8f0}
html[data-theme="light"] .table thead th{color:#496078;background:#f2f6fa;border-color:#dce5f0}
html[data-theme="light"] .table tbody td,html[data-theme="light"] .table>:not(caption)>*>*{color:#24334a;background:transparent;border-color:#e4eaf1}
html[data-theme="light"] .table-hover>tbody>tr:hover>*{color:#172235;background:#f0f7ff}
html[data-theme="light"] .table-light{--bs-table-bg:#f2f6fa;--bs-table-color:#496078;--bs-table-border-color:#dce5f0}

html[data-theme="light"] .form-label{color:#3d5068}
html[data-theme="light"] .form-control,html[data-theme="light"] .form-select,html[data-theme="light"] .form-check-input,html[data-theme="light"] .input-group-text{color:#172235;background-color:#fff;border-color:#cedae7}
html[data-theme="light"] .form-control::placeholder{color:#94a1b1}
html[data-theme="light"] .form-control:focus,html[data-theme="light"] .form-select:focus,html[data-theme="light"] .form-check-input:focus{color:#172235;background:#fff;border-color:#1478ff;box-shadow:var(--att-focus)}
html[data-theme="light"] .form-select option{color:#172235;background:#fff}
html[data-theme="light"] .form-check-input:checked{background-color:#1478ff;border-color:#1478ff}

html[data-theme="light"] .btn-primary,html[data-theme="light"] .btn-warning{--att-btn-color:#fff;--att-btn-bg:linear-gradient(135deg,#0869dc,#2e91ff);--att-btn-border:#0869dc;--att-btn-rail:#8ac2ff;color:#fff;background:linear-gradient(135deg,#0869dc,#2e91ff);box-shadow:0 8px 20px rgba(20,120,255,.2)}
html[data-theme="light"] .btn-primary:hover,html[data-theme="light"] .btn-warning:hover{color:#fff;background:linear-gradient(135deg,#005ecb,#1478ff)}
html[data-theme="light"] .btn-light,html[data-theme="light"] .btn-outline-secondary{--att-btn-color:#42566e;--att-btn-bg:#fff;--att-btn-border:#cedae7;--att-btn-rail:#1478ff;color:#42566e;background:#fff;border-color:#cedae7}
html[data-theme="light"] .btn-outline-primary{--att-btn-color:#0869dc;--att-btn-bg:#f4f9ff;--att-btn-border:#a9d0ff;--att-btn-rail:#1478ff;color:#0869dc;background:#f4f9ff;border-color:#a9d0ff}

html[data-theme="light"] .dropdown-menu,html[data-theme="light"] .modal-content,html[data-theme="light"] .offcanvas,html[data-theme="light"] .toast{color:#172235;background:#fff;border-color:#dce5f0;box-shadow:var(--att-shadow)}
html[data-theme="light"] .dropdown-item{color:#42566e}
html[data-theme="light"] .dropdown-item:hover{color:#0869dc;background:#eef6ff}
html[data-theme="light"] .btn-close{filter:none}
html[data-theme="light"] .pagination .page-link{color:#52667d;background:#fff;border-color:#d6e1ec}
html[data-theme="light"] .pagination .page-link:hover,html[data-theme="light"] .pagination .active>.page-link{color:#fff;background:#1478ff;border-color:#1478ff}

html[data-theme="light"] .footer{color:#68778b;background:rgba(255,255,255,.95);border-color:#dce5f0;box-shadow:0 -5px 18px rgba(27,54,86,.04)}
html[data-theme="light"] .footer-logo{color:#172235}
html[data-theme="light"] .footer-chip{color:#52667d;background:#f7f9fc;border-color:#dce5f0}
html[data-theme="light"] .brand-att{color:#172235}
html[data-theme="light"] .brand-clouds,html[data-theme="light"] .guest-brand-name .brand-clouds,html[data-theme="light"] .footer-logo .brand-clouds{color:#1478ff}

html[data-theme="light"] .notification-panel{background:#fff;border-color:#d6e1ec;box-shadow:0 24px 60px rgba(27,54,86,.18)}
html[data-theme="light"] .notification-panel-header,html[data-theme="light"] .notification-item{border-color:#e1e8f0}
html[data-theme="light"] .notification-panel-header strong,html[data-theme="light"] .notification-item,html[data-theme="light"] .notification-empty strong{color:#172235}
html[data-theme="light"] .notification-panel-header button{color:#1478ff;background:#f4f9ff;border-color:#cfe4ff}
html[data-theme="light"] .notification-item:hover{color:#172235;background:#f4f9ff}
html[data-theme="light"] .notification-badge{border-color:#fff}

html[data-theme="light"] .monitor-hero,html[data-theme="light"] .router-manager-hero,html[data-theme="light"] .router-form-hero{background:linear-gradient(130deg,#fff,#eef6ff);border-color:#cfe4ff}
html[data-theme="light"] .monitor-source-strip>div,html[data-theme="light"] .monitor-detail-grid>div,html[data-theme="light"] .monitor-health-list>div,html[data-theme="light"] .monitor-address-list>div,html[data-theme="light"] .monitor-log-row{color:#24334a;background:#f7f9fc;border-color:#dce5f0}
html[data-theme="light"] .loading-overlay{background:rgba(244,247,251,.88)}

/* Router inventory and editor */
html[data-theme="light"] .router-page-hero,html[data-theme="light"] .router-inventory-card,html[data-theme="light"] .router-editor-card{color:#172235;background:linear-gradient(140deg,#fff,#f4f9ff);border-color:#d6e4f2;box-shadow:var(--att-shadow-sm)}
html[data-theme="light"] .router-page-hero h1,html[data-theme="light"] .router-card-title h2,html[data-theme="light"] .router-meta-strip strong,html[data-theme="light"] .router-empty-state h2,html[data-theme="light"] .router-editor-heading h2{color:#172235}
html[data-theme="light"] .router-page-hero p,html[data-theme="light"] .router-card-title p,html[data-theme="light"] .router-meta-strip span,html[data-theme="light"] .router-empty-state p,html[data-theme="light"] .router-editor-heading p,html[data-theme="light"] .router-field-help{color:#68778b}
html[data-theme="light"] .router-page-kicker,html[data-theme="light"] .router-card-mark,html[data-theme="light"] .router-editor-icon,html[data-theme="light"] .router-form-note i{color:#1478ff}
html[data-theme="light"] .router-card-mark,html[data-theme="light"] .router-editor-icon{border-color:#cce3ff;background:#eaf4ff}
html[data-theme="light"] .router-meta-strip>div,html[data-theme="light"] .router-test-result.is-visible{background:#f7f9fc;border-color:#e0e8f1}
html[data-theme="light"] .router-editor-heading{border-color:#dce5f0}
html[data-theme="light"] .router-field label,html[data-theme="light"] .router-monitor-toggle{color:#3d5068}
html[data-theme="light"] .router-field label small{color:#7a899c}
html[data-theme="light"] .router-form-note{color:#52667d;background:#f2f8ff;border-color:#cfe4ff}
html[data-theme="light"] .router-monitor-toggle span{background:#dce5f0;border-color:#c7d4e2}
html[data-theme="light"] .router-monitor-toggle input:checked+span{background:#cfe5ff;border-color:#7cb8ff}
html[data-theme="light"] .router-monitor-toggle input:checked+span::after{background:#1478ff}

/* Router monitoring details */
html[data-theme="light"] .monitor-hero{background:linear-gradient(130deg,#fff,#eef6ff);border-color:#cfe4ff;box-shadow:var(--att-shadow-sm)}
html[data-theme="light"] .monitor-kicker,html[data-theme="light"] .monitor-source-strip i,html[data-theme="light"] .monitor-panel-head>div>span,html[data-theme="light"] .monitor-panel-head>i,html[data-theme="light"] .interface-selected-heading span:first-child,html[data-theme="light"] .monitor-address-list .address-interface,html[data-theme="light"] .monitor-log-row span{color:#1478ff}
html[data-theme="light"] .monitor-title-row h1,html[data-theme="light"] .monitor-stat-card div>strong,html[data-theme="light"] .monitor-panel-head h2,html[data-theme="light"] .interface-selected-heading h3,html[data-theme="light"] .traffic-live-value strong{color:#172235}
html[data-theme="light"] .monitor-hero-main p,html[data-theme="light"] .monitor-router-picker label,html[data-theme="light"] .monitor-source-strip span,html[data-theme="light"] .monitor-stat-card div>span,html[data-theme="light"] .monitor-stat-card>small,html[data-theme="light"] .monitor-panel-head p,html[data-theme="light"] .monitor-detail-grid span,html[data-theme="light"] .monitor-health-list span,html[data-theme="light"] .interface-detail-list span,html[data-theme="light"] .traffic-chart-footer,html[data-theme="light"] .monitor-log-row time{color:#68778b}
html[data-theme="light"] .monitor-source-strip{background:#fff;border-color:#dce5f0}
html[data-theme="light"] .monitor-source-strip strong,html[data-theme="light"] .monitor-detail-grid strong,html[data-theme="light"] .monitor-health-list strong,html[data-theme="light"] .interface-detail-list strong,html[data-theme="light"] .monitor-address-list strong,html[data-theme="light"] .monitor-route-strip strong,html[data-theme="light"] .monitor-log-row p{color:#24334a}
html[data-theme="light"] .monitor-stat-card,html[data-theme="light"] .monitor-panel{background:#fff;border-color:#dce5f0;box-shadow:var(--att-shadow-sm)}
html[data-theme="light"] .monitor-stat-icon{color:#1478ff;background:#eaf4ff;border-color:#cce3ff}
html[data-theme="light"] .monitor-detail-grid,html[data-theme="light"] .monitor-health-list,html[data-theme="light"] .monitor-address-list,html[data-theme="light"] .monitor-log-list{background:#dce5f0}
html[data-theme="light"] .monitor-detail-grid>div,html[data-theme="light"] .monitor-health-list>div,html[data-theme="light"] .monitor-address-list>div,html[data-theme="light"] .monitor-address-list>p,html[data-theme="light"] .monitor-log-row{background:#f8fafc}
html[data-theme="light"] .monitor-ring{background:radial-gradient(circle at center,#fff 56%,transparent 58%),conic-gradient(var(--ring-color) calc(var(--value)*1%),#e2e8f0 0)}
html[data-theme="light"] .monitor-ring strong{color:#172235}
html[data-theme="light"] .interface-details-card,html[data-theme="light"] .traffic-chart-card{background:#fbfcfe;border-color:#dce5f0}
html[data-theme="light"] .interface-detail-list>div,html[data-theme="light"] .traffic-chart-toolbar,html[data-theme="light"] .traffic-chart-footer,html[data-theme="light"] .monitor-interface-table-wrap,html[data-theme="light"] .monitor-route-strip{border-color:#e1e8f0}
html[data-theme="light"] .monitor-interface-table thead th{color:#52667d;background:#f2f6fa;border-color:#dce5f0}
html[data-theme="light"] .monitor-interface-table tbody td{color:#52667d;border-color:#e4eaf1}
html[data-theme="light"] .monitor-interface-table td strong{color:#172235}

@media(max-width:991.98px){html[data-theme="light"] .topbar{background:rgba(255,255,255,.97)}}
