:root {
    --svt-primary: #0EA5E9;
    --svt-secondary: #14B8A6;
    --svt-accent: #8B5CF6;
    --svt-success: #22C55E;
    --svt-bg: #F8FAFC;
    --svt-text: #0F172A;
    --svt-muted: #64748B;
    --svt-glass: rgba(255, 255, 255, 0.72);
    --svt-border: rgba(148, 163, 184, 0.24);
    --svt-radius-lg: 20px;
    --svt-radius-md: 16px;
    --svt-shadow-sm: 0 10px 30px rgba(15, 23, 42, 0.08);
    --svt-shadow-lg: 0 20px 55px rgba(15, 23, 42, 0.14);
}

* {
    box-sizing: border-box;
}

body {
    font-family: 'Inter', 'Poppins', 'Segoe UI', sans-serif;
    background: linear-gradient(180deg, #f8fafc 0%, #eef4ff 100%);
    color: var(--svt-text);
}

.svt-shell {
    min-height: 100vh;
}

.svt-navbar {
    position: sticky;
    top: 0;
    z-index: 1030;
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    border-bottom: 1px solid transparent;
    transition: background .3s ease, box-shadow .3s ease, border-color .3s ease;
    background: rgba(255, 255, 255, 0.14);
}

.svt-navbar.is-scrolled {
    background: var(--svt-glass);
    border-color: var(--svt-border);
    box-shadow: 0 8px 30px rgba(15, 23, 42, 0.09);
}

.svt-logo {
    width: auto;
    max-height: 44px;
    object-fit: contain;
}

.svt-brand {
    letter-spacing: .02em;
    font-weight: 700;
    color: var(--svt-text);
}

.svt-nav-link {
    color: var(--svt-muted) !important;
    font-weight: 600;
    border-radius: 14px;
    padding: .55rem .85rem !important;
    transition: all .2s ease;
}

.svt-nav-link:hover,
.svt-nav-item.active .svt-nav-link {
    color: var(--svt-text) !important;
    background: rgba(14, 165, 233, 0.12);
}

.svt-search {
    border-radius: 999px;
    border: 1px solid var(--svt-border);
    background: rgba(255, 255, 255, 0.84);
}

.svt-search .form-control,
.svt-search .form-control:focus {
    border: none;
    box-shadow: none;
    background: transparent;
}

.svt-search-btn {
    border-radius: 999px;
    border: none;
    background: linear-gradient(135deg, var(--svt-primary), var(--svt-accent));
    color: #fff;
    width: 40px;
    height: 40px;
}

.svt-profile-image {
    border: 2px solid rgba(14, 165, 233, 0.22);
    border-radius: 50%;
    object-fit: cover;
}

.svt-layout {
    padding: 1.25rem;
}

.svt-pane {
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid var(--svt-border);
    border-radius: var(--svt-radius-lg);
    box-shadow: var(--svt-shadow-sm);
}

.svt-sidebar {
    padding: 1rem;
}

.svt-sidebar-link {
    color: var(--svt-muted);
    font-weight: 600;
    border-radius: 14px;
    padding: .7rem .8rem;
    display: flex;
    gap: .55rem;
    align-items: center;
    text-decoration: none;
    transition: all .2s ease;
}

.svt-sidebar-link:hover,
.svt-sidebar-item.active .svt-sidebar-link {
    background: linear-gradient(135deg, rgba(14, 165, 233, .15), rgba(139, 92, 246, .11));
    color: var(--svt-text);
}

.svt-main-content {
    padding: 1.25rem;
    min-height: 620px;
}

.svt-ad-card {
    border-radius: var(--svt-radius-md);
    border: 1px dashed rgba(20, 184, 166, 0.45);
    background: linear-gradient(135deg, rgba(20, 184, 166, .09), rgba(14, 165, 233, .08));
    color: var(--svt-muted);
}

.svt-kpi-card,
.svt-widget,
.svt-panel {
    background: #fff;
    border: 1px solid var(--svt-border);
    border-radius: var(--svt-radius-md);
    box-shadow: 0 8px 25px rgba(15, 23, 42, 0.06);
    padding: 1rem;
}

.btn-svt-primary {
    border: none;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--svt-primary), var(--svt-accent));
    color: #fff;
    font-weight: 600;
}

.modal-content {
    border: 1px solid var(--svt-border);
    border-radius: var(--svt-radius-lg);
    box-shadow: var(--svt-shadow-lg);
}

.svt-footer {
    margin-top: 1.5rem;
    padding: 2rem 1.2rem;
    color: #d4def3;
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 60%, #0ea5e9 140%);
}

.svt-footer h6 {
    color: #fff;
    font-weight: 700;
}

.svt-footer a {
    color: #cbd5e1;
    text-decoration: none;
}

.svt-footer a:hover {
    color: #fff;
}

.svt-fade-up {
    opacity: 0;
    transform: translateY(10px);
    animation: svtFadeUp .6s ease forwards;
}

@keyframes svtFadeUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 991.98px) {
    .svt-layout {
        padding: .8rem;
    }

    .svt-main-content {
        min-height: 320px;
    }
}

/* ================================================
   BOOTSTRAP 3 BACKWARD COMPATIBILITY
   ================================================ */

/* Panel system */
.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
}

.panel-default {
    border-color: #ddd;
}

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.panel-default > .panel-heading {
    color: #333;
    background-color: #f5f5f5;
    border-color: #ddd;
}

.panel-body {
    padding: 15px;
}

.panel-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

/* Pull helpers */
.pull-right {
    float: right !important;
}

.pull-left {
    float: left !important;
}

/* Text colors */
.hdrfootrcolor {
    color: inherit;
}

.blogfoter {
    background-color: #00216c !important;
    color: white !important;
}

/* Glyphicon to Font Awesome mapping */
.glyphicon {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Font Awesome 6 Free';
    font-style: normal;
    font-weight: 900;
    line-height: 1;
}

.glyphicon-eye-open:before {
    content: "\f06e";
}

.glyphicon-heart:before {
    content: "\f004";
}

.glyphicon-heart-empty:before {
    content: "\f08a";
    font-weight: 400;
}

.glyphicon-thumbs-up:before {
    content: "\f164";
}

.glyphicon-thumbs-down:before {
    content: "\f165";
}

/* Indicators custom */
.indicators-custom {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 1px;
    text-indent: -999px;
    cursor: pointer;
    border: 1px solid #000;
    border-radius: 10px;
}

/* Col system fix for mixed BS3/BS5 */
[class*="col-"] {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

@media (prefers-color-scheme: dark) {
    :root {
        --svt-bg: #020617;
        --svt-text: #e2e8f0;
        --svt-muted: #94a3b8;
        --svt-glass: rgba(15, 23, 42, 0.72);
        --svt-border: rgba(148, 163, 184, 0.25);
    }

    body {
        background: linear-gradient(180deg, #020617 0%, #0f172a 100%);
    }

    .svt-pane,
    .svt-kpi-card,
    .svt-widget,
    .svt-panel,
    .modal-content {
        background: rgba(15, 23, 42, 0.82);
        color: var(--svt-text);
    }
}