/* ─────────────────────────────────────────────────────────────
   19_darkmode-fixes.css — Dark mode overrides
   Improves text contrast & element visibility in dark theme
   ─────────────────────────────────────────────────────────────── */

/* ── VARIABLES: darker bg, brighter text ─── */
[data-theme="dark"] {
  --color-bg:        #0f1117;
  --color-bg-alt:    #161a25;
  --bgDark:          #0f1117;
  --bgDark2:         #1a1f2e;
  --bgLight:         #1e2336;
  --color-text:      #f0f0f2;
  --color-text-light:#a8abbe;
  --color-white:     #1a1f2e;
  --white:           #1a1f2e;
  --color-border:    #2b3050;
  --borderColor:     #2b3050;
  --textColor:       #f0f0f2;
}

/* ── NAVBAR LOGO: sistema completo desktop/móvil + light/dark ─── */

/* Tamaño base */
.navbar__logo { flex-shrink: 0; }
.navbar__logo-img { height: 40px; width: auto; max-width: 180px; object-fit: contain; }

/* DESKTOP — por defecto (light mode):
   icono móvil: oculto | logo dark: oculto | logo light: visible */
.navbar__logo--mobile  { display: none !important; }
.navbar__logo--dark    { display: none !important; }
.navbar__logo--light   { display: inline-block !important; }
.navbar__logo--desktop { display: inline-block; }

/* DESKTOP — dark mode:
   logo dark: visible | logo light: oculto */
[data-theme="dark"] .navbar__logo--dark  { display: inline-block !important; }
[data-theme="dark"] .navbar__logo--light { display: none !important; }

/* Texto fallback blanco en dark */
[data-theme="dark"] .navbar__logo-text { color: #fff !important; }

/* MÓVIL (<= 768px): solo el icono, logos de escritorio ocultos en cualquier modo */
@media (max-width: 768px) {
  /* Ocultar explícitamente logos que tengan la clase desktop restrictiva (por retrocompatibilidad) */
  .navbar__logo--desktop { display: none !important; }
  /* Ocultar siempre el icono móvil si alguien vuelve a poner la clase */
  .navbar__logo--mobile { display: none !important; }
}

/* ── BODY & BASE ─── */
[data-theme="dark"] body { background: var(--bgDark); color: var(--color-text); }
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5 { color: #f0f0f2; }
[data-theme="dark"] p   { color: var(--color-text); }
[data-theme="dark"] strong { color: #f0f0f2; }
[data-theme="dark"] small,
[data-theme="dark"] .text-muted { color: var(--color-text-light) !important; }

/* ── LINKS ─── */
[data-theme="dark"] a { color: var(--primary); }

/* ── CARDS ─── */
[data-theme="dark"] .admin-card,
[data-theme="dark"] .admin-card *:not(i):not(.badge):not(button):not(.btn) { color: var(--color-text); }
[data-theme="dark"] .card,
[data-theme="dark"] .blog-card,
[data-theme="dark"] .biz-card { background: var(--bgDark2); border-color: var(--color-border); }
[data-theme="dark"] .blog-card__title a,
[data-theme="dark"] .blog-card__title { color: #f0f0f2 !important; }
[data-theme="dark"] .blog-card__date,
[data-theme="dark"] .blog-card__excerpt { color: var(--color-text-light) !important; }

/* ── SECTIONS ─── */
[data-theme="dark"] .section { background: var(--bgDark); }
[data-theme="dark"] .section--light { background: var(--bgDark2); }
[data-theme="dark"] .section__title { color: #f0f0f2 !important; }
[data-theme="dark"] .section__desc,
[data-theme="dark"] .section__eyebrow { color: var(--color-text-light) !important; }
[data-theme="dark"] .section--dark { background: #090c14; }

/* ── PLAN CARDS ─── */
[data-theme="dark"] .plan-card,
[data-theme="dark"] .card-plan { background: var(--bgDark2) !important; border-color: var(--color-border) !important; }
[data-theme="dark"] .plan-card__name,
[data-theme="dark"] .card-plan-name,
[data-theme="dark"] .plan-card .card-plan-name { color: #f0f0f2 !important; }
[data-theme="dark"] .plan-card__desc,
[data-theme="dark"] .card-plan-desc,
[data-theme="dark"] .plan-card .card-plan-desc { color: var(--color-text-light) !important; }
[data-theme="dark"] .plan-card__features li,
[data-theme="dark"] .card-plan-features li { color: var(--color-text) !important; }
[data-theme="dark"] .plan-card__features li.no,
[data-theme="dark"] .card-plan-features li.opacity-50 { color: #555a70 !important; }
[data-theme="dark"] .plan-card__features li.no i.fas { color: #3d4158 !important; }
[data-theme="dark"] .card-plan-amount { color: var(--primary) !important; }
[data-theme="dark"] .card-plan-period,
[data-theme="dark"] .card-plan-note-muted { color: var(--color-text-light) !important; }
[data-theme="dark"] .card-plan-note-green { color: #6ee7b7 !important; }
[data-theme="dark"] .card-plan-price-wrap { color: var(--color-text) !important; }
/* ── PLAN TOGGLE ─── */
[data-theme="dark"] .plans-toggle,
[data-theme="dark"] .premium-toggle { background: var(--bgDark2) !important; border-color: var(--color-border) !important; }
[data-theme="dark"] .plans-toggle__btn { color: var(--color-text-light); }
[data-theme="dark"] .plans-toggle__btn.active { background: var(--black); color: var(--primary); }
[data-theme="dark"] .premium-toggle button:not(.active) { color: var(--color-text-light) !important; }
[data-theme="dark"] .sale-badge { background: rgba(16,185,129,.15) !important; color: #6ee7b7 !important; border-color: rgba(16,185,129,.3) !important; }
/* ── PLANS SECTION ─── */
[data-theme="dark"] .plans-grid-wrap { background: transparent; }
[data-theme="dark"] .faq-short { color: var(--color-text-light) !important; }
[data-theme="dark"] .faq-short p { color: var(--color-text-light) !important; }
[data-theme="dark"] .plans-header { background: var(--bgDark2); }
[data-theme="dark"] .plans-title,
[data-theme="dark"] .plans-subtitle,
[data-theme="dark"] .plans-eyebrow { color: var(--color-text) !important; }

/* ── BENEFIT CARDS ─── */
[data-theme="dark"] .benefit-card { background: var(--bgDark2); border-color: var(--color-border); }
[data-theme="dark"] .benefit-card h4 { color: #f0f0f2 !important; }
[data-theme="dark"] .benefit-card p { color: var(--color-text-light) !important; }

/* ── STEP CARDS ─── */
[data-theme="dark"] .step-card__title { color: #f0f0f2 !important; }
[data-theme="dark"] .step-card__desc { color: var(--color-text-light) !important; }

/* ── CATEGORY CARDS ─── */
[data-theme="dark"] .category-card { background: var(--bgDark2); border-color: var(--color-border); }
[data-theme="dark"] .category-card__name { color: #f0f0f2 !important; }
[data-theme="dark"] .category-card__count { color: var(--color-text-light) !important; }

/* ── BIZ CARDS ─── */
[data-theme="dark"] .biz-card__name { color: #f0f0f2 !important; }
[data-theme="dark"] .biz-card__meta,
[data-theme="dark"] .biz-card__category { color: var(--color-text-light) !important; }
[data-theme="dark"] .biz-card__footer { background: var(--bgDark2); border-color: var(--color-border); }

/* ── FORMS ─── */
[data-theme="dark"] label { color: var(--color-text) !important; }
[data-theme="dark"] .form-hint { color: var(--color-text-light) !important; }
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder,
[data-theme="dark"] select option { color: #6b7285; }

/* ── TABLES ─── */
[data-theme="dark"] .admin-table { color: var(--color-text); }
[data-theme="dark"] .admin-table th { color: var(--color-text-light) !important; background: rgba(255,255,255,.03); }
[data-theme="dark"] .admin-table td { color: var(--color-text); border-color: var(--color-border); }
[data-theme="dark"] .admin-table tbody tr:hover { background: rgba(255,255,255,.03); }

/* ── CLIENT PANEL MAIN AREA ─── */
[data-theme="dark"] .panel-main { background: var(--bgDark); }
[data-theme="dark"] .panel-content { background: transparent; }
[data-theme="dark"] .panel-main footer { border-color: var(--color-border); color: var(--color-text-light); }

/* ── CLIENT PANEL CARDS ─── */
[data-theme="dark"] .stat-card,
[data-theme="dark"] .shortcut-card { background: var(--bgDark2) !important; border-color: var(--color-border) !important; }
[data-theme="dark"] .stat-card .stat-label { color: var(--color-text-light) !important; }
[data-theme="dark"] .stat-card .stat-value { color: #f0f0f2 !important; }

/* ── HERO ─── */
[data-theme="dark"] .hero__eyebrow { color: var(--primary) !important; }
[data-theme="dark"] .hero__title strong { color: #fff !important; }
[data-theme="dark"] .hero__sub { color: rgba(255,255,255,.75) !important; }

/* ── THEME TOGGLE — visible en ambos modos ─── */
/* Light mode: el fondo por defecto (--color-border = #e8ecdf) es muy claro sobre navbar blanco */
.theme-toggle {
  background: rgba(0,0,0,.18) !important;
  border: 1.5px solid rgba(0,0,0,.1) !important;
}
[data-theme="dark"] .theme-toggle {
  background: var(--primary) !important;
  border-color: transparent !important;
}

/* ── BUTTONS ─── */
/* Anular el override genérico de 'a' para todos los botones */
[data-theme="dark"] .btn { color: inherit; }
/* btn--primary: texto oscuro sobre fondo verde */
[data-theme="dark"] .btn--primary,
[data-theme="dark"] a.btn--primary,
[data-theme="dark"] .btn--primary:hover,
[data-theme="dark"] a.btn--primary:hover { color: var(--black) !important; background: var(--primary) !important; border-color: var(--primary) !important; }
/* btn--outline: borde y texto primary (visible en oscuro) */
[data-theme="dark"] .btn--outline { color: var(--primary) !important; border-color: var(--primary) !important; background: transparent !important; }
[data-theme="dark"] .btn--outline:hover { background: rgba(var(--primary-rgb,0,212,0),.12) !important; }
/* btn--outline en contextos donde se quiere tono neutro (no primary) — se puede sobrescribir por clase */
[data-theme="dark"] .btn--outline.btn--neutral { color: var(--color-text) !important; border-color: var(--color-border) !important; }
[data-theme="dark"] .btn--ghost { color: var(--color-text-light) !important; }
[data-theme="dark"] .btn--ghost:hover { background: rgba(255,255,255,.06) !important; color: var(--color-text) !important; }
[data-theme="dark"] .btn--dark { background: var(--bgDark2) !important; color: var(--primary) !important; }
/* search-bar__btn usa color: var(--black) sobre fondo primary */
[data-theme="dark"] .search-bar__btn { color: var(--black) !important; }

/* ── BADGES ─── */
[data-theme="dark"] .badge { background: var(--bgDark2); color: var(--color-text-light); }
[data-theme="dark"] .badge--verified { background: rgba(16,185,129,.15); color: #6ee7b7; }
[data-theme="dark"] .badge--pro { background: rgba(var(--primary-rgb,0,212,0),.15); color: var(--primary); }
[data-theme="dark"] .badge--free { background: rgba(107,114,128,.15); color: #9ca3af; }

/* ── DETAILS / ACCORDION ─── */
[data-theme="dark"] details summary { background: var(--bgDark2); color: var(--color-text); }

/* ── PAGINATION ─── */
[data-theme="dark"] .pagination__btn { background: var(--bgDark2); color: var(--color-text-light); border-color: var(--color-border); }
[data-theme="dark"] .pagination__btn.active { background: var(--primary); color: var(--black); border-color: var(--primary); }
[data-theme="dark"] .pagination__btn:hover:not(.active) { background: rgba(255,255,255,.06); }

/* ── FOOTER ─── */
[data-theme="dark"] .footer { background: #090c14; }
[data-theme="dark"] .footer__col-title { color: #f0f0f2 !important; }
[data-theme="dark"] .footer a,
[data-theme="dark"] .footer p,
[data-theme="dark"] .footer li { color: var(--color-text-light) !important; }
[data-theme="dark"] .footer a:hover { color: var(--primary) !important; }
[data-theme="dark"] .footer__bottom { border-color: var(--color-border); color: #555a70 !important; }

/* ── ALERTS ─── */
[data-theme="dark"] .alert { color: var(--color-text); }

/* ── BLOG SHOW SIDEBAR WIDGETS ─── */
[data-theme="dark"] .blog-show-grid aside > div,
[data-theme="dark"] .blog-sidebar-grid aside > div {
  background: var(--bgDark2) !important;
  border-color: var(--color-border) !important;
}

/* ── LISTING PAGE ─── */
[data-theme="dark"] .listing-toolbar,
[data-theme="dark"] .toolbar-wrap {
  background: var(--bgDark2) !important;
  border-color: var(--color-border) !important;
}
[data-theme="dark"] .listing-toolbar__count,
[data-theme="dark"] .toolbar-text { color: var(--color-text-light) !important; }
[data-theme="dark"] .listing-toolbar__sort,
[data-theme="dark"] .toolbar-sort-select { background: var(--bgDark) !important; color: var(--color-text) !important; border-color: var(--color-border) !important; }
[data-theme="dark"] .toolbar-sort-label { color: var(--color-text-light) !important; }

/* ── SUBSCRIPTION PAGE ─── */
[data-theme="dark"] .sub-active-card { border-color: var(--primary) !important; }
[data-theme="dark"] .sub-active-card__plan-name,
[data-theme="dark"] .sub-active-card h3,
[data-theme="dark"] .sub-active-card h4 { color: #f0f0f2 !important; }
[data-theme="dark"] .sub-active-card p,
[data-theme="dark"] .sub-active-card span:not(.badge) { color: var(--color-text-light) !important; }
[data-theme="dark"] .sub-no-plan { background: var(--bgDark2) !important; border-color: var(--color-border) !important; }
[data-theme="dark"] .sub-no-plan h3 { color: #f0f0f2 !important; }
[data-theme="dark"] .sub-history { background: var(--bgDark2) !important; border-color: var(--color-border) !important; }
[data-theme="dark"] .sub-bank-card { background: var(--bgDark2) !important; border-color: var(--color-border) !important; }
[data-theme="dark"] .sub-bank-card h4,
[data-theme="dark"] .sub-bank-card p { color: var(--color-text) !important; }
[data-theme="dark"] .sub-payment-label { color: var(--color-text-light) !important; }

/* ── ADMIN TOPBAR (new design) ─── */
[data-theme="dark"] .admin-topbar { background: #0e111a !important; border-color: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .admin-topbar__search { background: rgba(255,255,255,.05) !important; border-color: rgba(255,255,255,.1) !important; }
[data-theme="dark"] .admin-topbar__search input { color: var(--color-text) !important; }
[data-theme="dark"] .admin-topbar__username { color: #f0f0f2 !important; }
[data-theme="dark"] .admin-topbar__email { color: var(--color-text-light) !important; }

/* ── MODAL / OVERLAY ─── */
[data-theme="dark"] .modal-content,
[data-theme="dark"] .share-modal__inner { background: var(--bgDark2) !important; border-color: var(--color-border) !important; }
[data-theme="dark"] .modal-content h3,
[data-theme="dark"] .share-modal__title { color: #f0f0f2 !important; }

/* ── BIZ DETAIL ─── */
[data-theme="dark"] .hours-row { background: rgba(255,255,255,.04) !important; }
[data-theme="dark"] .hours-day { color: #f0f0f2 !important; }
[data-theme="dark"] .amenity-item { background: rgba(255,255,255,.04) !important; }
[data-theme="dark"] .amenity-item span { color: var(--color-text) !important; }
[data-theme="dark"] .biz-section__text { color: var(--color-text-light) !important; }
[data-theme="dark"] .biz-section__title { color: #f0f0f2 !important; border-color: var(--color-border) !important; }
/* Topbar biz name & meta */
[data-theme="dark"] .biz-topbar__name { color: #f0f0f2 !important; }
[data-theme="dark"] .biz-topbar__meta span { color: var(--color-text-light) !important; }
/* Page banner breadcrumb */
[data-theme="dark"] .page-banner { background: var(--bgDark2); }
[data-theme="dark"] .page-banner__breadcrumb,
[data-theme="dark"] .page-banner__breadcrumb a,
[data-theme="dark"] .page-banner__breadcrumb span { color: var(--color-text-light) !important; }
[data-theme="dark"] .page-banner__breadcrumb a:hover { color: var(--primary) !important; }
/* Biz contact rows */
[data-theme="dark"] .biz-contact-row { color: var(--color-text) !important; border-color: var(--color-border) !important; }
/* Review cards */
[data-theme="dark"] .review-card__author { color: #f0f0f2 !important; }
[data-theme="dark"] .review-card__text { color: var(--color-text-light) !important; }
[data-theme="dark"] .review-summary { background: var(--bgDark2) !important; }

/* ── NAVBAR DROPDOWN TEXT ─── */
[data-theme="dark"] .navbar__dropdown-menu a { color: var(--color-text) !important; }
[data-theme="dark"] .navbar__dropdown-menu a:hover { color: var(--primary) !important; }

/* ── MISC ─── */
[data-theme="dark"] .promo-card { background: rgba(var(--primary-rgb,0,212,0),.06) !important; }
[data-theme="dark"] .location-tag { background: var(--bgDark2) !important; color: var(--color-text-light) !important; }
