/* ===========================================================================
   innosys brand layer
   ---------------------------------------------------------------------------
   Loaded AFTER main.css and color_skins.css so it can re-tint the stock
   template without editing those files (150 KB of vendor CSS that would be
   painful to diff or upgrade). Deleting this one <link> restores the old skin.

   Palette is taken straight from the logo's gradient:
       cyan  #22D3EE  ->  violet #6D5AE6  ->  magenta #C026F0
   Violet is the solid accent because it sits mid-gradient and holds contrast
   on both white and dark chrome.
   ======================================================================== */

:root {
    --innosys-cyan:      #22D3EE;
    --innosys-cyan-600:  #0EA5C4;
    --innosys-violet:    #6D5AE6;
    --innosys-violet-600:#5B48D4;
    --innosys-violet-700:#4A39B8;
    --innosys-magenta:   #C026F0;
    --innosys-magenta-600:#A21CD1;
    --innosys-ink:       #12121A;

    --innosys-grad:       linear-gradient(135deg, #22D3EE 0%, #6D5AE6 52%, #C026F0 100%);
    --innosys-grad-rev:   linear-gradient(135deg, #C026F0 0%, #6D5AE6 52%, #22D3EE 100%);
    --innosys-grad-soft:  linear-gradient(135deg, #E9FBFE 0%, #F0EDFE 55%, #FCEDFE 100%);

    /* consumed by the app's own page-level styles */
    --card-blue:         #EDE9FE;
    --card-blue-border:  #C9BEF6;
    --sidebar-active-bg: #F1EDFE;
    --sidebar-active-tx: #4A39B8;
}

/* ---------- accent swap: template teal (#49c5b6) -> innosys violet ------- */
.theme-cyan ::selection                                        { background: var(--innosys-violet); color: #fff; }
.theme-cyan .page-loader-wrapper                               { background: var(--innosys-grad); }
.theme-cyan #left-sidebar .nav-tabs .nav-link.active           { color: var(--innosys-violet); }
.theme-cyan .sidebar-nav .metismenu > li.active > a            { border-left-color: var(--innosys-violet); }
.theme-cyan .sidebar-nav .metismenu > li i                     { color: var(--innosys-violet); }
.theme-cyan .navbar-nav ul.menu-icon                           { background: var(--innosys-violet); }
.theme-cyan .blog-page .single_post .footer .stats li a:hover  { color: var(--innosys-violet); }
.theme-cyan .fancy-checkbox input[type="checkbox"]:checked + span:before,
.theme-cyan .fc .fc-view-container .fc-view.fc-basic-view > table > thead tr th.fc-widget-header {
    background: var(--innosys-violet);
    border-color: var(--innosys-violet);
}

/* ---------- buttons ------------------------------------------------------ */
.btn-primary,
.theme-cyan .auth-main .btn-primary {
    background: var(--innosys-grad) !important;
    border: 0 !important;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(109, 90, 230, .28);
}
.btn-primary:hover, .btn-primary:focus,
.btn-primary:active, .btn-primary.active,
.show > .btn-primary.dropdown-toggle {
    background: var(--innosys-grad-rev) !important;
    border: 0 !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(109, 90, 230, .38);
}
.btn-primary:disabled, .btn-primary.disabled { opacity: .55; }

.btn-info    { background: var(--innosys-cyan-600)   !important; border-color: var(--innosys-cyan-600)   !important; color: #fff !important; }
.btn-info:hover, .btn-info:focus { background: #0B8CA8 !important; border-color: #0B8CA8 !important; }

.btn-outline-primary          { color: var(--innosys-violet); border-color: var(--innosys-violet); }
.btn-outline-primary:hover    { background: var(--innosys-violet); border-color: var(--innosys-violet); color: #fff; }

/* ---------- links & text accents ---------------------------------------- */
a                       { color: var(--innosys-violet-600); }
a:hover, a:focus        { color: var(--innosys-magenta-600); }
.text-primary           { color: var(--innosys-violet-600) !important; }
.bg-primary             { background: var(--innosys-grad) !important; }
.badge-primary          { background: var(--innosys-violet) !important; }

/* ---------- navbar ------------------------------------------------------- */
#navbar-menu .navbar-brand img, .navbar-brand img { max-height: 42px; width: auto; }

.navbar.top-navbar, #wrapper > .navbar {
    border-bottom: 2px solid transparent;
    border-image: var(--innosys-grad) 1;
}

/* ---------- sidebar ------------------------------------------------------ */
#left-sidebar-nav .metismenu > li.active > a {
    background: var(--sidebar-active-bg) !important;
    color: var(--sidebar-active-tx) !important;
    border-left: 3px solid var(--innosys-violet);
    font-weight: 600;
}
#left-sidebar-nav .metismenu > li > a:hover { background: rgba(109, 90, 230, .07); }
.sidebar-search:focus-within {
    border-color: var(--innosys-violet) !important;
    box-shadow: 0 0 0 3px rgba(109, 90, 230, .22) !important;
}
.sr-ic { background: var(--innosys-grad) !important; }

/* ---------- cards -------------------------------------------------------- */
.card .header {
    background: var(--innosys-grad-soft) !important;
    border-bottom: 1px solid var(--card-blue-border) !important;
}
.card .header h2 { color: var(--innosys-violet-700) !important; }

/* ---------- tables ------------------------------------------------------- */
table.table thead th { color: var(--innosys-violet-700); }
.table-striped > tbody > tr:nth-of-type(odd) { background: #FAF9FF; }
.page-item.active .page-link {
    background: var(--innosys-violet) !important;
    border-color: var(--innosys-violet) !important;
}
.page-link { color: var(--innosys-violet-600); }

/* ---------- form focus --------------------------------------------------- */
.form-control:focus {
    border-color: var(--innosys-violet) !important;
    box-shadow: 0 0 0 .18rem rgba(109, 90, 230, .18) !important;
}
.line-input:focus { border-bottom-color: var(--innosys-violet) !important; }

/* ---------- document builder bars (invoice / quotation / credit note) ----- */
.bar, .cn-bar            { background: var(--innosys-grad) !important; border: 0 !important; }
.bar.secondary, .cn-bar.secondary { background: var(--innosys-violet-700) !important; }
.bar:hover, .cn-bar:hover{ filter: brightness(1.06); }

.cat-btn                 { background: var(--innosys-cyan-600) !important; border-color: var(--innosys-cyan-600) !important; }
.cat-btn.active          { background: var(--innosys-violet)   !important; border-color: var(--innosys-violet-600) !important; }
.prod-btn                { background: var(--innosys-violet-700) !important; border-color: var(--innosys-violet-700) !important; }
.prod-btn:hover          { background: var(--innosys-violet-600) !important; }

/* ---------- auth screens ------------------------------------------------- */
.auth-main .card { border-top: 3px solid transparent; border-image: var(--innosys-grad) 1; }
.auth-main .navbar-brand img, .auth-box .logo img { max-width: 260px; height: auto; }

/* ---------- dark mode ---------------------------------------------------- */
:root[data-theme="dark"] {
    --card-blue:        #221C3A;
    --card-blue-border: #3A2F63;
    --sidebar-active-bg:#241E3E;
    --sidebar-active-tx:#C4B5FD;
    --innosys-grad-soft: linear-gradient(135deg, #16233A 0%, #1E1B3A 55%, #2A1B38 100%);
}
:root[data-theme="dark"] .card .header h2 { color: #C4B5FD !important; }
:root[data-theme="dark"] a                { color: #A78BFA; }
:root[data-theme="dark"] a:hover          { color: #E879F9; }
:root[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) { background: rgba(255,255,255,.02); }