/* =============================================
   RAFAELLO — Global Theme Override
   Corporate Blue (AvaGlobal-inspired)
   Applies to ALL pages via layouts/admin.blade.php
   ============================================= */

:root {
	--raf-primary: #1e3a8a;
	--raf-secondary: #3b82f6;
	--raf-light-blue: #60a5fa;
	--raf-accent-gold: #f59e0b;
	--raf-success: #059669;
	--raf-teal: #0d9488;
	--raf-danger: #dc2626;
	--raf-orange: #ea580c;
	--raf-bg: #f0f2f5;
	--raf-card-radius: 12px;
	--raf-sidebar-bg: linear-gradient(180deg, #0f1d3d 0%, #1e3a8a 100%);
}

/* ── BODY / PAGE BACKGROUND ── */
body {
	background-color: var(--raf-bg) !important;
}
.main-content {
	background-color: var(--raf-bg) !important;
}
.page-content {
	padding-top: 1rem !important;
}

/* ══════════════════════════════
   SIDEBAR
   ══════════════════════════════ */
.vertical-menu {
	background: var(--raf-sidebar-bg) !important;
	border-right: none !important;
	box-shadow: 4px 0 15px rgba(0,0,0,0.1) !important;
}

/* Sidebar scrollbar container */
.vertical-menu .h-100,
.vertical-menu [data-simplebar] {
	background: transparent !important;
}

/* Menu section headers */
#sidebar-menu .menu-title,
.metismenu .menu-title {
	color: rgba(255,255,255,0.4) !important;
	font-size: 0.7rem !important;
	text-transform: uppercase !important;
	letter-spacing: 1.5px !important;
	padding: 14px 20px 6px !important;
	background: transparent !important;
	font-weight: 600 !important;
	border-top: 1px solid rgba(255,255,255,0.06);
	margin-top: 4px;
}
#sidebar-menu .menu-title:first-child {
	border-top: none;
	margin-top: 0;
}

/* Menu items */
#sidebar-menu ul li a {
	color: rgba(255,255,255,0.75) !important;
	font-size: 0.875rem !important;
	padding: 10px 20px !important;
	transition: all 0.2s ease !important;
	border-left: 3px solid transparent;
	font-weight: 400 !important;
}
#sidebar-menu ul li a:hover {
	color: #ffffff !important;
	background: rgba(255,255,255,0.08) !important;
	border-left-color: var(--raf-accent-gold) !important;
}
#sidebar-menu ul li a.active,
#sidebar-menu ul li a[aria-expanded="true"],
.mm-active > a {
	color: #ffffff !important;
	background: rgba(255,255,255,0.12) !important;
	border-left-color: var(--raf-accent-gold) !important;
	font-weight: 600 !important;
}

/* Sidebar icons */
#sidebar-menu ul li a svg,
#sidebar-menu ul li a i {
	color: rgba(255,255,255,0.5) !important;
	stroke: rgba(255,255,255,0.5) !important;
	transition: all 0.2s ease !important;
	width: 18px !important;
	height: 18px !important;
}
#sidebar-menu ul li a:hover svg,
#sidebar-menu ul li a:hover i,
#sidebar-menu ul li a.active svg,
#sidebar-menu ul li a.active i,
.mm-active > a svg,
.mm-active > a i {
	color: var(--raf-accent-gold) !important;
	stroke: var(--raf-accent-gold) !important;
}

/* Sidebar brand area */
.navbar-brand-box {
	background: #0f1d3d !important; /* Matches top of sidebar gradient */
	border-bottom: 1px solid rgba(255,255,255,0.06);
}
.logo-txt {
	color: #ffffff !important;
	font-weight: 700 !important;
	font-size: 1.1rem !important;
	letter-spacing: 0.5px;
}
.logo-light { display: block !important; }
.logo-dark  { display: none !important; }

/* ══════════════════════════════
   HEADER / TOPBAR
   ══════════════════════════════ */
#page-topbar {
	background: #ffffff !important;
	border-bottom: 1px solid #e5e7eb !important;
	box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
.header-item {
	color: #475569 !important;
	transition: color 0.2s ease !important;
}
.header-item:hover {
	color: var(--raf-primary) !important;
}

/* User dropdown in header */
.bg-soft-light {
	background: rgba(30,58,138,0.06) !important;
	border-color: #e2e8f0 !important;
}

/* ══════════════════════════════
   PAGE TITLE
   ══════════════════════════════ */
.page-title-box {
	padding-bottom: 0.75rem !important;
	margin-bottom: 0.5rem !important;
}
.page-title-box h4 {
	color: var(--raf-primary) !important;
	font-weight: 700 !important;
	font-size: 1.25rem !important;
}

/* ══════════════════════════════
   CARDS — GLOBAL
   ══════════════════════════════ */
.card {
	border: none !important;
	border-radius: var(--raf-card-radius) !important;
	box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04) !important;
	transition: box-shadow 0.3s ease !important;
}
.card:hover {
	box-shadow: 0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04) !important;
}
.card-header {
	background: #ffffff !important;
	border-bottom: 1px solid #f1f5f9 !important;
	border-radius: var(--raf-card-radius) var(--raf-card-radius) 0 0 !important;
	padding: 1rem 1.25rem !important;
	font-weight: 600 !important;
	color: #1e293b !important;
}

/* ══════════════════════════════
   TABLES — GLOBAL (all lists)
   ══════════════════════════════ */
.table thead th,
.dataTable thead th,
table.dataTable thead th {
	background: #1e3a8a !important; /* Elegant Navy Blue */
	color: #ffffff !important;
	font-size: 0.8rem !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	padding: 10px 14px !important;
	border: none !important;
	white-space: nowrap;
	vertical-align: middle !important;
}

.table tbody td,
.dataTable tbody td {
	padding: 8px 12px !important;
	font-size: 0.875rem !important;
	color: #1e293b !important;
	border-bottom: 1px solid #e2e8f0 !important;
	vertical-align: middle !important;
}

/* Compact inputs inside table cells */
.table td .form-control,
.table td .form-select,
.table td input,
.table td select {
	padding: 4px 8px !important;
	font-size: 0.82rem !important;
	height: auto !important;
	border-radius: 6px !important;
	border: 1px solid #cbd5e1 !important;
}

.table tbody tr:hover,
.dataTable tbody tr:hover {
	background-color: #f8fafc !important;
}

/* DataTables sorting arrows on dark header */
table.dataTable thead th.sorting::before,
table.dataTable thead th.sorting::after,
table.dataTable thead th.sorting_asc::before,
table.dataTable thead th.sorting_asc::after,
table.dataTable thead th.sorting_desc::before,
table.dataTable thead th.sorting_desc::after {
	filter: brightness(10) !important;
	opacity: 0.5 !important;
}
table.dataTable thead th.sorting_asc::after,
table.dataTable thead th.sorting_desc::before {
	opacity: 1 !important;
}

/* DataTables wrapper */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
	padding: 0.75rem !important;
	font-size: 0.875rem !important;
	color: #64748b !important;
}

/* DataTables pagination */
.dataTables_wrapper .dataTables_paginate .paginate_button {
	border-radius: 8px !important;
	margin: 0 2px !important;
	border: none !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
	background: var(--raf-primary) !important;
	color: #fff !important;
	border: none !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
	background: rgba(30,58,138,0.08) !important;
	color: var(--raf-primary) !important;
	border: none !important;
}

/* ══════════════════════════════
   BUTTONS — GLOBAL
   ══════════════════════════════ */
.btn-primary {
	background-color: var(--raf-primary) !important;
	border: 1px solid var(--raf-primary) !important;
	color: #ffffff !important;
	font-weight: 500 !important;
	transition: all 0.2s ease !important;
}
.btn-primary:hover,
.btn-primary:focus {
	background-color: #1e40af !important;
	border-color: #1e40af !important;
}

.btn-success {
	background-color: var(--raf-success) !important;
	border: 1px solid var(--raf-success) !important;
	color: #ffffff !important;
	font-weight: 500 !important;
	transition: all 0.2s ease !important;
}
.btn-success:hover {
	background-color: #047857 !important;
	border-color: #047857 !important;
}

.btn-danger {
	background-color: var(--raf-danger) !important;
	border: 1px solid var(--raf-danger) !important;
	color: #ffffff !important;
	font-weight: 500 !important;
	transition: all 0.2s ease !important;
}
.btn-danger:hover {
	background-color: #b91c1c !important;
	border-color: #b91c1c !important;
}

.btn-warning {
	background-color: var(--raf-accent-gold) !important;
	border: 1px solid var(--raf-accent-gold) !important;
	color: #ffffff !important;
	font-weight: 500 !important;
	transition: all 0.2s ease !important;
}
.btn-warning:hover {
	background-color: #d97706 !important;
	border-color: #d97706 !important;
}

.btn-info {
	background-color: var(--raf-secondary) !important;
	border: 1px solid var(--raf-secondary) !important;
	color: #ffffff !important;
	font-weight: 500 !important;
	transition: all 0.2s ease !important;
}
.btn-info:hover {
	background-color: #2563eb !important;
	border-color: #2563eb !important;
}

.btn-secondary,
.btn-light {
	background: #f8fafc !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 8px !important;
	color: #475569 !important;
	font-weight: 500 !important;
}
.btn-secondary:hover,
.btn-light:hover {
	background: #f1f5f9 !important;
	color: var(--raf-primary) !important;
}

/* Button sizes */
.btn {
	border-radius: 8px !important;
	font-weight: 500 !important;
	transition: all 0.2s ease !important;
}
.btn-sm {
	border-radius: 6px !important;
	font-size: 0.8rem !important;
}

/* ══════════════════════════════
   FORM INPUTS — GLOBAL
   ══════════════════════════════ */
.form-control,
.form-select {
	border: 1px solid #d1d5db !important;
	border-radius: 8px !important;
	font-size: 0.875rem !important;
	padding: 0.5rem 0.75rem !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
	color: #1e293b !important;
}
.form-control:focus,
.form-select:focus {
	border-color: var(--raf-secondary) !important;
	box-shadow: 0 0 0 3px rgba(59,130,246,0.15) !important;
}
.form-label,
label {
	font-weight: 600 !important;
	font-size: 0.82rem !important;
	color: #374151 !important;
	margin-bottom: 0.35rem !important;
}

/* Select2 override */
.select2-container--default .select2-selection--single {
	border: 1px solid #d1d5db !important;
	border-radius: 8px !important;
	height: 38px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 36px !important;
	color: #1e293b !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 36px !important;
}
.select2-dropdown {
	border-radius: 8px !important;
	border: 1px solid #d1d5db !important;
	box-shadow: 0 10px 25px rgba(0,0,0,0.1) !important;
}

/* ══════════════════════════════
   BADGES — GLOBAL
   ══════════════════════════════ */
.badge {
	border-radius: 6px !important;
	font-weight: 600 !important;
	font-size: 0.72rem !important;
	padding: 0.35em 0.65em !important;
	letter-spacing: 0.3px;
}
.badge.bg-primary,
.badge-primary {
	background: linear-gradient(135deg, var(--raf-primary), var(--raf-secondary)) !important;
}
.badge.bg-success,
.badge-success {
	background: linear-gradient(135deg, #059669, #34d399) !important;
}
.badge.bg-danger,
.badge-danger {
	background: linear-gradient(135deg, #dc2626, #f87171) !important;
}
.badge.bg-warning,
.badge-warning {
	background: linear-gradient(135deg, var(--raf-accent-gold), #fbbf24) !important;
	color: #1e293b !important;
}

/* ══════════════════════════════
   ALERTS & NOTIFICATIONS
   ══════════════════════════════ */
.alert {
	border: none !important;
	border-radius: 10px !important;
	font-size: 0.875rem !important;
}
.alert-success {
	background: rgba(5,150,105,0.1) !important;
	color: #065f46 !important;
	border-left: 4px solid #059669 !important;
}
.alert-danger {
	background: rgba(220,38,38,0.1) !important;
	color: #991b1b !important;
	border-left: 4px solid #dc2626 !important;
}
.alert-warning {
	background: rgba(245,158,11,0.1) !important;
	color: #92400e !important;
	border-left: 4px solid var(--raf-accent-gold) !important;
}
.alert-info {
	background: rgba(59,130,246,0.1) !important;
	color: #1e40af !important;
	border-left: 4px solid var(--raf-secondary) !important;
}

/* ══════════════════════════════
   MODALS
   ══════════════════════════════ */
.modal-content {
	border: none !important;
	border-radius: 14px !important;
	box-shadow: 0 25px 50px rgba(0,0,0,0.15) !important;
}
.modal-header {
	background: linear-gradient(135deg, var(--raf-primary), var(--raf-secondary)) !important;
	color: #fff !important;
	border-radius: 14px 14px 0 0 !important;
	padding: 1rem 1.25rem !important;
}
.modal-header .modal-title {
	color: #fff !important;
	font-weight: 700 !important;
}
.modal-header .btn-close {
	filter: brightness(0) invert(1) !important;
}
.modal-footer {
	border-top: 1px solid #f1f5f9 !important;
	padding: 0.75rem 1.25rem !important;
}

/* ══════════════════════════════
   DROPDOWN MENUS
   ══════════════════════════════ */
.dropdown-menu {
	border: 1px solid #e5e7eb !important;
	border-radius: 10px !important;
	box-shadow: 0 10px 25px rgba(0,0,0,0.1) !important;
	padding: 0.5rem !important;
}
.dropdown-item {
	border-radius: 6px !important;
	padding: 0.5rem 0.75rem !important;
	font-size: 0.875rem !important;
	transition: background 0.15s ease !important;
}
.dropdown-item:hover {
	background: rgba(30,58,138,0.06) !important;
	color: var(--raf-primary) !important;
}

/* ══════════════════════════════
   FOOTER
   ══════════════════════════════ */
.footer {
	background: #fff !important;
	border-top: 1px solid #e5e7eb !important;
	color: #94a3b8 !important;
	font-size: 0.8rem !important;
}
.footer a {
	color: var(--raf-secondary) !important;
}

/* ══════════════════════════════
   SCROLLBAR CUSTOM
   ══════════════════════════════ */
.simplebar-scrollbar::before {
	background: rgba(255,255,255,0.2) !important;
	border-radius: 4px !important;
}
.vertical-menu .simplebar-scrollbar::before {
	background: rgba(255,255,255,0.15) !important;
}

/* ══════════════════════════════
   DASHBOARD-SPECIFIC
   ══════════════════════════════ */

/* Stat Cards */
.raf-stat-card {
	border: none !important;
	border-radius: 14px !important;
	overflow: hidden;
	transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
	box-shadow: 0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -2px rgba(0,0,0,0.05) !important;
	animation: rafFadeUp 0.5s ease both;
}
.raf-stat-card:nth-child(2) { animation-delay: 0.06s; }
.raf-stat-card:nth-child(3) { animation-delay: 0.12s; }
.raf-stat-card:nth-child(4) { animation-delay: 0.18s; }
.raf-stat-card:nth-child(5) { animation-delay: 0.24s; }
.raf-stat-card:nth-child(6) { animation-delay: 0.30s; }
.raf-stat-card:hover {
	transform: translateY(-5px) !important;
	box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1) !important;
}
.raf-stat-card .card-body {
	padding: 1.5rem !important;
	display: flex;
	align-items: center;
	gap: 1.25rem;
}

.raf-icon-wrap {
	width: 56px;
	height: 56px;
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.raf-icon-wrap svg,
.raf-icon-wrap i {
	width: 26px !important;
	height: 26px !important;
	color: #fff !important;
	stroke: #fff !important;
}
.raf-icon-navy    { background: linear-gradient(135deg, #1e3a8a, #3b82f6); }
.raf-icon-blue    { background: linear-gradient(135deg, #3b82f6, #60a5fa); }
.raf-icon-green   { background: linear-gradient(135deg, #059669, #34d399); }
.raf-icon-teal    { background: linear-gradient(135deg, #0d9488, #2dd4bf); }
.raf-icon-orange  { background: linear-gradient(135deg, #ea580c, #fb923c); }
.raf-icon-red     { background: linear-gradient(135deg, #dc2626, #f87171); }

.raf-stat-number {
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.2;
	color: #1e293b;
	margin-bottom: 2px;
}
.raf-stat-label {
	font-size: 0.8rem;
	font-weight: 500;
	color: #64748b;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* Section Headers */
.raf-section-title {
	font-size: 1.1rem;
	font-weight: 700;
	color: #1e293b;
	margin-bottom: 1.25rem;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}
.raf-section-title::before {
	content: '';
	width: 4px;
	height: 22px;
	border-radius: 2px;
	background: linear-gradient(180deg, var(--raf-primary), var(--raf-secondary));
	display: inline-block;
}

/* Dashboard Tables */
.raf-table-card {
	border: none !important;
	border-radius: 14px !important;
	overflow: hidden;
	box-shadow: 0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -2px rgba(0,0,0,0.05) !important;
	animation: rafFadeUp 0.5s ease 0.35s both;
}
.raf-table-card .card-body { padding: 0 !important; }
.raf-table { margin: 0 !important; }
.raf-table tbody td { border-bottom: 1px solid #f1f5f9 !important; }
.raf-table tbody tr:last-child td { border-bottom: none !important; }

.raf-badge {
	font-size: 0.7rem;
	font-weight: 600;
	padding: 0.3em 0.7em;
	border-radius: 6px;
	display: inline-block;
}
.raf-badge-import { background: rgba(30,58,138,0.1); color: var(--raf-primary); }
.raf-badge-export { background: rgba(5,150,105,0.1); color: var(--raf-success); }

/* Quick Access */
.raf-quick-card {
	border: none !important;
	border-radius: 14px !important;
	box-shadow: 0 4px 6px -1px rgba(0,0,0,0.07) !important;
	animation: rafFadeUp 0.5s ease 0.4s both;
}
.raf-quick-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	padding: 1.15rem 0.75rem;
	border-radius: 12px;
	border: 1px solid #e2e8f0;
	background: #fff;
	color: #334155;
	text-decoration: none;
	font-size: 0.78rem;
	font-weight: 600;
	transition: all 0.25s ease;
	text-align: center;
	line-height: 1.3;
}
.raf-quick-btn:hover {
	background: linear-gradient(135deg, var(--raf-primary), var(--raf-secondary));
	color: #fff;
	border-color: transparent;
	transform: translateY(-3px);
	box-shadow: 0 10px 20px -5px rgba(30,58,138,0.3);
	text-decoration: none;
}
.raf-quick-btn:hover svg { stroke: #fff !important; }
.raf-quick-btn svg {
	width: 24px;
	height: 24px;
	stroke: var(--raf-secondary);
	transition: stroke 0.25s ease;
}

/* Welcome Banner */
.raf-welcome {
	background: linear-gradient(135deg, var(--raf-primary) 0%, var(--raf-secondary) 50%, var(--raf-light-blue) 100%);
	border-radius: 14px;
	padding: 1.75rem 2rem;
	color: #fff;
	margin-bottom: 1.5rem;
	position: relative;
	overflow: hidden;
	animation: rafFadeUp 0.4s ease both;
}
.raf-welcome::after {
	content: '';
	position: absolute;
	right: -40px; top: -40px;
	width: 200px; height: 200px;
	border-radius: 50%;
	background: rgba(255,255,255,0.06);
}
.raf-welcome::before {
	content: '';
	position: absolute;
	right: 60px; bottom: -60px;
	width: 160px; height: 160px;
	border-radius: 50%;
	background: rgba(255,255,255,0.04);
}
.raf-welcome h2 {
	font-size: 1.5rem;
	font-weight: 700;
	margin-bottom: 0.35rem;
	color: #ffffff;
}
.raf-welcome p {
	font-size: 0.9rem;
	color: rgba(255,255,255,0.9);
	margin: 0;
}

/* ── Animations ── */
@keyframes rafFadeUp {
	from { opacity: 0; transform: translateY(16px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* ══════════════════════════════
   DARK MODE OVERRIDES
   ══════════════════════════════ */
body[data-layout-mode="dark"] {
    --raf-bg: #1a1d24;
}
body[data-layout-mode="dark"] .table tbody td,
body[data-layout-mode="dark"] .dataTable tbody td {
    color: #e2e8f0 !important;
    border-bottom-color: #2d3748 !important;
}
body[data-layout-mode="dark"] .table tbody tr:hover,
body[data-layout-mode="dark"] .dataTable tbody tr:hover {
    background-color: rgba(255,255,255,0.03) !important;
}
body[data-layout-mode="dark"] .card {
    background-color: #222736 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2) !important;
}
body[data-layout-mode="dark"] .card-header {
    background-color: #222736 !important;
    color: #f1f5f9 !important;
    border-bottom-color: #2d3748 !important;
}
body[data-layout-mode="dark"] .form-control,
body[data-layout-mode="dark"] .form-select,
body[data-layout-mode="dark"] .table td input,
body[data-layout-mode="dark"] .table td select {
    background-color: #2a3042 !important;
    border-color: #32394e !important;
    color: #e2e8f0 !important;
}
body[data-layout-mode="dark"] .form-label,
body[data-layout-mode="dark"] label {
    color: #e2e8f0 !important;
}
body[data-layout-mode="dark"] #page-topbar {
    background: #222736 !important;
    border-bottom-color: #2d3748 !important;
}
body[data-layout-mode="dark"] .header-item {
    color: #e2e8f0 !important;
}
body[data-layout-mode="dark"] .page-title-box h4 {
    color: #ffffff !important;
}
body[data-layout-mode="dark"] .select2-container--default .select2-selection--single {
    background-color: #2a3042 !important;
    border-color: #32394e !important;
}
body[data-layout-mode="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #e2e8f0 !important;
}
