/* ============================================================================
   KASICO FURRY THEME – DARK MODE OVERRIDES
   ============================================================================
   Overrides Tailwind CDN utility classes in [data-theme="dark"] scope.
   Kasico Dark Palette:
     bg-primary  #0D0D0D  (near-black)
     bg-secondary #1A1A1A (charcoal)
     bg-tertiary  #252525 (dark-mid)
     text-primary #F0E8D8 (warm cream)
     gold         #F4B942
     crimson      #E74C3C
   ========================================================================== */

/* ---- Base / Body --------------------------------------------------------- */
[data-theme="dark"] body {
    background-color: #0D0D0D !important;
    color: #F0E8D8 !important;
}

/* ---- Background helpers -------------------------------------------------- */
[data-theme="dark"] .bg-white          { background-color: #1A1A1A !important; }
[data-theme="dark"] .bg-gray-50        { background-color: #0D0D0D !important; }
[data-theme="dark"] .bg-gray-100       { background-color: #1A1A1A !important; }
[data-theme="dark"] .bg-gray-200       { background-color: #252525 !important; }
[data-theme="dark"] .bg-gray-800       { background-color: #050505 !important; }
[data-theme="dark"] .bg-gray-900       { background-color: #030303 !important; }

/* ---- Text helpers -------------------------------------------------------- */
[data-theme="dark"] .text-gray-900     { color: #F0E8D8 !important; }
[data-theme="dark"] .text-gray-800     { color: #E5D8C8 !important; }
[data-theme="dark"] .text-gray-700     { color: #C9B99A !important; }
[data-theme="dark"] .text-gray-600     { color: #B0A090 !important; }
[data-theme="dark"] .text-gray-500     { color: #8a7a68 !important; }
[data-theme="dark"] .text-gray-400     { color: #6b5a4a !important; }
[data-theme="dark"] .text-gray-300     { color: #5a4a3a !important; }

/* ---- Border helpers ------------------------------------------------------ */
[data-theme="dark"] .border-gray-100   { border-color: #3A2A20 !important; }
[data-theme="dark"] .border-gray-200   { border-color: #3A2A20 !important; }
[data-theme="dark"] .border-gray-300   { border-color: #5A3A28 !important; }
[data-theme="dark"] .border-gray-700   { border-color: #5A3A28 !important; }
[data-theme="dark"] .border-gray-800   { border-color: #3A2A20 !important; }

/* ---- Divide helpers ------------------------------------------------------ */
[data-theme="dark"] .divide-gray-200 > * + * { border-color: #3A2A20 !important; }

/* ---- Shadow on dark ------------------------------------------------------ */
[data-theme="dark"] .shadow,
[data-theme="dark"] .shadow-sm,
[data-theme="dark"] .shadow-md,
[data-theme="dark"] .shadow-lg,
[data-theme="dark"] .shadow-xl {
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.75) !important;
}

/* ---- Navigation ---------------------------------------------------------- */
[data-theme="dark"] nav,
[data-theme="dark"] header {
    background-color: #111111 !important;
    border-color: #3A2A20 !important;
}
[data-theme="dark"] .navbar,
[data-theme="dark"] [role="navigation"] {
    background-color: #111111 !important;
    border-color: #3A2A20 !important;
}

/* ---- Cards & Panels ------------------------------------------------------ */
[data-theme="dark"] .card,
[data-theme="dark"] [class*="rounded"][class*="shadow"],
[data-theme="dark"] .product-card {
    background-color: #1A1A1A !important;
    border-color: #3A2A20 !important;
}

/* ---- Sidebar / Filter panel --------------------------------------------- */
[data-theme="dark"] aside,
[data-theme="dark"] .sidebar,
[data-theme="dark"] .filter-panel {
    background-color: #1A1A1A !important;
    border-color: #3A2A20 !important;
}

/* ---- Dropdown menus ------------------------------------------------------ */
[data-theme="dark"] .dropdown,
[data-theme="dark"] [class*="dropdown"] {
    background-color: #1A1A1A !important;
    border-color: #3A2A20 !important;
}
[data-theme="dark"] select option {
    background-color: #1A1A1A;
    color: #F0E8D8;
}

/* ---- Inputs / Forms ------------------------------------------------------ */
[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]),
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    background-color: #252525 !important;
    color: #F0E8D8 !important;
    border-color: #3A2A20 !important;
}
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: #8a7a68 !important;
}
[data-theme="dark"] label {
    color: #C9B99A !important;
}

/* ---- Buttons ------------------------------------------------------------- */
[data-theme="dark"] .btn-secondary,
[data-theme="dark"] button.bg-white {
    background-color: #252525 !important;
    color: #F0E8D8 !important;
    border-color: #3A2A20 !important;
}
[data-theme="dark"] button.bg-white:hover {
    background-color: #303030 !important;
}

/* ---- Tables -------------------------------------------------------------- */
[data-theme="dark"] table,
[data-theme="dark"] thead,
[data-theme="dark"] tbody,
[data-theme="dark"] tr,
[data-theme="dark"] th,
[data-theme="dark"] td {
    border-color: #3A2A20 !important;
}
[data-theme="dark"] thead {
    background-color: #1A1A1A !important;
}
[data-theme="dark"] th {
    color: #C9B99A !important;
}
[data-theme="dark"] tr:hover {
    background-color: #252525 !important;
}

/* ---- Links --------------------------------------------------------------- */
[data-theme="dark"] a:not(.btn):not([class*="button"]) {
    color: #E87060;
}
[data-theme="dark"] a:not(.btn):not([class*="button"]):hover {
    color: #F4B942;
}

/* ---- Breadcrumb ---------------------------------------------------------- */
[data-theme="dark"] .breadcrumb,
[data-theme="dark"] [aria-label="breadcrumb"] {
    color: #8a7a68 !important;
}

/* ---- Badges & Tags ------------------------------------------------------- */
[data-theme="dark"] .badge,
[data-theme="dark"] [class*="badge-"] {
    filter: brightness(0.8);
}

/* ---- Footer -------------------------------------------------------------- */
[data-theme="dark"] footer {
    background: linear-gradient(180deg, #0A0A0A 0%, #050505 100%) !important;
    color: #C9B99A !important;
    border-top: 2px solid #D4A01730 !important;
}

/* ---- Modals / Dialogs ---------------------------------------------------- */
[data-theme="dark"] .modal,
[data-theme="dark"] [role="dialog"] {
    background-color: #1A1A1A !important;
    color: #F0E8D8 !important;
    border-color: #3A2A20 !important;
}
[data-theme="dark"] .modal-backdrop,
[data-theme="dark"] .overlay-backdrop {
    background-color: rgba(0, 0, 0, 0.85) !important;
}

/* ---- Scrollbar ----------------------------------------------------------- */
[data-theme="dark"] ::-webkit-scrollbar-track  { background: #1A1A1A; }
[data-theme="dark"] ::-webkit-scrollbar-thumb  { background: #E74C3C; }
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #C0392B; }

/* ---- Misc Tailwind overrides --------------------------------------------- */
[data-theme="dark"] .ring-gray-200,
[data-theme="dark"] .ring-gray-300        { --tw-ring-color: #3A2A20 !important; }
[data-theme="dark"] .hover\:bg-gray-100:hover { background-color: #252525 !important; }
[data-theme="dark"] .hover\:bg-gray-50:hover  { background-color: #1A1A1A !important; }
[data-theme="dark"] .focus\:bg-white:focus     { background-color: #252525 !important; }
[data-theme="dark"] .hover\:text-gray-900:hover { color: #F0E8D8 !important; }
[data-theme="dark"] .hover\:text-gray-700:hover { color: #C9B99A !important; }
