:root {
    --tawtaw-blue: #0D67B7;
    --tawtaw-blue-dark: #004A87;
    --tawtaw-blue-light: #E8F2FF;
    --tawtaw-orange: #FF6600;
    --tawtaw-orange-medium: #FF8533;
    --tawtaw-orange-light: #FFF3E6;
    --tawtaw-success: #4CAF50;
    --tawtaw-error: #E74C3C;
    --tawtaw-warning: #F39C12;
    --tawtaw-info: #2196F3;
    --tawtaw-gray-dark: #333333;
    --tawtaw-gray: #666666;
    --tawtaw-gray-light: #F5F5F5;
}

body {
    color: var(--tawtaw-gray);
    background-color: #f7f9fc;
}

a,
a:focus {
    color: var(--tawtaw-blue);
    transition: color 0.2s ease;
}

a:hover,
a:active {
    color: var(--tawtaw-orange);
}

.topbar,
.topbar .navbar,
.topbar .navbar-header {
    background: linear-gradient(135deg, var(--tawtaw-blue), var(--tawtaw-blue-dark));
    border: none;
    box-shadow: 0 12px 30px rgba(13, 103, 183, 0.35);
}

.left-sidebar,
.sidebar-nav,
.sidebar-nav ul {
    background: var(--tawtaw-blue-dark);
}

.sidebar-nav ul li a,
.sidebar-nav ul li a i {
    color: rgba(255, 255, 255, 0.8);
}

.sidebar-nav > ul > li.active > a,
.sidebar-nav > ul > li.active > a i,
.sidebar-nav ul li a:hover,
.sidebar-nav ul li a:hover i,
.sidebar-nav ul li a.active,
.sidebar-nav ul li a.active i {
    color: var(--tawtaw-orange);
}

.sidebar-nav ul li a::after,
.sidebar-nav ul li a.has-arrow:hover::after,
.sidebar-nav .active > .has-arrow::after,
.sidebar-nav li > .has-arrow.active::after,
.sidebar-nav .has-arrow[aria-expanded="true"]::after {
    border-color: var(--tawtaw-orange);
}

.language-options select option {
    background: var(--tawtaw-blue);
    color: #ffffff;
}

.btn,
.badge,
.label,
.pagination > li > a.page-link {
    border-radius: 999px;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.disabled,
.btn-primary:disabled {
    background: linear-gradient(135deg, var(--tawtaw-orange), var(--tawtaw-orange-medium));
    border-color: var(--tawtaw-orange);
    color: #ffffff;
}

.btn-info,
.btn-info:hover,
.btn-info:focus,
.btn-info:active {
    background: linear-gradient(135deg, var(--tawtaw-blue), var(--tawtaw-blue-dark));
    border-color: var(--tawtaw-blue);
    color: #ffffff;
}

.btn-warning,
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background: linear-gradient(135deg, var(--tawtaw-warning), var(--tawtaw-orange));
    border-color: var(--tawtaw-warning);
    color: #ffffff;
}

.btn-success,
.btn-success:hover,
.btn-success:focus,
.btn-success:active {
    background: var(--tawtaw-success);
    border-color: var(--tawtaw-success);
    color: #ffffff;
}

.btn-danger,
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
    background: var(--tawtaw-error);
    border-color: var(--tawtaw-error);
    color: #ffffff;
}

.bg-primary,
.badge-primary,
.label-primary {
    background-color: var(--tawtaw-blue) !important;
    color: #ffffff !important;
}

.bg-info,
.badge-info,
.label-info {
    background-color: var(--tawtaw-blue-light) !important;
    color: var(--tawtaw-blue) !important;
}

.bg-success,
.badge-success,
.label-success {
    background-color: var(--tawtaw-success) !important;
    color: #ffffff !important;
}

.bg-warning,
.badge-warning,
.label-warning {
    background-color: var(--tawtaw-warning) !important;
    color: #ffffff !important;
}

.bg-danger,
.badge-danger,
.label-danger {
    background-color: var(--tawtaw-error) !important;
    color: #ffffff !important;
}

.text-primary,
.text-info {
    color: var(--tawtaw-blue) !important;
}

.text-warning {
    color: var(--tawtaw-warning) !important;
}

.text-success {
    color: var(--tawtaw-success) !important;
}

.text-danger {
    color: var(--tawtaw-error) !important;
}

.cat-slider {
    border-color: rgba(13, 103, 183, 0.18);
}

.cat-slider .cat-item a.cat-link {
    border-bottom-color: rgba(13, 103, 183, 0.25);
}

.cat-slider .cat-item.section-selected a.cat-link,
.cat-slider .cat-item a.cat-link:hover {
    border-color: var(--tawtaw-orange);
    color: var(--tawtaw-orange);
}

.cat-slider .cat-item.section-selected a.cat-link:after {
    background: var(--tawtaw-orange);
    border-color: var(--tawtaw-orange);
}

.card,
.white-box {
    border-radius: 20px;
    border: 1px solid rgba(13, 103, 183, 0.08);
    box-shadow: 0 18px 40px rgba(13, 103, 183, 0.08);
}

.card .card-title,
.white-box .box-title {
    color: var(--tawtaw-blue-dark);
}

.order-status .data i,
.order-status .count {
    color: var(--tawtaw-orange);
}

.topbar .navbar-nav > li > a,
.topbar ul.dropdown-user li a {
    color: #ffffff;
}

.topbar ul.dropdown-user li a:hover {
    color: var(--tawtaw-orange);
}

/* Fix dropdown menu contrast - Header Profile Dropdown */
.topbar .dropdown-menu {
    background: #ffffff !important;
    border-color: rgba(13, 103, 183, 0.15) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
}

.topbar ul.dropdown-user li .dw-user-box {
    background: #ffffff !important;
}

.topbar ul.dropdown-user li .dw-user-box .u-text h4 {
    color: var(--tawtaw-gray-dark) !important;
    font-weight: 600;
}

.topbar ul.dropdown-user li .dw-user-box .u-text p {
    color: var(--tawtaw-gray) !important;
}

.topbar ul.dropdown-user li a {
    color: var(--tawtaw-gray-dark) !important;
    background: #ffffff !important;
}

.topbar ul.dropdown-user li a:hover {
    background: var(--tawtaw-orange-light) !important;
    color: var(--tawtaw-orange) !important;
}

.topbar ul.dropdown-user li a i {
    color: var(--tawtaw-gray) !important;
}

.topbar ul.dropdown-user li a:hover i {
    color: var(--tawtaw-orange) !important;
}

/* Fix sidebar submenu contrast */
.sidebar-nav ul li ul {
    background: rgba(255, 255, 255, 0.12) !important;
}

.sidebar-nav ul li ul li a {
    color: rgba(255, 255, 255, 0.85) !important;
}

.sidebar-nav ul li ul li a:hover,
.sidebar-nav ul li ul li a.active {
    color: var(--tawtaw-orange) !important;
    background: rgba(255, 102, 0, 0.15) !important;
}

.sidebar-nav ul li ul li a::before {
    background: rgba(255, 255, 255, 0.5) !important;
}

.sidebar-nav ul li ul li a:hover::before,
.sidebar-nav ul li ul li a.active::before {
    background: var(--tawtaw-orange) !important;
}

.page-wrapper,
.container-fluid {
    background: linear-gradient(180deg, rgba(13, 103, 183, 0.05), rgba(13, 103, 183, 0));
}

.table thead th {
    color: var(--tawtaw-blue);
    text-transform: uppercase;
}

.badge-pill,
.label-rounded {
    border-radius: 999px;
    padding: 4px 14px;
}

.timeline > li > .timeline-panel {
    border-color: rgba(13, 103, 183, 0.2);
}

.waves-effect.waves-light .waves-ripple {
    background: rgba(255, 102, 0, 0.25);
}

/* Fix sidebar subtitle (section titles) color for visibility on blue background */
.sidebar-nav > ul > li.nav-subtitle .nav-subtitle-span {
    color: rgba(255, 255, 255, 0.95) !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}