/* ==========================================================================
   Aster Technologies - brand theme overrides
   Source: Brand Logo Identity Manual (Feb 2026)
   Loaded AFTER style.min.css. Colours / font only - no layout or logic.
   ========================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,400&family=Roboto+Condensed:wght@400;700&display=swap");

:root {
    /* Prime Green - identity / highlight */
    --aster-green:        #BCCF17;
    --aster-green-dark:   #A4B512;
    --aster-green-1:      #C6D654;
    --aster-green-2:      #D1DC6C;
    --aster-green-3:      #DBE285;
    --aster-green-tint:   #ECF0C6;
    /* Neutral Grey - structure */
    --aster-grey:         #989AA5;
    --aster-grey-1:       #B2B3B3;
    --aster-grey-2:       #CFD0D0;
    --aster-grey-3:       #E3E3E3;
    --aster-grey-4:       #EBECEC;
    --aster-ink:          #2B2B2B;
    --aster-dark:         #1C1A16;
    /* Aqua - fluid intelligence */
    --aster-aqua:         #00898B;
    --aster-aqua-1:       #069EA1;
    --aster-aqua-2:       #18B2B3;
    --aster-aqua-3:       #6EB5B8;
    --aster-aqua-tint:    #CAE6E1;
    --aster-blue:         #0077AD;
    --aster-blue-1:       #178FC2;
    --aster-blue-2:       #6DACD8;
    /* Terra - engineered stability */
    --aster-terra:        #CC6F3C;
    --aster-terra-1:      #D88859;
    --aster-terra-2:      #EFB25F;
    --aster-terra-3:      #FDD491;
    --aster-terra-tint:   #FFF2D7;
}

/* ---------- typography ---------- */
html, body, .sidebar, .card, .btn, .form-control, .table, .dropdown-menu, .modal-content,
h1, h2, h3, h4, h5, h6, .dash {
    font-family: "Roboto", Arial, sans-serif !important;
}
body { color: var(--aster-ink); }
th, td { color: #555; }
a { color: var(--aster-aqua); }
a:hover, a:focus { color: var(--aster-blue); }
.text-primary { color: var(--aster-aqua) !important; }
.text-success { color: var(--aster-green-dark) !important; }
.text-info    { color: var(--aster-blue) !important; }
.text-warning { color: var(--aster-terra) !important; }
.zmdi, [class^="zmdi-"], [class*=" zmdi-"] { font-family: 'Material-Design-Iconic-Font' !important; }
.themify, [class^="ti-"] { font-family: 'themify' !important; }

/* ---------- page shell ---------- */
.page-loader-wrapper p { color: var(--aster-grey); }

/* ---------- left sidebar ---------- */
.sidebar .navbar-brand .zmdi-menu { color: var(--aster-grey); }
.sidebar .user-info .detail h4 { color: var(--aster-ink); }
.sidebar .user-info .detail small { color: var(--aster-grey); }
.sidebar .menu .list a { color: #222; }
.sidebar .menu .list a:hover,
body[class*="theme-"] .sidebar .menu .list a:hover { color: var(--aster-aqua); }
body[class*="theme-"] .sidebar .menu .list li.active > :first-child i,
body[class*="theme-"] .sidebar .menu .list li.active > :first-child span { color: var(--aster-aqua); }
.sidebar .progress-container .progress-badge a { color: var(--aster-aqua) !important; font-weight: 500; }
.sidebar .progress-container.progress-info .progress-bar { background: var(--aster-green); }

/* ---------- right icon bar ---------- */
.navbar-right .navbar-nav > li > a { color: var(--aster-ink); }
body[class*="theme-"] .navbar-right .navbar-nav > li > a:hover {
    background: var(--aster-green); color: var(--aster-ink);
}
#notif-fab .nb { background: var(--aster-terra) !important; }

/* ---------- search overlay ---------- */
body[class*="theme-"] #search { background-color: rgba(0, 137, 139, .94); }

/* ---------- cards ---------- */
.card .header h2 { color: var(--aster-ink); }
body[class*="theme-"] .card .header h2:before { background: var(--aster-green); }
body[class*="theme-"] .card .header h2 strong { color: var(--aster-aqua); }
.card .header h2 small { color: var(--aster-grey); }

/* ---------- buttons ---------- */
.btn-primary, .btn-success {
    background-color: var(--aster-green); color: var(--aster-dark); border-color: var(--aster-green);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active,
.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active,
.show > .btn-primary.dropdown-toggle, .show > .btn-success.dropdown-toggle {
    background-color: var(--aster-green-dark) !important; color: var(--aster-dark) !important;
    border-color: var(--aster-green-dark) !important;
}
.btn-primary.btn-simple, .btn-success.btn-simple { color: var(--aster-green-dark); border-color: var(--aster-green-dark); background: transparent; }
.btn-info { background-color: var(--aster-aqua); border-color: var(--aster-aqua); color: #fff; }
.btn-info:hover, .btn-info:focus, .btn-info:active { background-color: var(--aster-aqua-1) !important; border-color: var(--aster-aqua-1) !important; color: #fff !important; }
.btn-warning { background-color: var(--aster-terra-2); border-color: var(--aster-terra-2); color: var(--aster-dark); }
.btn-warning:hover, .btn-warning:focus, .btn-warning:active { background-color: var(--aster-terra) !important; border-color: var(--aster-terra) !important; color: #fff !important; }
.btn-danger { background-color: var(--aster-terra); border-color: var(--aster-terra); color: #fff; }
.btn-danger:hover, .btn-danger:focus, .btn-danger:active { background-color: #b45c2d !important; border-color: #b45c2d !important; color: #fff !important; }
.btn-default, .btn-secondary { background-color: var(--aster-grey); border-color: var(--aster-grey); color: #fff; }
.btn-default:hover, .btn-secondary:hover { background-color: #85878f; border-color: #85878f; color: #fff; }

/* ---------- badges / alerts / progress ---------- */
.badge-primary, .badge-success { background: var(--aster-green); color: var(--aster-dark); }
.badge-info    { background: var(--aster-aqua); color: #fff; }
.badge-warning { background: var(--aster-terra-2); color: var(--aster-dark); }
.badge-danger  { background: var(--aster-terra); color: #fff; }
.badge-default, .badge-secondary { background: var(--aster-grey); color: #fff; }
.alert-info    { background: var(--aster-aqua-tint); color: #04595a; }
.alert-success { background: var(--aster-green-tint); color: #5a6309; }
.alert-warning { background: var(--aster-terra-tint); color: #8a4a22; }
.progress-container.progress-primary .progress-bar,
.progress-container.progress-success .progress-bar { background: var(--aster-green); }
.progress-container.progress-info .progress-bar    { background: var(--aster-aqua); }
.progress-container.progress-warning .progress-bar { background: var(--aster-terra-2); }
.progress-bar { background-color: var(--aster-green); }

/* ---------- forms ---------- */
.form-control:focus, .form-control:active { border-color: var(--aster-green) !important; box-shadow: 0 0 0 .15rem rgba(188, 207, 23, .25); }
.input-group:focus-within .input-group-text { color: var(--aster-aqua); }
body[class*="theme-"] .checkbox input[type="checkbox"]:checked + label::after { background: var(--aster-green); color: var(--aster-dark); }
body[class*="theme-"] .radio input[type="radio"]:checked + label::before { background: var(--aster-green); border-color: var(--aster-green); }
.bootstrap-select .dropdown-toggle:focus { outline: 0 !important; }
.bootstrap-select .dropdown-menu li.selected a, .dropdown-item.active, .dropdown-item:active { background: var(--aster-green-tint); color: var(--aster-ink); }

/* ---------- tabs, pagination, tables ---------- */
body[class*="theme-"] .nav-tabs .nav-link.active { border: 1px solid var(--aster-green); color: var(--aster-aqua); }
.nav-pills .nav-item .nav-link.active { background-color: var(--aster-green); color: var(--aster-dark); }
.pagination .page-item.active > .page-link,
.pagination .page-item.active > .page-link:focus,
.pagination .page-item.active > .page-link:hover { background-color: var(--aster-green); border-color: var(--aster-green); color: var(--aster-dark); }
.page-item.active .page-link { background-color: var(--aster-green) !important; border-color: var(--aster-green) !important; color: var(--aster-dark) !important; }
body[class*="theme-"] .table.theme-color thead th,
body[class*="theme-"] .table.theme-color thead td { background: var(--aster-aqua); color: #fff; border-bottom: 0; }
.table-hover tbody tr:hover { background-color: var(--aster-green-tint); }
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after { color: var(--aster-aqua); }
.footable-sortable { color: var(--aster-ink); }

/* ---------- modal ---------- */

/* ---------- dashboard (main.php) icon chips -> brand palette ---------- */
.ic.blue   { background: linear-gradient(135deg, var(--aster-blue-1), var(--aster-blue)); }
.ic.green  { background: linear-gradient(135deg, var(--aster-green), var(--aster-green-dark)); color: var(--aster-dark); }
.ic.orange { background: linear-gradient(135deg, var(--aster-terra-2), var(--aster-terra)); }
.ic.red    { background: linear-gradient(135deg, var(--aster-terra-1), #b45c2d); }
.ic.purple { background: linear-gradient(135deg, var(--aster-grey), #6f717b); }
.ic.teal   { background: linear-gradient(135deg, var(--aster-aqua-2), var(--aster-aqua)); }

.tank { border-color: var(--aster-grey-2); background: var(--aster-grey-4); }
.tank .water { background: linear-gradient(180deg, var(--aster-aqua-2), var(--aster-blue)); }
.tank.mid .water { background: linear-gradient(180deg, var(--aster-terra-3), var(--aster-terra-2)); }
.tank.low .water { background: linear-gradient(180deg, var(--aster-terra-1), var(--aster-terra)); }

.status-circle.on  { background: linear-gradient(135deg, var(--aster-green), var(--aster-green-dark)); color: var(--aster-dark); }
.status-circle.off { background: linear-gradient(135deg, var(--aster-terra-1), var(--aster-terra)); }
@keyframes pulse-on {
    0%   { box-shadow: 0 0 0 0 rgba(188, 207, 23, .55); }
    70%  { box-shadow: 0 0 0 16px rgba(188, 207, 23, 0); }
    100% { box-shadow: 0 0 0 0 rgba(188, 207, 23, 0); }
}

.cv-note { background: var(--aster-aqua-tint); border-left-color: var(--aster-aqua); }
.cv-dot.on  { background: var(--aster-green-dark); box-shadow: 0 0 0 3px rgba(188, 207, 23, .35); }
.cv-dot.off { background: var(--aster-terra); box-shadow: 0 0 0 3px rgba(204, 111, 60, .25); }

.mtile.ok   { border-left-color: var(--aster-green); background: var(--aster-green-tint); }
.mtile.bad  { border-left-color: var(--aster-terra); background: var(--aster-terra-tint); }
.mtile.info { border-left-color: var(--aster-aqua);  background: var(--aster-aqua-tint); }

.q-temp { background: linear-gradient(180deg, rgba(204, 111, 60, .10), transparent 60%); }
.q-ph   { background: linear-gradient(180deg, rgba(188, 207, 23, .16), transparent 60%); }
.q-tds  { background: linear-gradient(180deg, rgba(24, 178, 179, .14), transparent 60%); }

.al.danger  { border-color: var(--aster-terra);   background: rgba(204, 111, 60, .12); }
.al.warning { border-color: var(--aster-terra-2); background: rgba(239, 178, 95, .20); }
.al.info    { border-color: var(--aster-aqua);    background: rgba(0, 137, 139, .10); }
.al.good    { border-color: var(--aster-green);   background: rgba(188, 207, 23, .18); }
#notif-box .ni.danger  { border-color: var(--aster-terra);   background: rgba(204, 111, 60, .12); }
#notif-box .ni.warning { border-color: var(--aster-terra-2); background: rgba(239, 178, 95, .20); }
#notif-box .ni.good    { border-color: var(--aster-green);   background: rgba(188, 207, 23, .18); }

/* ---------- login page (index.php) ---------- */
.authentication .btn-danger { background: var(--aster-grey); border-color: var(--aster-grey); }
.authentication .btn-danger:hover { background: #85878f !important; border-color: #85878f !important; }
.authentication .btn-warning { background: var(--aster-aqua); border-color: var(--aster-aqua); color: #fff; }
.authentication .btn-warning:hover { background: var(--aster-aqua-1) !important; border-color: var(--aster-aqua-1) !important; color: #fff !important; }
.authentication .copyright { color: var(--aster-grey); }
#alert_box.alert-info { background: var(--aster-aqua-tint); color: #04595a; }