/* Generated full manual Bootstrap compatibility CSS */
body{background:#f3f4f6;color:#111827;font-family:Arial,Helvetica,sans-serif}
img{max-width:100%;height:auto}
svg{display:block;flex-shrink:0}
.mobile-safe-container{width:100%;max-width:1200px;margin:0 auto;padding:0 1rem}
.datatable{width:100%}
.datatable thead th{white-space:nowrap}
.dt-buttons .dt-button{display:inline-flex;align-items:center;justify-content:center}
.bg-gradient-to-r,.bg-gradient-to-b,.bg-gradient-to-t,.bg-gradient-to-br{background-image:none!important}
.container{width:100%;max-width:1200px;margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem}
.mx-auto{margin-left:auto;margin-right:auto}
.px-4{padding-left:1rem;padding-right:1rem}
.py-8{padding-top:2rem;padding-bottom:2rem}
.text-2xl{font-size:1.5rem}
.font-semibold{font-weight:600}
.mb-6{margin-bottom:1.5rem}
.bg-green-100{background-color:#dcfce7}
.border{border:1px solid #e5e7eb}
.border-green-400{border-color:#4ade80}
.text-green-700{color:#15803d}
.py-3{padding-top:0.75rem;padding-bottom:0.75rem}
.rounded{border-radius:.25rem}
.mb-4{margin-bottom:1rem}
.bg-white{background-color:#fff}
.rounded-lg{border-radius:.5rem}
.overflow-hidden{overflow:hidden}
.bg-gray-50{background-color:#f9fafb}
.px-6{padding-left:1.5rem;padding-right:1.5rem}
.text-left{text-align:left}
.text-xs{font-size:0.75rem}
.font-medium{font-weight:500}
.text-gray-500{color:#6b7280}
.uppercase{text-transform:uppercase}
.py-4{padding-top:1rem;padding-bottom:1rem}
.px-2{padding-left:0.5rem;padding-right:0.5rem}
.py-1{padding-top:0.25rem;padding-bottom:0.25rem}
.bg-red-100{background-color:#fee2e2}
.text-red-800{color:#991b1b}
.bg-yellow-100{background-color:#fef3c7}
.text-green-800{color:#166534}
.text-indigo-600{color:#4f46e5}
.hover\:text-indigo-900:hover{color:#312e81}
.mr-2{margin-right:0.5rem}
.text-center{text-align:center}
.flex{display:flex}
.justify-between{justify-content:space-between}
.items-center{align-items:center}
.text-gray-600{color:#4b5563}
.hover\:text-gray-900:hover{color:#111827}
.py-2{padding-top:0.5rem;padding-bottom:0.5rem}
.p-6{padding:1.5rem}
.grid{display:grid}
.gap-4{gap:1rem}
.border-b{border-bottom:1px solid #e5e7eb}
.pb-6{padding-bottom:1.5rem}
.text-sm{font-size:0.875rem}
.font-bold{font-weight:700}
.text-lg{font-size:1.125rem}
.text-blue-600{color:#2563eb}
.mt-1{margin-top:0.25rem}
.px-3{padding-left:0.75rem;padding-right:0.75rem}
.mb-8{margin-bottom:2rem}
.mb-2{margin-bottom:0.5rem}
.text-xl{font-size:1.25rem}
.p-4{padding:1rem}
.text-gray-800{color:#1f2937}
.w-full{width:100%}
.block{display:block}
.text-gray-700{color:#374151}
.bg-indigo-600{background-color:#4f46e5}
.hover\:bg-indigo-700:hover{background-color:#4338ca}
.text-white{color:#fff}
.bg-red-600{background-color:#dc2626}
.hover\:bg-red-700:hover{background-color:#b91c1c}
.border-red-400{border-color:#f87171}
.text-red-700{color:#b91c1c}
.w-5{width:1.25rem}
.h-5{height:1.25rem}
.rounded-xl{border-radius:.75rem}
.shadow-sm{box-shadow:0 1px 3px rgba(0,0,0,.08)}
.border-gray-200{border-color:#e5e7eb}
.text-gray-900{color:#111827}
.text-red-500{color:#ef4444}
.border-gray-300{border-color:#d1d5db}
.text-red-600{color:#dc2626}
.bg-blue-50{background-color:#eff6ff}
.border-blue-200{border-color:#bfdbfe}
.text-blue-800{color:#1e40af}
.hidden{display:none!important}
.overflow-y-auto{overflow-y:auto}
.p-2{padding:0.5rem}
.hover\:bg-gray-50:hover{background-color:#f9fafb}
.cursor-pointer{cursor:pointer}
.w-4{width:1rem}
.h-4{height:1rem}
.ml-2{margin-left:0.5rem}
.justify-end{justify-content:flex-end}
.pt-6{padding-top:1.5rem}
.border-t{border-top:1px solid #e5e7eb}
.flex-wrap{flex-wrap:wrap}
.flex-1{flex:1 1 0%}
.min-w-\[200px\]{min-width:200px}
.gap-2{gap:0.5rem}
.bg-gray-200{background-color:#e5e7eb}
.hover\:bg-gray-300:hover{background-color:#d1d5db}
.inline-flex{display:inline-flex}
.overflow-x-auto{overflow-x:auto}
.w-32{width:8rem}
.px-2\.5{padding-left:0.625rem;padding-right:0.625rem}
.py-0\.5{padding-top:0.125rem;padding-bottom:0.125rem}
.rounded-full{border-radius:9999px}
.bg-blue-100{background-color:#dbeafe}
.justify-center{justify-content:center}
.py-1\.5{padding-top:0.375rem;padding-bottom:0.375rem}
.text-indigo-700{color:#4338ca}
.bg-indigo-100{background-color:#e0e7ff}
.hover\:bg-indigo-200:hover{background-color:#c7d2fe}
.text-blue-700{color:#1d4ed8}
.hover\:bg-blue-200:hover{background-color:#bfdbfe}
.hover\:bg-green-200:hover{background-color:#bbf7d0}
.hover\:bg-red-200:hover{background-color:#fecaca}
.mt-4{margin-top:1rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.h-12{height:3rem}
.w-12{width:3rem}
.text-gray-400{color:#9ca3af}
.mt-2{margin-top:0.5rem}
.mt-6{margin-top:1.5rem}
.bg-green-600{background-color:#16a34a}
.hover\:bg-green-700:hover{background-color:#15803d}
.mb-1{margin-bottom:0.25rem}
.bg-gray-100{background-color:#f3f4f6}
.sticky{position:sticky}
.top-0{top:0}
.hover\:bg-gray-100:hover{background-color:#f3f4f6}
.fixed{position:fixed}
.inset-0{top:0;right:0;bottom:0;left:0}
.rounded-2xl{border-radius:1rem}
.p-8{padding:2rem}
.flex-col{flex-direction:column}
.relative{position:relative}
.w-16{width:4rem}
.h-16{height:4rem}
.absolute{position:absolute}
.border-indigo-200{border-color:#c7d2fe}
.gap-6{gap:1.5rem}
.border-l-4{border-left:4px solid currentColor}
.border-indigo-500{border-color:#6366f1}
.text-3xl{font-size:1.875rem}
.w-14{width:3.5rem}
.h-14{height:3.5rem}
.w-7{width:1.75rem}
.h-7{height:1.75rem}
.text-indigo-500{color:#6366f1}
.border-yellow-500{border-color:#f59e0b}
.text-yellow-500{color:#f59e0b}
.border-green-500{border-color:#22c55e}
.text-green-500{color:#22c55e}
.hover\:text-indigo-800:hover{color:#3730a3}
.hover\:text-red-800:hover{color:#991b1b}
.border-gray-100{border-color:#f3f4f6}
.tracking-wider{letter-spacing:.05em}
.bg-yellow-500{background-color:#f59e0b}
.hover\:bg-yellow-600:hover{background-color:#d97706}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.text-gray-300{color:#d1d5db}
.gap-8{gap:2rem}
.bg-indigo-500{background-color:#6366f1}
.mr-4{margin-right:1rem}
.w-24{width:6rem}
.h-24{height:6rem}
.text-green-600{color:#16a34a}
.text-yellow-600{color:#d97706}
.h-full{height:100%}
.pl-4{padding-left:1rem}
.border-red-500{border-color:#ef4444}
.break-all{word-break:break-all}
.items-start{align-items:flex-start}
.align-top{vertical-align:top}
.w-9{width:2.25rem}
.h-9{height:2.25rem}
.mr-3{margin-right:0.75rem}
.flex-shrink-0{flex-shrink:0}
.min-w-0{min-width:0}
.w-3{width:0.75rem}
.h-3{height:0.75rem}
.mr-1{margin-right:0.25rem}
.gap-1{gap:0.25rem}
.border-yellow-300{border-color:#fcd34d}
.border-gray-400{border-color:#9ca3af}
.w-8{width:2rem}
.h-8{height:2rem}
.bg-blue-600{background-color:#2563eb}
.hover\:bg-blue-700:hover{background-color:#1d4ed8}
.bg-orange-500{background-color:#f97316}
.z-50{z-index:50}
.hover\:text-gray-600:hover{color:#4b5563}
.w-6{width:1.5rem}
.h-6{height:1.5rem}
.p-3{padding:0.75rem}
.bg-yellow-50{background-color:#fffbeb}
.border-yellow-200{border-color:#fde68a}
.gap-3{gap:0.75rem}
.hover\:text-gray-800:hover{color:#1f2937}
.w-10{width:2.5rem}
.w-20{width:5rem}
.focus\:border-indigo-500:focus{border-color:#6366f1}
.h-40{height:10rem}
.h-20{height:5rem}
.max-w-full{max-width:100%}
.h-auto{height:auto}
.focus\:border-indigo-300:focus{border-color:#a5b4fc}
.hover\:text-blue-800:hover{color:#1e40af}
.bg-purple-500{background-color:#a855f7}
.leading-tight{line-height:1.25}
.mt-0\.5{margin-top:0.125rem}
.w-3\.5{width:0.875rem}
.h-3\.5{height:0.875rem}
.mr-1\.5{margin-right:0.375rem}
.bg-gray-600{background-color:#4b5563}
.p-5{padding:1.25rem}
.w-11\/12{width:91.66666666666666%}
.shadow-lg{box-shadow:0 10px 15px rgba(0,0,0,.12)}
.pb-4{padding-bottom:1rem}
.pt-4{padding-top:1rem}
.bg-gray-500{background-color:#6b7280}
.hover\:bg-gray-600:hover{background-color:#4b5563}
.shadow{box-shadow:0 1px 3px rgba(0,0,0,.12)}
.appearance-none{appearance:none}
.bg-yellow-600{background-color:#d97706}
.text-indigo-800{color:#3730a3}
.p-12{padding:3rem}
.bg-purple-100{background-color:#f3e8ff}
.mt-8{margin-top:2rem}
.py-10{padding-top:2.5rem;padding-bottom:2.5rem}
.px-8{padding-left:2rem;padding-right:2rem}
.bg-red-50{background-color:#fef2f2}
.border-red-200{border-color:#fecaca}
.hover\:text-red-700:hover{color:#b91c1c}
.bg-green-50{background-color:#f0fdf4}
.border-green-200{border-color:#bbf7d0}
.pt-2{padding-top:0.5rem}
.text-green-900{color:#14532d}
.mb-3{margin-bottom:0.75rem}
.text-green-100{color:#dcfce7}
.ml-1{margin-left:0.25rem}
.hover\:text-green-700:hover{color:#15803d}
.border-blue-500{border-color:#3b82f6}
.text-right{text-align:right}
.ml-4{margin-left:1rem}
.bg-green-500{background-color:#22c55e}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-20{padding-top:5rem;padding-bottom:5rem}
.mb-5{margin-bottom:1.25rem}
.text-base{font-size:1rem}
.hover\:bg-red-50:hover{background-color:#fef2f2}
.border-white{border-color:#fff}
.hover\:shadow-lg:hover{box-shadow:0 10px 15px rgba(0,0,0,.12)}
.mb-10{margin-bottom:2.5rem}
.border-red-100{border-color:#fee2e2}
.h-44{height:11rem}
.inline-block{display:inline-block}
.py-16{padding-top:4rem;padding-bottom:4rem}
.h-56{height:14rem}
.mt-12{margin-top:3rem}
.pt-8{padding-top:2rem}
.bg-blue-400{background-color:#60a5fa}
.hover\:bg-blue-500:hover{background-color:#3b82f6}
.hover\:bg-green-600:hover{background-color:#16a34a}
.h-48{height:12rem}
.mb-12{margin-bottom:3rem}
.pb-2{padding-bottom:0.5rem}
.border-red-300{border-color:#fca5a5}
.bg-indigo-50{background-color:#eef2ff}
.text-indigo-900{color:#312e81}
.text-red-100{color:#fee2e2}
.hover\:text-green-800:hover{color:#166534}
.cursor-not-allowed{cursor:not-allowed}
.overflow-x-hidden{overflow-x:hidden}
.min-h-screen{min-height:100vh}
.w-72{width:18rem}
.max-w-\[85vw\]{max-width:85vw}
.bg-indigo-900{background-color:#312e81}
.text-indigo-300{color:#a5b4fc}
.hover\:text-indigo-200:hover{color:#c7d2fe}
.pb-8{padding-bottom:2rem}
.hover\:bg-indigo-800:hover{background-color:#3730a3}
.border-indigo-700{border-color:#4338ca}
.z-40{z-index:40}
.h-10{height:2.5rem}
.w-64{width:16rem}
.bg-green-900{background-color:#14532d}
.text-green-300{color:#86efac}
.hover\:text-green-200:hover{color:#bbf7d0}
.hover\:bg-green-800:hover{background-color:#166534}
.bottom-0{bottom:0}
.left-0{left:0}
.right-0{right:0}
.border-green-800{border-color:#166534}
.bg-green-700{background-color:#15803d}
.bg-green-800{background-color:#166534}
.bg-red-700{background-color:#b91c1c}
.hover\:bg-red-800:hover{background-color:#991b1b}
.p-2\.5{padding:0.625rem}
.pt-3{padding-top:0.75rem}
.px-5{padding-left:1.25rem;padding-right:1.25rem}
.pt-20{padding-top:5rem}
.h-11{height:2.75rem}
.py-5{padding-top:1.25rem;padding-bottom:1.25rem}
.bg-gray-800{background-color:#1f2937}
.text-indigo-400{color:#818cf8}
.hover\:bg-gray-700:hover{background-color:#374151}
.hover\:text-white:hover{color:#fff}
.text-red-400{color:#f87171}
.bg-red-500{background-color:#ef4444}
.min-w-\[20px\]{min-width:20px}
.border-gray-700{border-color:#374151}
.hover\:text-gray-700:hover{color:#374151}
.hover\:text-gray-500:hover{color:#6b7280}
.focus\:bg-gray-100:focus{background-color:#f3f4f6}
.focus\:text-gray-500:focus{color:#6b7280}
.pb-3{padding-bottom:0.75rem}
.pb-1{padding-bottom:0.25rem}
.mt-3{margin-top:0.75rem}
.bg-blue-900{background-color:#1e3a8a}
.text-blue-300{color:#93c5fd}
.hover\:text-blue-200:hover{color:#bfdbfe}
.hover\:bg-blue-800:hover{background-color:#1e40af}
.border-blue-800{border-color:#1e40af}
.bg-blue-700{background-color:#1d4ed8}
.bg-blue-800{background-color:#1e40af}
.w-40{width:10rem}
.w-28{width:7rem}
.h-36{height:9rem}
.text-4xl{font-size:2.25rem}
.h-64{height:16rem}
.h-32{height:8rem}
.text-yellow-200{color:#fde68a}
.text-orange-500{color:#f97316}
.text-blue-500{color:#3b82f6}
.pt-5{padding-top:1.25rem}
.hover\:border-indigo-400:hover{border-color:#818cf8}
.hover\:text-red-500:hover{color:#ef4444}
.hover\:text-indigo-600:hover{color:#4f46e5}
.hover\:bg-gray-200:hover{background-color:#e5e7eb}
.bg-blue-500{background-color:#3b82f6}
.bg-gray-300{background-color:#d1d5db}
.hover\:bg-yellow-200:hover{background-color:#fde68a}
.h-28{height:7rem}
.pr-2{padding-right:0.5rem}
.ml-3{margin-left:0.75rem}
.text-5xl{font-size:3rem}
.ml-1\.5{margin-left:0.375rem}
.hover\:text-indigo-500:hover{color:#6366f1}
.text-yellow-400{color:#fbbf24}
.w-3\/4{width:75%}
.text-blue-900{color:#1e3a8a}
.text-blue-100{color:#dbeafe}
.hover\:text-blue-700:hover{color:#1d4ed8}
.max-w-\[200px\]{max-width:200px}
.max-w-\[335px\]{max-width:335px}
.pb-12{padding-bottom:3rem}
.w-1\.5{width:0.375rem}
.h-1\.5{height:0.375rem}
.w-2\.5{width:0.625rem}
.h-2\.5{height:0.625rem}
.hover\:bg-black:hover{background-color:#000}
.hover\:border-black:hover{border-color:#000}
.border-black{border-color:#000}
.w-\[448px\]{width:448px}
@media (min-width:640px){
.sm\:px-8{padding-left:2rem;padding-right:2rem}
.sm\:flex-row{flex-direction:row}
.sm\:items-center{align-items:center}
.sm\:justify-between{justify-content:space-between}
.sm\:text-left{text-align:left}
.sm\:px-0{padding-left:0;padding-right:0}
.sm\:w-full{width:100%}
.sm\:mx-auto{margin-left:auto;margin-right:auto}
.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}
.sm\:rounded-lg{border-radius:.5rem}
.sm\:py-24{padding-top:6rem;padding-bottom:6rem}
.sm\:h-24{height:6rem}
.sm\:text-5xl{font-size:3rem}
.sm\:text-xl{font-size:1.25rem}
.sm\:py-16{padding-top:4rem;padding-bottom:4rem}
.sm\:gap-6{gap:1.5rem}
.sm\:p-6{padding:1.5rem}
.sm\:text-3xl{font-size:1.875rem}
.sm\:text-base{font-size:1rem}
.sm\:mb-12{margin-bottom:3rem}
.sm\:gap-8{gap:2rem}
.sm\:h-48{height:12rem}
.sm\:py-20{padding-top:5rem;padding-bottom:5rem}
.sm\:py-14{padding-top:3.5rem;padding-bottom:3.5rem}
.sm\:h-72{height:18rem}
.sm\:text-4xl{font-size:2.25rem}
.sm\:mb-10{margin-bottom:2.5rem}
.sm\:text-2xl{font-size:1.5rem}
.sm\:p-5{padding:1.25rem}
.sm\:w-20{width:5rem}
.sm\:h-20{height:5rem}
.sm\:text-lg{font-size:1.125rem}
.sm\:p-4{padding:1rem}
.sm\:h-11{height:2.75rem}
.sm\:pt-24{padding-top:6rem}
.sm\:mt-16{margin-top:4rem}
.sm\:py-12{padding-top:3rem;padding-bottom:3rem}
.sm\:py-10{padding-top:2.5rem;padding-bottom:2.5rem}
.sm\:mb-6{margin-bottom:1.5rem}
.sm\:py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.sm\:rounded-2xl{border-radius:1rem}
.sm\:flex{display:flex}
.sm\:hidden{display:none!important}
.sm\:gap-3{gap:0.75rem}
.sm\:p-8{padding:2rem}
}
@media (min-width:768px){
.md\:p-6{padding:1.5rem}
.md\:flex-row{flex-direction:row}
.md\:items-center{align-items:center}
.md\:w-64{width:16rem}
.md\:px-6{padding-left:1.5rem;padding-right:1.5rem}
.md\:relative{position:relative}
.md\:hidden{display:none!important}
.md\:ml-0{margin-left:0}
.md\:px-8{padding-left:2rem;padding-right:2rem}
.md\:block{display:block}
.md\:text-xl{font-size:1.25rem}
.md\:flex{display:flex}
.md\:text-left{text-align:left}
}
@media (min-width:1024px){
.lg\:px-8{padding-left:2rem;padding-right:2rem}
.lg\:py-32{padding-top:8rem;padding-bottom:8rem}
.lg\:h-28{height:7rem}
.lg\:text-6xl{font-size:3.75rem}
.lg\:text-2xl{font-size:1.5rem}
.lg\:gap-8{gap:2rem}
.lg\:text-4xl{font-size:2.25rem}
.lg\:py-16{padding-top:4rem;padding-bottom:4rem}
.lg\:flex-row{flex-direction:row}
.lg\:items-start{align-items:flex-start}
.lg\:text-left{text-align:left}
.lg\:gap-6{gap:1.5rem}
.lg\:p-8{padding:2rem}
.lg\:text-lg{font-size:1.125rem}
.lg\:gap-2{gap:0.5rem}
.lg\:px-3{padding-left:0.75rem;padding-right:0.75rem}
.lg\:justify-center{justify-content:center}
.lg\:p-20{padding:5rem}
.lg\:mb-6{margin-bottom:1.5rem}
.lg\:mb-0{margin-bottom:0}
.lg\:w-\[438px\]{width:438px}
.lg\:ml-0{margin-left:0}
.lg\:block{display:block}
}

/* ===== Visual polish ===== */
html, body {
    min-height: 100%;
}

body {
    background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
    color: #0f172a;
    font-family: Inter, Segoe UI, Arial, Helvetica, sans-serif;
}

a {
    text-decoration: none;
}

main {
    min-width: 0;
}

/* Admin shell */
#sidebar {
    width: 18rem !important;
    max-width: 18rem !important;
    background: linear-gradient(180deg, #312e81 0%, #3730a3 100%) !important;
    color: #ffffff !important;
    box-shadow: 8px 0 24px rgba(49, 46, 129, 0.18) !important;
}

#sidebar .sidebar-title h1 {
    margin: 0;
    font-size: 1.75rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -0.02em;
}

#sidebar .sidebar-title p {
    margin: 0.25rem 0 0;
    color: #c7d2fe !important;
}

#sidebar nav a {
    display: flex !important;
    align-items: center !important;
    gap: 0.9rem;
    margin: 0.2rem 0.75rem;
    padding: 0.9rem 1rem !important;
    border-radius: 0.9rem;
    color: #e5e7eb !important;
    transition: all 0.2s ease;
}

#sidebar nav a:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
    transform: translateX(2px);
}

#sidebar nav a svg {
    width: 1.35rem !important;
    height: 1.35rem !important;
    min-width: 1.35rem !important;
    min-height: 1.35rem !important;
    opacity: 0.95;
}

#sidebar nav a.bg-indigo-800,
#sidebar nav a.border-l-4 {
    background: rgba(255, 255, 255, 0.16) !important;
    border-left: 4px solid #ffffff !important;
    color: #ffffff !important;
}

/* Topbar */
header.sticky,
header.bg-white {
    background: rgba(255,255,255,0.94) !important;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid #e5e7eb !important;
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
}

header .text-2xl,
header .text-xl,
header h1,
header h2 {
    color: #0f172a !important;
    font-weight: 800 !important;
}

/* Content cards */
.bg-white.rounded-xl,
.bg-white.rounded-2xl,
.bg-white.shadow-sm,
.bg-white.shadow,
.mobile-card,
.card,
.x-card {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 1rem !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06) !important;
}

/* Buttons */
button,
.btn,
a.bg-indigo-600,
a.bg-red-700,
a.bg-red-600,
a.bg-blue-600,
a.bg-green-600,
a.bg-yellow-500,
a.bg-orange-500,
a.bg-purple-500,
a.bg-gray-600,
a.bg-red-700,
a.bg-red-800,
a.bg-blue-50,
a.bg-red-50,
a.repro-link {
    border-radius: 0.8rem !important;
}

.bg-indigo-600, .bg-indigo-500 {
    background: linear-gradient(180deg, #6366f1 0%, #4f46e5 100%) !important;
    color: #fff !important;
}

.bg-red-600, .bg-red-700, .bg-red-800 {
    color: #fff !important;
}

.bg-green-600 {
    color: #fff !important;
}

/* Tables */
.datatable,
table.dataTable {
    border-collapse: separate !important;
    border-spacing: 0;
}

.datatable thead th,
table.dataTable thead th {
    background: #f8fafc !important;
    color: #475569 !important;
    font-size: 0.74rem !important;
    letter-spacing: 0.06em;
    font-weight: 800 !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.datatable tbody td,
table.dataTable tbody td {
    background: #ffffff;
    color: #1f2937;
    border-bottom: 1px solid #eef2f7 !important;
}

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

/* DataTables controls */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select,
.datatable thead input,
.datatable thead select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
select,
textarea {
    border: 1px solid #cbd5e1 !important;
    border-radius: 0.75rem !important;
    background: #ffffff !important;
    color: #0f172a !important;
    padding: 0.65rem 0.85rem !important;
    box-shadow: none !important;
}

.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus,
.datatable thead input:focus,
.datatable thead select:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: #6366f1 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15) !important;
}

.dt-buttons {
    gap: 0.65rem !important;
}

.dt-button {
    border-radius: 0.8rem !important;
    padding: 0.7rem 1rem !important;
    box-shadow: 0 8px 20px rgba(15,23,42,.10) !important;
}

/* Utility polish */
.text-gray-500 { color: #64748b !important; }
.text-gray-600 { color: #475569 !important; }
.text-gray-700 { color: #334155 !important; }
.text-gray-800 { color: #1e293b !important; }
.text-gray-900 { color: #0f172a !important; }

.bg-gray-50 { background-color: #f8fafc !important; }
.bg-gray-100 { background-color: #f1f5f9 !important; }
.border-gray-200 { border-color: #e2e8f0 !important; }
.border-gray-300 { border-color: #cbd5e1 !important; }

/* Mobile */
@media (max-width: 767px) {
    #sidebar {
        width: 18rem !important;
        max-width: 88vw !important;
    }

    #sidebar nav a {
        margin-left: 0.5rem;
        margin-right: 0.5rem;
    }

    .p-3.sm\:p-4.md\:p-6.lg\:p-8,
    .p-4.md\:p-6,
    .p-6 {
        padding: 1rem !important;
    }
}

/* Admin user action buttons */
.admin-user-actions {
    gap: 12px !important;
}

.admin-user-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 999px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    box-shadow: 0 6px 14px rgba(15,23,42,.05);
}

.admin-user-icon {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: linear-gradient(135deg, #e0e7ff, #c7d2fe);
    color: #4338ca;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex: 0 0 34px;
}

.admin-user-name {
    font-size: 14px;
    font-weight: 700;
    color: #334155;
    white-space: nowrap;
}

.admin-logout-form {
    margin: 0;
}

.admin-logout-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 10px 16px;
    border: none;
    border-radius: 999px;
    background: linear-gradient(135deg, #dc2626, #ef4444);
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 10px 20px rgba(220, 38, 38, 0.22);
    transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.admin-logout-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 24px rgba(220, 38, 38, 0.26);
    opacity: .96;
}

.admin-logout-btn i {
    font-size: 15px;
    line-height: 1;
}

@media (max-width: 767px) {
    .admin-logout-btn {
        padding: 9px 14px;
    }

    .admin-logout-btn span {
        display: none;
    }

    .admin-logout-btn i {
        font-size: 16px;
    }
}