/* ==========================================================================
   ALTER STUDIO - TEMA OSCURO GLOBAL (DARK THEME)
   ========================================================================== */

/* 1. Tokens y Variables Globales para Tema Oscuro */
:root[data-theme="dark"],
html.dark-theme {
  --bg-primary: #090d16;
  --bg-secondary: #111827;
  --bg-tertiary: #1e293b;
  --studio-workspace-bg: #0b0f19;
  --studio-dots-color: rgba(255, 255, 255, 0.08);
  --surface-floating: rgba(17, 24, 39, 0.94);
  --surface-hover: rgba(255, 255, 255, 0.08);
  --text-primary: #f8fafc;
  --text-secondary: #cbd5e1;
  --text-muted: #94a3b8;
  --border-color: #334155;
  --border-focus: #38bdf8;
  --card-bg: #111827;
  --surface-ground: #070a12;
  --surface-card: #111827;
  --surface-border: rgba(255, 255, 255, 0.08);
  --surface-input: #1e293b;
  color-scheme: dark;
}

/* 2. Switch Toggle UI (iOS / Material Style) */
.header-dropdown-theme-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0.65rem 0.85rem !important;
  border-radius: 10px !important;
  cursor: pointer !important;
  user-select: none !important;
  transition: background 0.15s ease !important;
}

.header-dropdown-theme-row:hover {
  background: rgba(255, 255, 255, 0.06) !important;
}

html:not(.dark-theme) .header-dropdown-theme-row:hover {
  background: #f8fafc !important;
}

.dropdown-theme-info {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.dropdown-theme-icon {
  font-size: 1.05rem;
  line-height: 1;
}

.dropdown-theme-text {
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--text-primary);
}

.alter-theme-switch {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 24px;
  cursor: pointer;
  flex-shrink: 0;
  margin: 0;
}

.alter-theme-switch input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}

.alter-theme-slider {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #cbd5e1;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  border-radius: 999px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.15);
}

.alter-theme-slider::before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 3px;
  bottom: 3px;
  background-color: #ffffff;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(0,0,0,0.25);
}

.alter-theme-switch input:checked + .alter-theme-slider {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
}

.alter-theme-switch input:checked + .alter-theme-slider::before {
  transform: translateX(18px);
}

/* Botón rápido de tema en header para visitantes (Guest) */
.header-theme-quick-btn {
  background: rgba(241, 245, 249, 0.9);
  border: 1px solid #cbd5e1;
  border-radius: 50%;
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 0.95rem;
  transition: all 0.2s ease;
  margin-right: 0.25rem;
}

.header-theme-quick-btn:hover {
  background: #ffffff;
  border-color: #94a3b8;
  transform: scale(1.05);
}

html.dark-theme .header-theme-quick-btn {
  background: #1e293b;
  border-color: #334155;
  color: #f8fafc;
}

html.dark-theme .header-theme-quick-btn:hover {
  background: #334155;
  border-color: #64748b;
}

/* 3. Reglas Globales Body & Reset en Dark Mode */
html.dark-theme,
[data-theme="dark"] {
  background-color: #090d16;
  color: #f8fafc;
}

html.dark-theme body,
[data-theme="dark"] body {
  background-color: #090d16 !important;
  color: #f8fafc !important;
}

/* 4. Header y Navegación en Dark Mode */
html.dark-theme .app-unified-header,
html.dark-theme .header {
  background: rgba(13, 19, 31, 0.94) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .header-argentina-tag {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .header-argentina-tag:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .nav-links a:not(.header-btn-disenar) {
  color: #cbd5e1 !important;
}

html.dark-theme .nav-links a:not(.header-btn-disenar):hover {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .header-user-badge {
  background: rgba(30, 41, 59, 0.85) !important;
  border-color: #334155 !important;
}

html.dark-theme .header-user-badge:hover {
  background: #1e293b !important;
  border-color: #dc2626 !important;
}

html.dark-theme .header-user-name {
  color: #f8fafc !important;
}

html.dark-theme .header-user-dropdown-menu {
  background: #111827 !important;
  border-color: #334155 !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.6) !important;
}

html.dark-theme .dropdown-user-greeting {
  color: #f8fafc !important;
}

html.dark-theme .dropdown-user-email {
  color: #94a3b8 !important;
}

html.dark-theme .header-dropdown-divider {
  background: #1e293b !important;
}

html.dark-theme .header-dropdown-item {
  color: #cbd5e1 !important;
}

html.dark-theme .header-dropdown-item:hover {
  background: #1e293b !important;
  color: #ffffff !important;
}

html.dark-theme .view-toggle-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .view-toggle-btn:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .nav-links {
  /* Mobile menu sheet */
}

@media (max-width: 768px) {
  html.dark-theme .nav-links.active {
    background: #0d131f !important;
    border-color: #334155 !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.6) !important;
  }
}

/* 5. Carrito Lateral (Drawer) en Dark Mode */
html.dark-theme .cart-drawer-panel {
  background: #0d131f !important;
  color: #f8fafc !important;
  box-shadow: none !important;
}

html.dark-theme .cart-drawer-panel.active {
  box-shadow: -8px 0 35px rgba(0, 0, 0, 0.6) !important;
}

html.dark-theme .cart-drawer-header {
  background: #111827 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .cart-drawer-title {
  color: #f8fafc !important;
}

html.dark-theme .cart-drawer-close {
  color: #94a3b8 !important;
}

html.dark-theme .cart-drawer-close:hover {
  color: #f8fafc !important;
}

html.dark-theme .cart-drawer-footer {
  background: #111827 !important;
  border-color: #1e293b !important;
}

html.dark-theme .cart-drawer-subtotal-val {
  color: #f8fafc !important;
}

html.dark-theme .cart-item,
html.dark-theme .cart-drawer-card {
  background: #162032 !important;
  border-color: #273549 !important;
  color: #f8fafc !important;
}

html.dark-theme .cart-drawer-card:hover {
  border-color: rgba(139, 92, 246, 0.6) !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .cart-drawer-card-img-wrap {
  background: #0f172a !important;
  border-color: #273549 !important;
}

html.dark-theme .cart-drawer-card-title,
html.dark-theme .cart-item-title,
html.dark-theme .cart-item-price {
  color: #f8fafc !important;
}

html.dark-theme .cart-drawer-card-price {
  color: #f8fafc !important;
}

html.dark-theme .cart-drawer-card-meta,
html.dark-theme .cart-drawer-card-sides,
html.dark-theme .cart-item-desc {
  color: #94a3b8 !important;
}

html.dark-theme .cart-drawer-card-sides strong {
  color: #f8fafc !important;
}

html.dark-theme .cart-drawer-card-bottom {
  border-top-color: rgba(255, 255, 255, 0.1) !important;
}

/* 6. Studio Desktop (studio.html) en Dark Mode */
html.dark-theme body.tab-designer-active {
  background-color: #090d16 !important;
  color: #f8fafc !important;
}

html.dark-theme .main-layout {
  background-color: #090d16 !important;
}

html.dark-theme .workspace {
  background-color: #0b0f19 !important;
  background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1.2px, transparent 1.2px) !important;
}

html.dark-theme .canvas-board {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Floating Toolbar Dock in Workspace */
html.dark-theme .workspace-floating-toolbar {
  background: rgba(17, 24, 39, 0.94) !important;
  border-color: #334155 !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.5) !important;
}

html.dark-theme .workspace-floating-toolbar .toolbar-divider {
  background-color: #334155 !important;
}

html.dark-theme .workspace-floating-toolbar .toolbar-btn {
  background: transparent !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .workspace-floating-toolbar .toolbar-btn:hover {
  background: #1e293b !important;
  border-color: #8b5cf6 !important;
  color: #ffffff !important;
}

html.dark-theme .workspace-floating-toolbar .toolbar-btn.active {
  background: #8b5cf6 !important;
  border-color: #8b5cf6 !important;
  color: #ffffff !important;
}

html.dark-theme .workspace-floating-toolbar .toolbar-zoom-val {
  background: transparent !important;
  color: #f8fafc !important;
}

html.dark-theme .workspace-floating-toolbar .toolbar-zoom-val:hover {
  background: #1e293b !important;
  color: #38bdf8 !important;
}

html.dark-theme .workspace-floating-toolbar .toolbar-icon-btn {
  color: #cbd5e1 !important;
}

html.dark-theme .workspace-floating-toolbar .toolbar-icon-btn:hover:not(:disabled) {
  background: #1e293b !important;
  color: #ffffff !important;
}

/* Floating Action Buttons in Workspace */
html.dark-theme .btn-change-product-floating,
html.dark-theme .btn-3d-floating,
html.dark-theme .btn-stage-tool,
html.dark-theme .btn-finish-drawing {
  background: #111827 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.45) !important;
}

html.dark-theme .btn-change-product-floating:hover,
html.dark-theme .btn-3d-floating:hover,
html.dark-theme .btn-finish-drawing:hover {
  background: #1e293b !important;
  border-color: #475569 !important;
  color: #ffffff !important;
}

html.dark-theme .btn-change-product-floating .btn-3d-label,
html.dark-theme .btn-3d-floating .btn-3d-label {
  color: #f8fafc !important;
}

/* Volume Nudge Bar under header */
html.dark-theme .header-volume-nudge-strip {
  background: #111827 !important;
  border-bottom: 1px solid #1e293b !important;
}

html.dark-theme .header-volume-nudge-inner {
  color: #f8fafc !important;
}

html.dark-theme .btn-nudge-close {
  color: #94a3b8 !important;
}

html.dark-theme .btn-nudge-close:hover {
  color: #f8fafc !important;
}

/* Right Editor Panel */
html.dark-theme .editor-panel {
  background: #111827 !important;
  border-left-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .section-title {
  color: #cbd5e1 !important;
  border-bottom-color: #1e293b !important;
}

/* Photoshop Style Tool Rail Dark Theme */
html.dark-theme .ps-tools-workspace {
  background-color: #111827 !important;
}

html.dark-theme .ps-tool-rail {
  background-color: #0b111e !important;
  border-right-color: #1e293b !important;
}

html.dark-theme .ps-rail-divider {
  background-color: #1e293b !important;
}

html.dark-theme .ps-tool-btn {
  color: #94a3b8 !important;
}

html.dark-theme .ps-tool-btn:hover {
  background-color: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(139, 92, 246, 0.35) !important;
}

html.dark-theme .ps-tool-btn.active {
  background-color: #1e293b !important;
  border-color: #8b5cf6 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.45), inset 0 0 0 1px #8b5cf6 !important;
}

html.dark-theme .ps-drawer-header {
  border-bottom-color: #1e293b !important;
}

html.dark-theme .ps-drawer-title {
  color: #f8fafc !important;
}

html.dark-theme .btn-ps-collapse {
  background-color: #0f172a !important;
  border-color: #1e293b !important;
  color: #94a3b8 !important;
}

html.dark-theme .btn-ps-collapse:hover {
  background-color: #1e293b !important;
  color: #f8fafc !important;
  border-color: #8b5cf6 !important;
}

/* Tool Tab Control (Legacy support) */
html.dark-theme .tool-tabs,
html.dark-theme .tool-tabs-primary {
  background-color: #0d131f !important;
  border: 1px solid #1e293b !important;
}

html.dark-theme .editor-panel-nav {
  background-color: #111827 !important;
  border-bottom-color: #1e293b !important;
}

html.dark-theme .tool-resource-pill {
  background-color: #0d131f !important;
  border-color: #1e293b !important;
  color: #94a3b8 !important;
}

html.dark-theme .tool-resource-pill:hover {
  background-color: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
  border-color: #334155 !important;
}

html.dark-theme .tool-resource-pill.active {
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.25), rgba(99, 102, 241, 0.25)) !important;
  border-color: #8b5cf6 !important;
  color: #c4b5fd !important;
}

html.dark-theme .panel-subtabs-nav {
  background-color: #0d131f !important;
  border-color: #1e293b !important;
}

html.dark-theme .tool-tab-btn {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: #94a3b8 !important;
}

html.dark-theme .tool-tab-btn:hover:not(.active) {
  background-color: rgba(255, 255, 255, 0.07) !important;
  color: #f8fafc !important;
}

html.dark-theme .tool-tab-btn.active {
  background-color: #1e293b !important;
  color: #ffffff !important;
  border: 1px solid #334155 !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .tool-content {
  background-color: transparent !important;
  color: #f8fafc !important;
}

/* Upload Zone */
html.dark-theme .upload-zone {
  background: #0d131f !important;
  border-color: #334155 !important;
}

html.dark-theme .upload-zone span {
  color: #f8fafc !important;
}

html.dark-theme .upload-zone-sub {
  color: #94a3b8 !important;
}

html.dark-theme .upload-zone:hover {
  border-color: #38bdf8 !important;
  background: rgba(56, 189, 248, 0.06) !important;
}

/* Shapes Tab in Dark Mode */
html.dark-theme .shapes-tab-panel label,
html.dark-theme .compact-label {
  color: #cbd5e1 !important;
}

html.dark-theme .shapes-categories-grid .shape-cat-card {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .shapes-categories-grid .shape-cat-card:hover {
  background: #1e293b !important;
  border-color: #334155 !important;
}

html.dark-theme .shapes-categories-grid .shape-cat-card .shape-cat-name {
  color: #f8fafc !important;
}

html.dark-theme .btn-back-shape-cat {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-back-shape-cat:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .shape-current-cat-badge {
  background: #1e293b !important;
  color: #c084fc !important;
  border-color: #334155 !important;
}

html.dark-theme .btn-shape-mode {
  background: #162032 !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-shape-mode.active {
  background: #2563eb !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
}

html.dark-theme .shape-molds-grid .shape-mold-item,
html.dark-theme .shape-mold-card {
  background: #162032 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .shape-molds-grid .shape-mold-item:hover,
html.dark-theme .shape-mold-card:hover {
  background: #1e293b !important;
  border-color: #8b5cf6 !important;
}

html.dark-theme .shape-mold-name {
  color: #94a3b8 !important;
}

html.dark-theme .rgb-tone-box-compact {
  background: #162032 !important;
  border-color: #334155 !important;
}

html.dark-theme .rgb-picker-btn {
  color: #cbd5e1 !important;
}

html.dark-theme .rgb-hex-box {
  background: #0d131f !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .saved-colors-shelf {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .btn-save-current-color {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-save-current-color:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .saved-colors-empty {
  color: #64748b !important;
}

html.dark-theme .btn-shape-effect {
  background: #162032 !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-shape-effect:hover {
  background: #1e293b !important;
  color: #ffffff !important;
}

html.dark-theme .btn-shape-effect.active {
  background: #8b5cf6 !important;
  border-color: #8b5cf6 !important;
  color: #ffffff !important;
}

/* Draw Tab in Dark Mode */
html.dark-theme #btnResumeDrawingSidebar {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme #btnResumeDrawingSidebar:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .btn-brush-preset {
  background: #162032 !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-brush-preset:hover {
  background: #1e293b !important;
  color: #ffffff !important;
}

html.dark-theme .btn-brush-preset.active {
  background: #2563eb !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
}

/* Text Tab in Dark Mode */
html.dark-theme .font-select-custom,
html.dark-theme #selFloatingFontSelect,
html.dark-theme select {
  background: #162032 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .font-select-custom option,
html.dark-theme #selFloatingFontSelect option,
html.dark-theme select option {
  background: #111827 !important;
  color: #f8fafc !important;
}

html.dark-theme #textContentInput,
html.dark-theme textarea {
  background: #0d131f !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .btn-text-preset {
  background: #162032 !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-text-preset:hover {
  background: #1e293b !important;
  color: #ffffff !important;
}

html.dark-theme .btn-circle-text {
  background: #162032 !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-circle-text:hover {
  background: #1e293b !important;
  color: #ffffff !important;
}

html.dark-theme .btn-circle-text.active {
  background: #8b5cf6 !important;
  border-color: #8b5cf6 !important;
  color: #ffffff !important;
}

/* Drafts Tab */
html.dark-theme .drafts-tab-header {
  border-bottom-color: #1e293b !important;
}

html.dark-theme .drafts-tab-title {
  color: #f8fafc !important;
}

html.dark-theme .btn-refresh-drafts {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .draft-card {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .draft-card:hover {
  background: #1e293b !important;
  border-color: #334155 !important;
}

html.dark-theme .draft-card-name {
  color: #f8fafc !important;
}

html.dark-theme .draft-card-date {
  color: #94a3b8 !important;
}

/* Bottom Price & Actions Strip */
html.dark-theme .quantity-discount-box {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .qty-selector-label {
  color: #f8fafc !important;
}

html.dark-theme .qty-counter-pills {
  background: #0d131f !important;
  border-color: #334155 !important;
}

html.dark-theme .btn-qty-step {
  color: #f8fafc !important;
}

html.dark-theme .btn-qty-step:hover {
  background: rgba(139, 92, 246, 0.25) !important;
  color: #c084fc !important;
}

html.dark-theme .input-qty-box {
  color: #f8fafc !important;
}

html.dark-theme .btn-view-tiers {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-view-tiers:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .price-action-strip {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .btn-clear-compact {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-clear-compact:hover {
  background: rgba(239, 68, 68, 0.2) !important;
  border-color: #ef4444 !important;
  color: #ef4444 !important;
}

html.dark-theme .price-breakdown-inline {
  color: #94a3b8 !important;
}

html.dark-theme .price-pill-item strong {
  color: #f8fafc !important;
}

html.dark-theme .price-total-badge {
  background: rgba(139, 92, 246, 0.2) !important;
  border-color: rgba(139, 92, 246, 0.45) !important;
}

html.dark-theme .price-total-lbl {
  color: #c084fc !important;
}

html.dark-theme .price-total-num {
  color: #ffffff !important;
}

html.dark-theme .btn-save-draft {
  color: #94a3b8 !important;
}

html.dark-theme .btn-save-draft:hover {
  color: #c084fc !important;
}

/* Layer Panel (Panel de Capas Desktop y Mobile) */
html.dark-theme .mobile-layer-panel {
  background: #111827 !important;
  border-left-color: #1e293b !important;
  box-shadow: none !important;
}

html.dark-theme .mobile-layer-panel.open {
  box-shadow: -8px 0 32px rgba(0, 0, 0, 0.6) !important;
}

html.dark-theme .layer-panel-header {
  background: #0d131f !important;
  border-bottom-color: #1e293b !important;
}

html.dark-theme .layer-panel-header h4 {
  color: #f8fafc !important;
}

html.dark-theme .layer-panel-body {
  background: #111827 !important;
}

html.dark-theme .layer-item {
  background: #162032 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .layer-item:hover {
  background: #1e293b !important;
  border-color: #334155 !important;
}

html.dark-theme .layer-item.active {
  background: #1e293b !important;
  border-color: #8b5cf6 !important;
  box-shadow: 0 0 0 2px rgba(139, 92, 246, 0.45) !important;
}

html.dark-theme .layer-item.locked {
  background: #0d131f !important;
  border-color: #1e293b !important;
}

html.dark-theme .layer-name-text {
  color: #f8fafc !important;
}

html.dark-theme .layer-type {
  color: #94a3b8 !important;
}

html.dark-theme .layer-thumb-wrap {
  background: #0d131f !important;
  border-color: #1e293b !important;
}

html.dark-theme .layer-btn {
  color: #94a3b8 !important;
}

html.dark-theme .layer-btn:hover {
  background: #1e293b !important;
  color: #ffffff !important;
}

html.dark-theme .layer-control-btn {
  color: #94a3b8 !important;
}

html.dark-theme .layer-control-btn:hover {
  background: #1e293b !important;
  color: #ffffff !important;
}

html.dark-theme .layer-sub-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .layer-sub-btn:hover {
  background: #334155 !important;
  color: #c084fc !important;
  border-color: #8b5cf6 !important;
}

html.dark-theme .layer-panel-footer {
  background: #0d131f !important;
  border-top-color: #1e293b !important;
}

html.dark-theme .layer-btn-secondary {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .layer-btn-secondary:hover {
  background: #334155 !important;
  color: #ffffff !important;
  border-color: #8b5cf6 !important;
}

/* Sublimables Catalog Modal */
html.dark-theme .sublimables-modal-backdrop {
  background: rgba(0, 0, 0, 0.8) !important;
}

html.dark-theme .sublimables-modal-card {
  background: #111827 !important;
  border: 1px solid #1e293b !important;
  color: #f8fafc !important;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.6) !important;
}

html.dark-theme .sublimables-modal-header {
  background: #0d131f !important;
  border-bottom-color: #1e293b !important;
}

html.dark-theme .sublimables-modal-title {
  color: #f8fafc !important;
}

html.dark-theme .sublimables-modal-subtitle {
  color: #94a3b8 !important;
}

html.dark-theme .sublimables-modal-close {
  background: #1e293b !important;
  color: #cbd5e1 !important;
}

html.dark-theme .sublimables-modal-close:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .sublimables-modal-toolbar {
  background: #111827 !important;
  border-bottom-color: #1e293b !important;
}

html.dark-theme .sublimables-cat-pill {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .sublimables-cat-pill:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .sublimables-cat-pill.active {
  background: linear-gradient(135deg, #8b5cf6, #3b82f6) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

html.dark-theme .sublimables-modal-body {
  background: #111827 !important;
}

html.dark-theme .sublimable-item-card {
  background: #162032 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .sublimable-item-card:hover {
  background: #1e293b !important;
  border-color: #8b5cf6 !important;
}

html.dark-theme .sublimable-item-card.active {
  background: #1e1b4b !important;
  border-color: #8b5cf6 !important;
}

html.dark-theme .sublimable-item-name {
  color: #f8fafc !important;
}

html.dark-theme .sublimable-item-cat {
  color: #c084fc !important;
}

html.dark-theme .sublimable-item-price {
  color: #34d399 !important;
}

/* QR Code Modal & Tiers Modal */
html.dark-theme .qr-modal-container {
  background: #111827 !important;
  border: 1px solid #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .qr-modal-header {
  background: #0d131f !important;
  border-bottom-color: #1e293b !important;
}

html.dark-theme .qr-modal-header h3 {
  color: #f8fafc !important;
}

html.dark-theme .qr-label {
  color: #cbd5e1 !important;
}

html.dark-theme .qr-input,
html.dark-theme .qr-select {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .qr-preview-box {
  background: #0d131f !important;
  border-color: #334155 !important;
}

html.dark-theme .qr-modal-footer {
  background: #0d131f !important;
  border-top-color: #1e293b !important;
}

html.dark-theme .qr-type-pill {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .qr-type-pill.active {
  background: #8b5cf6 !important;
  color: #ffffff !important;
}

html.dark-theme .tiers-modal-card {
  background: #111827 !important;
  border: 1px solid #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .tiers-modal-header {
  border-bottom-color: #1e293b !important;
}

html.dark-theme .tier-item {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .tier-range {
  color: #f8fafc !important;
}

html.dark-theme .tier-badge.regular {
  background: #1e293b !important;
  color: #cbd5e1 !important;
}

/* 7. Studio Mobile (studio-mobile.html) en Dark Mode */
html.dark-theme .mobile-app-container {
  background: #090d16 !important;
}

html.dark-theme .mobile-top-bar {
  background: #0d131f !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .mobile-garment-pill {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .mobile-icon-btn,
html.dark-theme .mobile-3d-btn:not(#mobileHeaderPdfBtn) {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .mobile-icon-btn:hover,
html.dark-theme .mobile-3d-btn:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .mobile-sub-bar {
  background: #111827 !important;
  border-bottom: 1px solid #1e293b !important;
}

html.dark-theme .mobile-sides-segmented {
  background: #1e293b !important;
  border-color: #334155 !important;
}

html.dark-theme .mobile-side-tab {
  color: #94a3b8 !important;
}

html.dark-theme .mobile-side-tab.active {
  background: #090d16 !important;
  color: #f8fafc !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .mobile-tool-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .mobile-tool-btn:hover,
html.dark-theme .mobile-tool-btn:active {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .mobile-stage-viewport {
  background-color: #0b0f19 !important;
  background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1.2px, transparent 1.2px) !important;
}

html.dark-theme .mobile-tool-circle-btn {
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  color: #f8fafc !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5) !important;
}

html.dark-theme .mobile-action-bar {
  background: #0d131f !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .mobile-price-val {
  color: #f8fafc !important;
}

html.dark-theme .mobile-qty-counter {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .mobile-btn-qty {
  color: #f8fafc !important;
}

html.dark-theme .mobile-qty-val {
  color: #f8fafc !important;
}

html.dark-theme .mobile-btn-draft {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .mobile-nav-bar {
  background: #0d131f !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .mobile-nav-item {
  color: #94a3b8 !important;
}

html.dark-theme .mobile-nav-item.active {
  color: #38bdf8 !important;
}

html.dark-theme .mobile-sheet {
  background: #111827 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html.dark-theme .mobile-sheet-header {
  background: #0d131f !important;
  border-bottom: 1px solid #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .mobile-sheet-title {
  color: #f8fafc !important;
}

html.dark-theme .mobile-sheet-body {
  background: #111827 !important;
  color: #f8fafc !important;
}

html.dark-theme .mobile-sec-header .mobile-sec-title {
  color: #f8fafc !important;
}

/* Mobile Article Sheet: Hero Card, Garments, Colors, Sizes, Fabrics */
html.dark-theme .mobile-article-hero-card {
  background: #162032 !important;
  border-color: #334155 !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .mobile-article-hero-card .hero-thumb-wrap {
  background: #0d131f !important;
  border-color: #334155 !important;
}

html.dark-theme .mobile-article-hero-card .hero-title {
  color: #f8fafc !important;
}

html.dark-theme .mobile-article-hero-card .hero-price {
  color: #34d399 !important;
}

html.dark-theme .mobile-article-hero-card .hero-pill {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .mobile-garment-card {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .mobile-garment-card:active {
  background: #1e293b !important;
}

html.dark-theme .mobile-garment-card.active {
  background: rgba(139, 92, 246, 0.16) !important;
  border-color: #8b5cf6 !important;
}

html.dark-theme .mobile-garment-card .garment-card-title {
  color: #f8fafc !important;
}

html.dark-theme .mobile-garment-card .garment-card-price {
  color: #34d399 !important;
}

html.dark-theme .mobile-color-chip {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .mobile-color-chip:active {
  background: #1e293b !important;
}

html.dark-theme .mobile-color-chip.active {
  background: rgba(139, 92, 246, 0.16) !important;
  border-color: #8b5cf6 !important;
}

html.dark-theme .mobile-color-chip .color-chip-name {
  color: #f8fafc !important;
}

html.dark-theme .mobile-size-chip {
  background: #162032 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .mobile-size-chip:active {
  background: #1e293b !important;
}

html.dark-theme .mobile-size-chip.active {
  background: #8b5cf6 !important;
  border-color: #8b5cf6 !important;
  color: #ffffff !important;
}

html.dark-theme .mobile-fabric-card {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .mobile-fabric-card:active {
  background: #1e293b !important;
}

html.dark-theme .mobile-fabric-card.active {
  background: rgba(139, 92, 246, 0.16) !important;
  border-color: #8b5cf6 !important;
}

html.dark-theme .mobile-fabric-card .fabric-title {
  color: #f8fafc !important;
}

html.dark-theme .mobile-fabric-card .fabric-desc {
  color: #94a3b8 !important;
}

html.dark-theme .mobile-fabric-card .fabric-price {
  color: #34d399 !important;
}

/* Mobile Hub Cards */
html.dark-theme .mobile-hub-card {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .mobile-hub-card:hover {
  background: #1e293b !important;
  border-color: #334155 !important;
}

html.dark-theme .mobile-hub-card-title {
  color: #f8fafc !important;
}

html.dark-theme .mobile-hub-card-desc {
  color: #94a3b8 !important;
}

/* Mobile Object Context Bar */
html.dark-theme .mobile-object-bar {
  background: #111827 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .mobile-obj-action-btn:not(.danger) {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

/* 7. Studio Wizard (Selección de Producto) en Dark Mode */
html.dark-theme .wizard-overlay {
  background: #090d16 !important;
  color: #f8fafc !important;
}

html.dark-theme .wizard-overlay .wizard-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #f8fafc !important;
}

html.dark-theme .wizard-overlay .wizard-header {
  background: transparent !important;
  border-bottom: 1px solid #1e293b !important;
}

html.dark-theme .wizard-overlay .wizard-header h2 {
  color: #f8fafc !important;
}

html.dark-theme .wizard-overlay .wizard-step-desc {
  color: #94a3b8 !important;
}

html.dark-theme .wizard-overlay .wizard-progress-bar {
  background: #1e293b !important;
}

html.dark-theme .wizard-overlay .step-indicator {
  color: #64748b !important;
}

html.dark-theme .wizard-overlay .step-indicator.active {
  color: #a855f7 !important;
}

html.dark-theme .wizard-overlay .step-indicator.completed {
  color: #10b981 !important;
}

html.dark-theme .wizard-card-option {
  background-color: #111827 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

html.dark-theme .wizard-card-option:hover {
  border-color: #8b5cf6 !important;
  background-color: #162032 !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
}

html.dark-theme .wizard-card-option.active {
  border-color: #8b5cf6 !important;
  background-color: rgba(139, 92, 246, 0.15) !important;
  box-shadow: 0 0 0 2px #8b5cf6, 0 8px 20px rgba(139, 92, 246, 0.25) !important;
}

html.dark-theme .wizard-card-option .option-image-placeholder {
  background-color: #1e293b !important;
  color: #94a3b8 !important;
}

html.dark-theme .wizard-card-option .option-title {
  color: #f8fafc !important;
}

html.dark-theme .wizard-card-option .option-subtitle {
  color: #38bdf8 !important;
}

html.dark-theme .wizard-overlay .wizard-category-card {
  background: #111827 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .wizard-overlay .wizard-category-card:hover:not(.is-disabled) {
  background: #162032 !important;
  border-color: #8b5cf6 !important;
}

html.dark-theme .wizard-overlay .wizard-category-card.is-disabled {
  background: #0d131f !important;
  border-color: #1e293b !important;
  opacity: 0.5 !important;
}

html.dark-theme .wizard-overlay .badge-cat-soon {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #94a3b8 !important;
}

html.dark-theme .wizard-overlay .wizard-footer {
  background: transparent !important;
  border-top: 1px solid #1e293b !important;
}

html.dark-theme .saved-details-bar {
  background: #111827 !important;
  border-color: #1e293b !important;
}

html.dark-theme .prenda-details-popover {
  background: #111827 !important;
  border-color: #334155 !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6) !important;
}

html.dark-theme .popover-header {
  border-bottom-color: #1e293b !important;
}

html.dark-theme .popover-close-btn {
  color: #94a3b8 !important;
}

html.dark-theme .popover-close-btn:hover {
  color: #f8fafc !important;
}

html.dark-theme .saved-details-label {
  color: #94a3b8 !important;
}

html.dark-theme .saved-details-val {
  color: #f8fafc !important;
}

/* Happy Paths Onboarding en Dark Mode */
html.dark-theme .hp-onboarding-callout {
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.15), rgba(236, 72, 153, 0.15)) !important;
  border-color: rgba(139, 92, 246, 0.4) !important;
}

html.dark-theme .hp-onboarding-callout-title {
  color: #f8fafc !important;
}

html.dark-theme .hp-onboarding-callout-desc {
  color: #94a3b8 !important;
}

html.dark-theme .hp-modal-card {
  background: #111827 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .hp-occasion-card {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .hp-occasion-card:hover {
  background: #1e293b !important;
  border-color: #8b5cf6 !important;
}

html.dark-theme .hp-occasion-title {
  color: #f8fafc !important;
}

html.dark-theme .hp-occasion-desc {
  color: #94a3b8 !important;
}

/* 8. Perfil (perfil.html) en Dark Mode */
html.dark-theme .profile-hero {
  background: linear-gradient(135deg, #090d16 0%, #111827 50%, #1e1b4b 100%) !important;
}

html.dark-theme .profile-card,
html.dark-theme .colors-section-card,
html.dark-theme .order-card,
html.dark-theme .tab-pane {
  background: #111827 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .tab-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .tab-btn:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .tab-btn.active {
  background: linear-gradient(135deg, #2563eb, #3b82f6) !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
}

html.dark-theme .form-input,
html.dark-theme .form-select,
html.dark-theme input[type="text"],
html.dark-theme input[type="email"],
html.dark-theme input[type="tel"] {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .form-input:focus {
  border-color: #38bdf8 !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.2) !important;
}

html.dark-theme .order-card-hdr,
html.dark-theme .order-card-ftr {
  background: #162032 !important;
  border-color: #1e293b !important;
}

/* 9. Landing & Home (index.html) en Dark Mode */
html.dark-theme .landing-section,
html.dark-theme .steps-section,
html.dark-theme .features-section {
  background-color: #090d16 !important;
  color: #f8fafc !important;
}

html.dark-theme .product-card,
html.dark-theme .step-card,
html.dark-theme .feature-card {
  background: #111827 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .product-title,
html.dark-theme .step-title {
  color: #f8fafc !important;
}

/* 10. Modales Globales en Dark Mode */
html.dark-theme .modal-card,
html.dark-theme .brand-modal-card,
html.dark-theme .support-modal-card {
  background: #111827 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .modal-header,
html.dark-theme .brand-modal-header,
html.dark-theme .support-modal-header {
  background: #0d131f !important;
  border-color: #1e293b !important;
}

html.dark-theme .modal-footer,
html.dark-theme .brand-modal-footer {
  background: #0d131f !important;
  border-color: #1e293b !important;
}

/* 11. Modal de Autenticación / Bienvenida Studio en Dark Mode */
html.dark-theme .studio-auth-modal-card {
  background: #111827 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .studio-auth-modal-card #studioAuthModalTitle {
  color: #f8fafc !important;
}

html.dark-theme .studio-auth-modal-card p {
  color: #94a3b8 !important;
}

html.dark-theme .studio-auth-modal-card div[style*="background: #f8fafc"] {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .studio-auth-modal-card strong {
  color: #f8fafc !important;
}

html.dark-theme .studio-auth-modal-card span {
  color: #94a3b8 !important;
}

html.dark-theme .studio-auth-modal-card div[style*="background: #fff"] {
  background: #1e293b !important;
  border-color: #334155 !important;
}

html.dark-theme .studio-auth-modal-card #btnStudioAuthRegister {
  background: #2563eb !important;
  color: #ffffff !important;
}

html.dark-theme .studio-auth-modal-card #btnStudioAuthGuest {
  color: #94a3b8 !important;
  border-color: #334155 !important;
}

html.dark-theme .studio-auth-modal-card #btnStudioAuthGuest:hover {
  color: #f8fafc !important;
  border-color: #475569 !important;
}

/* 12. Brand Kit (Contenido de Marca) en Dark Mode */
html.dark-theme .brand-kit-panel {
  background: transparent !important;
  color: #f8fafc !important;
}

html.dark-theme .brand-kit-title {
  color: #f8fafc !important;
}

html.dark-theme .brand-kit-subtitle {
  color: #94a3b8 !important;
}

html.dark-theme .brand-info-card {
  background: #111827 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .brand-display-name {
  color: #f8fafc !important;
}

html.dark-theme .brand-display-slogan {
  color: #94a3b8 !important;
}

html.dark-theme .brand-btn-insert-name {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .brand-btn-insert-name:hover {
  background: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .brand-social-pill {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .brand-social-pill:hover {
  background: #334155 !important;
  color: #ffffff !important;
}

html.dark-theme .brand-section-label {
  color: #94a3b8 !important;
}

html.dark-theme .brand-asset-card {
  background: #111827 !important;
  border-color: #334155 !important;
}

html.dark-theme .brand-asset-thumb-wrap {
  background-color: #1e293b !important;
  background-image: 
    linear-gradient(45deg, #162032 25%, transparent 25%), 
    linear-gradient(-45deg, #162032 25%, transparent 25%), 
    linear-gradient(45deg, transparent 75%, #162032 75%), 
    linear-gradient(-45deg, transparent 75%, #162032 75%) !important;
}

html.dark-theme .brand-asset-meta {
  background: #111827 !important;
  border-top-color: #334155 !important;
}

html.dark-theme .brand-asset-name {
  color: #f8fafc !important;
}

html.dark-theme .brand-extra-elem-card {
  background: #111827 !important;
  border-color: #334155 !important;
}

html.dark-theme .brand-extra-elem-thumb {
  background-color: #1e293b !important;
}

html.dark-theme .brand-extra-elem-name,
html.dark-theme .brand-extra-elem-card div[style*="background"] {
  background: #111827 !important;
  color: #f8fafc !important;
}

html.dark-theme .brand-file-dropzone {
  background: #1e293b !important;
  border-color: #334155 !important;
}

html.dark-theme .brand-file-dropzone strong {
  color: #f8fafc !important;
}

html.dark-theme .brand-file-dropzone span {
  color: #94a3b8 !important;
}

html.dark-theme #brandModalColorsWrap {
  background: #1e293b !important;
  border-color: #334155 !important;
}

html.dark-theme .brand-color-chip {
  background: #162032 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

/* 13. Landing / Home Page en Dark Mode */
html.dark-theme .hero-section {
  background: #111827 !important;
  border-color: #1e293b !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .hero-title {
  color: #f8fafc !important;
}

html.dark-theme .hero-subtitle {
  color: #94a3b8 !important;
}

html.dark-theme .trust-strip {
  color: #cbd5e1 !important;
}

html.dark-theme .btn-hero-empresas,
html.dark-theme .btn-tier-mayorista {
  background: linear-gradient(135deg, #1d4ed8 0%, #6366f1 35%, #8b5cf6 70%, #d946ef 100%) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  box-shadow: 0 4px 22px rgba(99, 102, 241, 0.45) !important;
}

html.dark-theme .btn-hero-empresas:hover,
html.dark-theme .btn-tier-mayorista:hover {
  filter: brightness(1.12) !important;
  box-shadow: 0 8px 30px rgba(139, 92, 246, 0.6) !important;
}

html.dark-theme .desktop-recommend-badge {
  background: #111827 !important;
  border-color: #1e293b !important;
  color: #cbd5e1 !important;
}

html.dark-theme .banner-carousel-wrapper {
  border-color: #1e293b !important;
}

html.dark-theme .banner-carousel {
  background: #111827 !important;
}

html.dark-theme .carousel-nav-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .carousel-nav-btn:hover {
  background: #253349 !important;
  border-color: #475569 !important;
}

html.dark-theme .home-section-title {
  color: #f8fafc !important;
}

html.dark-theme .home-section-subtitle {
  color: #94a3b8 !important;
}

html.dark-theme .home-product-card {
  background: #111827 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .home-product-card:hover {
  border-color: #3b82f6 !important;
  background: #162032 !important;
}

html.dark-theme .home-product-title {
  color: #f8fafc !important;
}

html.dark-theme .home-product-desc {
  color: #94a3b8 !important;
}

html.dark-theme .step-card {
  background: #111827 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .step-card:hover {
  background: #162032 !important;
  border-color: #334155 !important;
}

html.dark-theme .step-name {
  color: #f8fafc !important;
}

html.dark-theme .step-desc {
  color: #94a3b8 !important;
}

html.dark-theme .business-model-card {
  background: #111827 !important;
  border-color: #1e293b !important;
}

html.dark-theme .tier-card-minorista {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .tier-card-mayorista {
  background: rgba(220, 38, 38, 0.08) !important;
  border-color: rgba(220, 38, 38, 0.3) !important;
}

html.dark-theme .tier-card-title {
  color: #f8fafc !important;
}

html.dark-theme .tier-card-desc {
  color: #94a3b8 !important;
}

html.dark-theme .tier-features-list {
  color: #f8fafc !important;
}

html.dark-theme .btn-tier-minorista {
  background: #1e293b !important;
  color: #f8fafc !important;
  border: 1px solid #334155 !important;
}

html.dark-theme .btn-tier-minorista:hover {
  background: #253349 !important;
}

html.dark-theme .tier-discount-box {
  background: #111827 !important;
  border-color: rgba(220, 38, 38, 0.35) !important;
}

html.dark-theme .tier-discount-item {
  background: #1e293b !important;
}

html.dark-theme .tier-discount-item span {
  color: #94a3b8 !important;
}

html.dark-theme .trust-features-card {
  background: #111827 !important;
  border-color: #1e293b !important;
}

html.dark-theme .trust-feature-title {
  color: #f8fafc !important;
}

html.dark-theme .trust-feature-desc {
  color: #94a3b8 !important;
}

/* ==========================================================================
   14. Guía y Manual de Herramientas (herramientas.html) en Dark Mode
   ========================================================================== */
html.dark-theme body {
  background: #090d16 !important;
  color: #f8fafc !important;
}

html.dark-theme .guide-workspace-wrapper {
  background: #090d16 !important;
}

html.dark-theme .guide-index-panel {
  background: #111827 !important;
  border-color: #1e293b !important;
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.4) !important;
}

html.dark-theme .guide-index-panel::-webkit-scrollbar-track {
  background: #111827 !important;
}

html.dark-theme .guide-index-panel::-webkit-scrollbar-thumb {
  background: #334155 !important;
}

html.dark-theme .guide-index-panel::-webkit-scrollbar-thumb:hover {
  background: #475569 !important;
}

html.dark-theme .guide-index-header {
  border-bottom-color: #1e293b !important;
}

html.dark-theme .guide-index-title {
  color: #f8fafc !important;
}

html.dark-theme .guide-index-counter {
  background: rgba(139, 92, 246, 0.25) !important;
  color: #c4b5fd !important;
}

html.dark-theme .guide-mobile-toggle-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .guide-mobile-toggle-btn:hover {
  background: #253349 !important;
}

html.dark-theme .guide-search-input {
  background: #162032 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .guide-search-input:focus {
  background: #1e293b !important;
  border-color: #8b5cf6 !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.25) !important;
}

html.dark-theme .guide-search-icon {
  color: #94a3b8 !important;
}

html.dark-theme .cat-pill-btn {
  background: #1e293b !important;
  color: #94a3b8 !important;
}

html.dark-theme .cat-pill-btn:hover {
  background: #253349 !important;
  color: #f8fafc !important;
}

html.dark-theme .cat-pill-btn.active {
  background: #8b5cf6 !important;
  color: #ffffff !important;
}

html.dark-theme .guide-nav-item {
  color: #cbd5e1 !important;
}

html.dark-theme .guide-nav-item:hover {
  background: #162032 !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .guide-nav-item.active {
  background: linear-gradient(135deg, #1e293b 0%, #253349 100%) !important;
  border-color: #475569 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3) !important;
}

html.dark-theme .nav-item-icon {
  background: #1e293b !important;
  border-color: #334155 !important;
}

html.dark-theme .guide-nav-item.active .nav-item-icon {
  background: rgba(139, 92, 246, 0.3) !important;
  border-color: rgba(139, 92, 246, 0.5) !important;
}

html.dark-theme .nav-item-tag {
  background: #1e293b !important;
  color: #94a3b8 !important;
}

html.dark-theme .guide-nav-item.active .nav-item-tag {
  background: rgba(139, 92, 246, 0.35) !important;
  color: #e2e8f0 !important;
}

html.dark-theme .guide-index-footer {
  border-top-color: #1e293b !important;
}

html.dark-theme .guide-viewer-container {
  background: #090d16 !important;
}

html.dark-theme .guide-viewer-container::-webkit-scrollbar-track {
  background: #090d16 !important;
}

html.dark-theme .guide-viewer-container::-webkit-scrollbar-thumb {
  background: #334155 !important;
}

html.dark-theme .guide-viewer-container::-webkit-scrollbar-thumb:hover {
  background: #475569 !important;
}

html.dark-theme .tool-detail-card {
  background: #111827 !important;
  border-color: #1e293b !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5) !important;
}

html.dark-theme .tool-breadcrumb {
  color: #94a3b8 !important;
}

html.dark-theme .tool-breadcrumb a {
  color: #94a3b8 !important;
}

html.dark-theme .tool-breadcrumb a:hover {
  color: #f8fafc !important;
}

html.dark-theme .tool-breadcrumb span.current {
  color: #a78bfa !important;
}

html.dark-theme .tool-header-row {
  border-bottom-color: #1e293b !important;
}

html.dark-theme .tool-badge-icon {
  background: linear-gradient(135deg, #162032 0%, #1e293b 100%) !important;
  border-color: #334155 !important;
}

html.dark-theme .tool-cat-pill {
  background: rgba(139, 92, 246, 0.2) !important;
  color: #c4b5fd !important;
}

html.dark-theme .tool-main-title {
  color: #f8fafc !important;
}

html.dark-theme .tool-main-subtitle {
  color: #94a3b8 !important;
}

html.dark-theme .section-block-title {
  color: #f8fafc !important;
}

html.dark-theme .tool-lead-text {
  color: #cbd5e1 !important;
}

html.dark-theme .step-card {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .step-card:hover {
  background: #1a273e !important;
  border-color: #334155 !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3) !important;
}

html.dark-theme .step-number {
  background: linear-gradient(135deg, #334155, #1e293b) !important;
  color: #f8fafc !important;
}

html.dark-theme .step-card-title {
  color: #f8fafc !important;
}

html.dark-theme .step-card-text {
  color: #94a3b8 !important;
}

html.dark-theme .control-item {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .control-label {
  color: #f8fafc !important;
}

html.dark-theme .control-desc {
  color: #94a3b8 !important;
}

html.dark-theme .specs-box {
  background: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .specs-box-title,
html.dark-theme .specs-box h4 {
  color: #f8fafc !important;
}

html.dark-theme .specs-list li {
  color: #cbd5e1 !important;
}

html.dark-theme .specs-list li strong {
  color: #f8fafc !important;
}

html.dark-theme .pro-tip-box {
  background: rgba(245, 158, 11, 0.08) !important;
  border-color: rgba(245, 158, 11, 0.25) !important;
  color: #fef08a !important;
}

html.dark-theme .pro-tip-title {
  color: #fde68a !important;
}

html.dark-theme .pro-tip-text {
  color: #fef08a !important;
}

html.dark-theme .screenshot-slot-pro {
  background: #162032 !important;
  border-color: #334155 !important;
}

html.dark-theme .screenshot-slot-title {
  color: #f8fafc !important;
}

html.dark-theme .screenshot-slot-desc {
  color: #94a3b8 !important;
}

html.dark-theme .screenshot-badge-tag {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .tool-bottom-nav {
  border-top-color: #1e293b !important;
}

html.dark-theme .btn-nav-prev,
html.dark-theme .btn-nav-next {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .btn-nav-prev:hover,
html.dark-theme .btn-nav-next:hover {
  background: #253349 !important;
  border-color: #475569 !important;
  color: #f8fafc !important;
}

html.dark-theme .guide-floating-top-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.5) !important;
}

html.dark-theme .guide-bottom-cta {
  background: linear-gradient(135deg, #111827 0%, #1e1b4b 100%) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

/* ==========================================================================
   15. Panel Administrativo (admin.html) en Dark Mode
   ========================================================================== */
html.dark-theme body.admin-body,
html.dark-theme body:has(.admin-sidebar) {
  background-color: #0b1120 !important;
  color: #f8fafc !important;
}

html.dark-theme .admin-top-header {
  background: rgba(15, 23, 42, 0.95) !important;
  border-bottom-color: #1e293b !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

html.dark-theme .admin-sidebar {
  background-color: #070b14 !important;
  border-right-color: rgba(255, 255, 255, 0.08) !important;
}

html.dark-theme .admin-main-content {
  background-color: #0b1120 !important;
  color: #f8fafc !important;
}

html.dark-theme .crud-form-card,
html.dark-theme .crud-table-card {
  background-color: #111827 !important;
  border-color: #1e293b !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
  color: #f8fafc !important;
}

html.dark-theme .stat-card {
  background: #111827 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .stat-val {
  color: #f8fafc !important;
}

html.dark-theme .search-filter-bar {
  background: #111827 !important;
  border-color: #1e293b !important;
}

html.dark-theme .search-input-wrapper input,
html.dark-theme .filter-select-wrapper select,
html.dark-theme .admin-form-group input,
html.dark-theme .admin-form-group select,
html.dark-theme .admin-search-input,
html.dark-theme input.admin-search-input {
  background-color: #1e293b !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

html.dark-theme .crud-table-card thead th {
  background: #162032 !important;
  color: #94a3b8 !important;
  border-bottom-color: #1e293b !important;
}

html.dark-theme .crud-table-card tbody td {
  border-bottom-color: #1e293b !important;
  color: #f1f5f9 !important;
}

html.dark-theme .crud-table-card tbody tr:hover {
  background-color: rgba(139, 92, 246, 0.1) !important;
}

html.dark-theme .modal-content {
  background: #111827 !important;
  border-color: #1e293b !important;
  color: #f8fafc !important;
}

html.dark-theme .modal-header {
  border-bottom-color: #1e293b !important;
}

html.dark-theme .modal-footer {
  border-top-color: #1e293b !important;
}

html.dark-theme .modal-close {
  color: #94a3b8 !important;
}

html.dark-theme .modal-close:hover {
  color: #f8fafc !important;
}

html.dark-theme .admin-action-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .cat-filter-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html.dark-theme .cat-filter-btn:hover {
  background: #273549 !important;
  color: #f8fafc !important;
}

html.dark-theme .cat-filter-btn.active {
  background: #8b5cf6 !important;
  border-color: #8b5cf6 !important;
  color: #ffffff !important;
}

html.dark-theme .catalog-filter-bar {
  background: #111827 !important;
  border-color: #1e293b !important;
}

html.dark-theme .checkbox-select-box {
  background-color: #162032 !important;
  border-color: #1e293b !important;
}

html.dark-theme .checkbox-select-box label {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}


