/*
 * Vazio theme — global primary recolour.
 * Overrides Metronic's default blue with Vazio's green palette. Loaded AFTER the Metronic bundle
 * so these win. Palette: primary #1fa548, active #178a3b, light #e8f7ee, accent (secondary) #712382.
 * This is a colour layer only — it does not restructure any component.
 */
:root {
    --bs-primary: #1fa548;
    --bs-primary-rgb: 31, 165, 72;
    --bs-primary-active: #178a3b;
    --bs-primary-light: #e8f7ee;
    --bs-primary-inverse: #ffffff;
    --bs-link-color: #1fa548;
    --bs-link-hover-color: #178a3b;
    /* Metronic KT vars (used in newer builds) */
    --kt-primary: #1fa548;
    --kt-primary-active: #178a3b;
    --kt-primary-light: #e8f7ee;
    --kt-primary-inverse: #ffffff;
    --kt-primary-rgb: 31, 165, 72;
    --kt-text-primary: #1fa548;
}

/* Buttons */
.btn.btn-primary {
    background-color: #1fa548;
    border-color: #1fa548;
    color: #fff;
}
.btn.btn-primary:hover:not(.btn-active),
.btn.btn-primary:focus:not(.btn-active),
.btn.btn-primary:active:not(.btn-active),
.btn.btn-primary.active,
.btn.btn-primary.show {
    background-color: #178a3b !important;
    border-color: #178a3b !important;
    color: #fff !important;
}
.btn.btn-light-primary {
    background-color: #e8f7ee;
    border-color: #e8f7ee;
    color: #1fa548;
}
.btn.btn-light-primary:hover:not(.btn-active),
.btn.btn-light-primary:focus:not(.btn-active),
.btn.btn-light-primary:active:not(.btn-active) {
    background-color: #1fa548 !important;
    border-color: #1fa548 !important;
    color: #fff !important;
}
.btn.btn-outline-primary,
.btn.btn-bg-primary { color: #1fa548; border-color: #1fa548; }

/* Text / background / borders */
.text-primary { color: #1fa548 !important; }
.text-hover-primary:hover,
.text-hover-primary:hover i { color: #1fa548 !important; }
.bg-primary { background-color: #1fa548 !important; }
.bg-light-primary { background-color: #e8f7ee !important; }
.border-primary { border-color: #1fa548 !important; }

/* Badges */
.badge.badge-primary { background-color: #1fa548; color: #fff; }
.badge.badge-light-primary { color: #1fa548; background-color: #e8f7ee; }

/* Links */
a.text-primary:hover { color: #178a3b !important; }
.link-primary { color: #1fa548; }
.link-primary:hover { color: #178a3b; }

/* Sidebar / menu active state */
.menu-item .menu-link.active,
.menu-item.here > .menu-link,
.menu-item.show > .menu-link,
.menu-state-primary .menu-item .menu-link.active {
    color: #1fa548 !important;
    background-color: #e8f7ee;
}
.menu-item .menu-link.active .menu-icon i,
.menu-item .menu-link.active .menu-icon .svg-icon { color: #1fa548 !important; }

/* Form controls */
.form-check-input:checked { background-color: #1fa548; border-color: #1fa548; }
.form-check-input:focus { border-color: #1fa548; box-shadow: 0 0 0 .25rem rgba(31,165,72,.25); }
.form-control:focus, .form-select:focus { border-color: #79c894; box-shadow: 0 0 0 .25rem rgba(31,165,72,.15); }

/* Pagination / tabs */
.page-item.active .page-link { background-color: #1fa548; border-color: #1fa548; }
.page-link { color: #1fa548; }
.nav-line-tabs .nav-item .nav-link.active,
.nav-pills .nav-link.active { color: #1fa548; border-bottom-color: #1fa548; }
.nav-pills .nav-link.active { background-color: #1fa548; color: #fff; }

/* Progress / spinners / switches */
.progress-bar { background-color: #1fa548; }
.form-switch .form-check-input:checked { background-color: #1fa548; border-color: #1fa548; }

/* Symbol / avatar accents that used primary */
.symbol-label.bg-light-primary { background-color: #e8f7ee !important; color: #1fa548 !important; }

/* ============================================================
   Vazio — modern polish layer (original, generic SaaS styling)
   Conservative: visual refinement only, no layout repositioning.
   ============================================================ */

/* Softer, rounder cards with a gentle shadow */
.card {
    border-radius: 14px !important;
    border: 1px solid #eef0f2;
    box-shadow: 0 4px 20px rgba(31, 45, 61, 0.06) !important;
}
.card .card-header { border-bottom: 1px solid #f2f4f6; min-height: 62px; }

/* Buttons — a touch more padding, rounder, smooth hover */
.btn { border-radius: 9px; font-weight: 600; transition: all .15s ease; }
.btn.btn-sm { border-radius: 7px; }
.btn.btn-primary { box-shadow: 0 2px 8px rgba(31,165,72,0.25); }
.btn.btn-primary:hover { box-shadow: 0 4px 14px rgba(31,165,72,0.35); transform: translateY(-1px); }

/* Inputs — cleaner border + rounded */
.form-control, .form-select {
    border-radius: 9px;
    border-color: #e4e7ea;
    padding-top: .65rem; padding-bottom: .65rem;
}
.form-control:hover, .form-select:hover { border-color: #cfd4d9; }

/* Pill badges */
.badge { border-radius: 999px; font-weight: 600; padding: .45em .8em; }

/* Sidebar polish — rounded active pill, subtle hover */
.menu-item .menu-link { border-radius: 9px; }
.menu-item .menu-link:hover { background-color: #f4f8f5; }

/* Rounded avatars/symbols by default */
.symbol > img, .symbol-label { border-radius: 10px; }
.symbol.symbol-circle > img, .symbol.symbol-circle .symbol-label { border-radius: 50%; }

/* Softer page background so white cards pop */
body, .app-page, .page { background-color: #f7f9fa; }

/* Tables — lighter header, roomier rows */
.table > thead th {
    text-transform: uppercase; font-size: .72rem; letter-spacing: .04em;
    color: #8a95a1; font-weight: 700; border-bottom: 1px solid #eef0f2;
}
.table > tbody > tr { border-bottom: 1px solid #f4f6f7; }

/* Modals & dropdowns rounded */
.modal-content { border-radius: 16px; border: none; box-shadow: 0 20px 60px rgba(31,45,61,.18); }
.dropdown-menu, .menu-sub-dropdown { border-radius: 12px; box-shadow: 0 10px 40px rgba(31,45,61,.12); border: 1px solid #eef0f2; }

/* Slim, subtle scrollbars */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: #d3dae0; border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: #b9c2ca; }

/* ============================================================
   'info' is this app's de-facto brand accent (the login CTA and
   ~150 views use btn-info/text-info). Pin it to Vazio green so no
   element falls back to Metronic's default blue.
   ============================================================ */
.btn.btn-info {
    background-color: #1fa548;
    border-color: #1fa548;
    color: #fff;
}
.btn.btn-info:hover:not(.btn-active),
.btn.btn-info:focus:not(.btn-active),
.btn.btn-info:active:not(.btn-active),
.btn.btn-info.active,
.btn.btn-info.show {
    background-color: #178a3b !important;
    border-color: #178a3b !important;
    color: #fff !important;
}
.btn.btn-light-info {
    background-color: #e8f7ee;
    border-color: #e8f7ee;
    color: #1fa548;
}
.btn.btn-light-info:hover:not(.btn-active),
.btn.btn-light-info:focus:not(.btn-active) {
    background-color: #1fa548 !important;
    border-color: #1fa548 !important;
    color: #fff !important;
}
.btn.btn-outline-info { color: #1fa548; border-color: #1fa548; }
.text-info { color: #1fa548 !important; }
.text-hover-info:hover, .text-hover-info:hover i { color: #1fa548 !important; }
.bg-info { background-color: #1fa548 !important; }
.bg-light-info { background-color: #e8f7ee !important; }
.border-info { border-color: #1fa548 !important; }
.badge.badge-info { background-color: #1fa548; color: #fff; }
.badge.badge-light-info { color: #1fa548; background-color: #e8f7ee; }
.link-info { color: #1fa548; }
.link-info:hover { color: #178a3b; }
a.text-info:hover { color: #178a3b !important; }
.symbol-label.bg-light-info { background-color: #e8f7ee !important; color: #1fa548 !important; }