/* Tailwind-Compat for Bootstrap (Utility-First Layer) */
:root {
  --tw-primary-50:#eff6ff;
  --tw-primary-500:#3b82f6;
  --tw-primary-600:#2563eb;
  --tw-primary-700:#1d4ed8;

  --bs-primary: var(--tw-primary-500);
  --bs-primary-rgb: 59,130,246;

  --tw-gray-50:#f9fafb;
  --tw-gray-100:#f3f4f6;
  --tw-gray-200:#e5e7eb;
  --tw-gray-300:#d1d5db;
  --tw-gray-400:#9ca3af;
  --tw-gray-500:#6b7280;
  --tw-gray-600:#4b5563;
  --tw-gray-700:#374151;
  --tw-gray-800:#1f2937;
  --tw-gray-900:#111827;

  --tw-white:#ffffff;
  --tw-black:#000000;

  --sp-0:0; --sp-0_5:.125rem; --sp-1:.25rem; --sp-1_5:.375rem; --sp-2:.5rem;
  --sp-2_5:.625rem; --sp-3:.75rem; --sp-3_5:.875rem; --sp-4:1rem; --sp-5:1.25rem;
  --sp-6:1.5rem; --sp-7:1.75rem; --sp-8:2rem; --sp-9:2.25rem; --sp-10:2.5rem;
  --sp-12:3rem; --sp-14:3.5rem; --sp-16:4rem;

  --rounded-sm:.25rem; --rounded:.375rem; --rounded-md:.5rem; --rounded-lg:.5rem;
  --rounded-xl:.75rem; --rounded-2xl:1rem; --rounded-3xl:1.5rem; --rounded-full:9999px;

  --shadow-sm:0 1px 2px rgba(0,0,0,.05);
  --shadow:0 1px 3px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.06);
  --shadow-md:0 4px 6px rgba(0,0,0,.1), 0 2px 4px rgba(0,0,0,.06);
  --shadow-lg:0 10px 15px rgba(0,0,0,.1), 0 4px 6px rgba(0,0,0,.05);

  --ring-color: rgba(59,130,246,.45);
  --ring-offset: 2px;
  --ring-width: 2px;
}

/* small resets */
*,*::before,*::after{box-sizing:border-box;}
img,svg,video,canvas,audio,iframe,embed,object{display:block;max-width:100%;}
button{cursor:pointer;}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;}

/* display/position */
.hidden{display:none!important;} .block{display:block!important;} .inline{display:inline!important;} .inline-block{display:inline-block!important;}
.flex{display:flex!important;} .inline-flex{display:inline-flex!important;} .grid{display:grid!important;} .contents{display:contents!important;}
.relative{position:relative!important;} .absolute{position:absolute!important;} .fixed{position:fixed!important;} .sticky{position:sticky!important;}
.inset-0{top:0;right:0;bottom:0;left:0;}
.z-0{z-index:0!important;} .z-10{z-index:10!important;} .z-20{z-index:20!important;} .z-30{z-index:30!important;} .z-40{z-index:40!important;} .z-50{z-index:50!important;}
.overflow-hidden{overflow:hidden!important;} .overflow-auto{overflow:auto!important;}

/* flex/grid helpers */
.flex-row{flex-direction:row!important;} .flex-col{flex-direction:column!important;}
.items-start{align-items:flex-start!important;} .items-center{align-items:center!important;} .items-end{align-items:flex-end!important;}
.justify-start{justify-content:flex-start!important;} .justify-center{justify-content:center!important;} .justify-between{justify-content:space-between!important;} .justify-end{justify-content:flex-end!important;}
.flex-wrap{flex-wrap:wrap!important;} .flex-nowrap{flex-wrap:nowrap!important;}
.gap-1{gap:var(--sp-1)!important;} .gap-2{gap:var(--sp-2)!important;} .gap-3{gap:var(--sp-3)!important;} .gap-4{gap:var(--sp-4)!important;} .gap-6{gap:var(--sp-6)!important;} .gap-8{gap:var(--sp-8)!important;} .gap-10{gap:var(--sp-10)!important;}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))!important;} .grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;} .grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;} .grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important;}

/* sizing */
.w-full{width:100%!important;} .h-full{height:100%!important;} .min-h-screen{min-height:100vh!important;}
.max-w-screen-sm{max-width:640px!important;} .max-w-screen-md{max-width:768px!important;} .max-w-screen-lg{max-width:1024px!important;} .max-w-screen-xl{max-width:1280px!important;}

/* spacing */
.p-0{padding:var(--sp-0)!important;} .p-1{padding:var(--sp-1)!important;} .p-2{padding:var(--sp-2)!important;} .p-3{padding:var(--sp-3)!important;} .p-4{padding:var(--sp-4)!important;} .p-6{padding:var(--sp-6)!important;} .p-8{padding:var(--sp-8)!important;}
.px-2{padding-left:var(--sp-2)!important;padding-right:var(--sp-2)!important;} .px-3{padding-left:var(--sp-3)!important;padding-right:var(--sp-3)!important;}
.px-4{padding-left:var(--sp-4)!important;padding-right:var(--sp-4)!important;} .px-6{padding-left:var(--sp-6)!important;padding-right:var(--sp-6)!important;}
.py-2{padding-top:var(--sp-2)!important;padding-bottom:var(--sp-2)!important;} .py-3{padding-top:var(--sp-3)!important;padding-bottom:var(--sp-3)!important;}
.py-4{padding-top:var(--sp-4)!important;padding-bottom:var(--sp-4)!important;} .py-6{padding-top:var(--sp-6)!important;padding-bottom:var(--sp-6)!important;}
.m-0{margin:var(--sp-0)!important;} .m-2{margin:var(--sp-2)!important;} .m-3{margin:var(--sp-3)!important;} .m-4{margin:var(--sp-4)!important;} .m-6{margin:var(--sp-6)!important;}
.mt-2{margin-top:var(--sp-2)!important;} .mt-4{margin-top:var(--sp-4)!important;} .mt-6{margin-top:var(--sp-6)!important;} .mb-2{margin-bottom:var(--sp-2)!important;} .mb-4{margin-bottom:var(--sp-4)!important;} .mb-6{margin-bottom:var(--sp-6)!important;}
.mx-auto{margin-left:auto!important;margin-right:auto!important;}
.space-y-2>*+*{margin-top:var(--sp-2)!important;} .space-y-4>*+*{margin-top:var(--sp-4)!important;} .space-x-2>*+*{margin-left:var(--sp-2)!important;} .space-x-4>*+*{margin-left:var(--sp-4)!important;}

/* typography */
.text-left{text-align:left!important;} .text-center{text-align:center!important;} .text-right{text-align:right!important;}
.text-xs{font-size:.75rem!important;line-height:1rem!important;} .text-sm{font-size:.875rem!important;line-height:1.25rem!important;}
.text-base{font-size:1rem!important;line-height:1.5rem!important;} .text-lg{font-size:1.125rem!important;line-height:1.75rem!important;}
.text-xl{font-size:1.25rem!important;line-height:1.75rem!important;} .text-2xl{font-size:1.5rem!important;line-height:2rem!important;} .text-3xl{font-size:1.875rem!important;line-height:2.25rem!important;}
.font-medium{font-weight:500!important;} .font-semibold{font-weight:600!important;} .font-bold{font-weight:700!important;} .tracking-tight{letter-spacing:-.015em!important;}

/* colors */
.text-primary{color:var(--tw-primary-500)!important;} .text-primary-600{color:var(--tw-primary-600)!important;} .text-primary-700{color:var(--tw-primary-700)!important;}
.text-gray-600{color:var(--tw-gray-600)!important;} .text-gray-700{color:var(--tw-gray-700)!important;} .text-gray-800{color:var(--tw-gray-800)!important;}
.text-white{color:var(--tw-white)!important;} .text-black{color:var(--tw-black)!important;}
.bg-white{background-color:var(--tw-white)!important;} .bg-black{background-color:var(--tw-black)!important;} .bg-transparent{background-color:transparent!important;}
.bg-primary-50{background-color:var(--tw-primary-50)!important;} .bg-primary-500{background-color:var(--tw-primary-500)!important;color:#fff!important;}
.bg-primary-600{background-color:var(--tw-primary-600)!important;color:#fff!important;} .bg-primary-700{background-color:var(--tw-primary-700)!important;color:#fff!important;}
.bg-gray-50{background-color:var(--tw-gray-50)!important;} .bg-gray-100{background-color:var(--tw-gray-100)!important;}
.border{border-width:1px!important;border-style:solid!important;} .border-0{border-width:0!important;} .border-2{border-width:2px!important;}
.border-transparent{border-color:transparent!important;} .border-primary{border-color:var(--tw-primary-500)!important;}
.border-gray-200{border-color:var(--tw-gray-200)!important;} .border-gray-300{border-color:var(--tw-gray-300)!important;}
.hover\:bg-primary-600:hover{background-color:var(--tw-primary-600)!important;color:#fff!important;}
.hover\:bg-primary-700:hover{background-color:var(--tw-primary-700)!important;color:#fff!important;}
.hover\:text-primary-700:hover{color:var(--tw-primary-700)!important;}

/* radius / shadow */
.rounded{border-radius:var(--rounded)!important;} .rounded-sm{border-radius:var(--rounded-sm)!important;}
.rounded-md{border-radius:var(--rounded-md)!important;} .rounded-lg{border-radius:var(--rounded-lg)!important;}
.rounded-xl{border-radius:var(--rounded-xl)!important;} .rounded-2xl{border-radius:var(--rounded-2xl)!important;}
.rounded-3xl{border-radius:var(--rounded-3xl)!important;} .rounded-full{border-radius:var(--rounded-full)!important;}
.shadow-sm{box-shadow:var(--shadow-sm)!important;} .shadow{box-shadow:var(--shadow)!important;} .shadow-md{box-shadow:var(--shadow-md)!important;} .shadow-lg{box-shadow:var(--shadow-lg)!important;}

/* opacity & transitions */
.opacity-0{opacity:0!important;} .opacity-50{opacity:.5!important;} .opacity-100{opacity:1!important;}
.transition{transition:all .15s ease-in-out!important;}
.transition-colors{transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out!important;}
.duration-200{transition-duration:.2s!important;} .ease-in-out{transition-timing-function:ease-in-out!important;}

/* focus ring + bootstrap focus */
.ring,.focus\:ring:focus{
  outline:none!important;
  box-shadow:0 0 0 var(--ring-offset) #fff, 0 0 0 calc(var(--ring-offset) + var(--ring-width)) var(--ring-color)!important;
}
.ring-0{--ring-width:0px;} .ring-1{--ring-width:1px;} .ring-2{--ring-width:2px;} .ring-4{--ring-width:4px;}
.ring-offset-0{--ring-offset:0px;} .ring-offset-2{--ring-offset:2px;} .ring-primary{--ring-color:rgba(59,130,246,.45);}
.form-control:focus,.form-select:focus,.btn:focus,.btn:focus-visible{
  box-shadow:0 0 0 var(--ring-offset) #fff, 0 0 0 calc(var(--ring-offset)+var(--ring-width)) var(--ring-color)!important;
  border-color:var(--tw-primary-500)!important;
}

/* buttons theming */
.btn-primary{
  --bs-btn-bg:var(--tw-primary-500);
  --bs-btn-border-color:var(--tw-primary-500);
  --bs-btn-hover-bg:var(--tw-primary-600);
  --bs-btn-hover-border-color:var(--tw-primary-600);
  --bs-btn-active-bg:var(--tw-primary-700);
  --bs-btn-active-border-color:var(--tw-primary-700);
}
.btn-outline-primary{
  --bs-btn-color:var(--tw-primary-600);
  --bs-btn-border-color:var(--tw-primary-600);
  --bs-btn-hover-bg:var(--tw-primary-50);
  --bs-btn-hover-color:var(--tw-primary-700);
  --bs-btn-hover-border-color:var(--tw-primary-700);
}
/* Tailwind-y button */
.btn-tw{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
  padding:var(--sp-2) var(--sp-4);border-radius:var(--rounded-md);
  background-color:var(--tw-primary-500);color:#fff;border:1px solid transparent;
  transition:background-color .15s ease,transform .05s ease,box-shadow .15s ease;
}
.btn-tw:hover{background-color:var(--tw-primary-600);}
.btn-tw:active{transform:translateY(1px);background-color:var(--tw-primary-700);}
.btn-tw.outline{background-color:transparent;color:var(--tw-primary-600);border-color:var(--tw-primary-600);}
.btn-tw.outline:hover{background-color:var(--tw-primary-50);}

/* forms */
.form-control,.form-select,.input-group-text{border-radius:var(--rounded-md)!important;}
.form-control,.form-select{padding:var(--sp-2) var(--sp-3)!important;border-color:var(--tw-gray-300)!important;}
.form-control::placeholder{color:var(--tw-gray-500)!important;}
.form-check-input:checked{background-color:var(--tw-primary-600)!important;border-color:var(--tw-primary-600)!important;}

/* components tint */
.alert-primary{color:#0b235a;background-color:color-mix(in srgb,var(--tw-primary-50) 75%, white);border-color:var(--tw-primary-200,#bfdbfe);}
.badge.bg-primary{background-color:var(--tw-primary-600)!important;}
.navbar .nav-link{padding:var(--sp-2) var(--sp-3)!important;}
.navbar .btn{border-radius:var(--rounded-md)!important;}
.card{border-radius:var(--rounded-lg)!important;box-shadow:var(--shadow-sm);}
.modal-content{border-radius:var(--rounded-lg)!important;box-shadow:var(--shadow-lg)!important;}
.dropdown-menu{border-radius:var(--rounded-md)!important;box-shadow:var(--shadow)!important;}

/* helpers */
.container-padding{padding-left:var(--sp-4);padding-right:var(--sp-4);}
.section{padding-top:var(--sp-10);padding-bottom:var(--sp-10);}
.text-muted{color:var(--tw-gray-600)!important;}

/* responsive variants */
@media (min-width:576px){
  .sm\:hidden{display:none!important;} .sm\:block{display:block!important;} .sm\:flex{display:flex!important;} .sm\:grid{display:grid!important;}
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;} .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  .sm\:p-4{padding:var(--sp-4)!important;} .sm\:px-6{padding-left:var(--sp-6)!important;padding-right:var(--sp-6)!important;}
}
@media (min-width:768px){
  .md\:hidden{display:none!important;} .md\:block{display:block!important;} .md\:flex{display:flex!important;} .md\:grid{display:grid!important;}
  .md\:flex-row{flex-direction:row!important;} .md\:flex-col{flex-direction:column!important;}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;} .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;} .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  .md\:p-6{padding:var(--sp-6)!important;} .md\:px-8{padding-left:var(--sp-8)!important;padding-right:var(--sp-8)!important;}
}
@media (min-width:992px){
  .lg\:grid{display:grid!important;} .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;} .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  .lg\:p-8{padding:var(--sp-8)!important;}
}
@media (min-width:1200px){ .xl\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important;} }
@media (min-width:1400px){ .xxl\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))!important;} }
