/* HUELLINK THEME MODE v1 */

.hl-theme-toggle{
    position:fixed;
    right:18px;
    bottom:18px;
    z-index:9999;
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid rgba(120,130,124,.22);
    background:rgba(255,255,255,.92);
    color:#405149;
    display:grid;
    place-items:center;
    cursor:pointer;
    box-shadow:0 10px 28px rgba(25,35,30,.13);
    backdrop-filter:blur(10px);
    font-size:1rem;
}

.hl-theme-toggle:hover{
    transform:translateY(-1px);
}

html[data-theme="dark"]{
    color-scheme:dark;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .hl-app,
html[data-theme="dark"] .hl-public-page,
html[data-theme="dark"] .owner-bg{
    background:
        radial-gradient(circle at 10% 0%,rgba(59,84,73,.22),transparent 26%),
        radial-gradient(circle at 92% 2%,rgba(110,90,56,.13),transparent 24%),
        #111714!important;
    color:#e7ece9!important;
}

html[data-theme="dark"] .hl-sidebar,
html[data-theme="dark"] .hl-topbar,
html[data-theme="dark"] .hl-public-nav{
    background:rgba(22,30,26,.96)!important;
    border-color:#2a342f!important;
    color:#e7ece9!important;
}

html[data-theme="dark"] .hl-main,
html[data-theme="dark"] .hl-content{
    background:transparent!important;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .hl-pet-card,
html[data-theme="dark"] .hl-pet-profile-hero,
html[data-theme="dark"] .hl-profile-kpi,
html[data-theme="dark"] .hl-data-item,
html[data-theme="dark"] .owner-welcome,
html[data-theme="dark"] .owner-pet,
html[data-theme="dark"] .lost-card,
html[data-theme="dark"] .public-hero,
html[data-theme="dark"] .hl-how-section,
html[data-theme="dark"] .hl-how-card,
html[data-theme="dark"] .empty,
html[data-theme="dark"] .hl-plan-banner{
    background:#19211d!important;
    border-color:#2e3933!important;
    box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
    color:#e7ece9!important;
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] strong,
html[data-theme="dark"] .hl-page-intro h1,
html[data-theme="dark"] .hero h1,
html[data-theme="dark"] .public-hero h1,
html[data-theme="dark"] .lost-body h2,
html[data-theme="dark"] .hl-how-head h2,
html[data-theme="dark"] .hl-public-brand strong,
html[data-theme="dark"] .hl-brand strong{
    color:#edf2ef!important;
}

html[data-theme="dark"] p,
html[data-theme="dark"] small,
html[data-theme="dark"] .muted,
html[data-theme="dark"] .lost-sub,
html[data-theme="dark"] .lost-seen,
html[data-theme="dark"] .lost-msg,
html[data-theme="dark"] .results-count,
html[data-theme="dark"] .hl-how-card p,
html[data-theme="dark"] .hl-how-head p{
    color:#aab5af!important;
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .hl-search input,
html[data-theme="dark"] .public-search{
    background:#141b18!important;
    color:#e7ece9!important;
    border-color:#35413b!important;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{
    color:#7f8b85!important;
}

html[data-theme="dark"] .btn{
    background:#202a25!important;
    color:#dfe7e3!important;
    border-color:#36423c!important;
}

html[data-theme="dark"] .btn.primary{
    background:linear-gradient(135deg,#356655,#427765)!important;
    color:#fff!important;
    border-color:#477b68!important;
}

html[data-theme="dark"] .hl-nav a{
    color:#aeb9b3!important;
}

html[data-theme="dark"] .hl-nav a.active{
    background:#203029!important;
    color:#dfece5!important;
    border-color:#33493e!important;
}

html[data-theme="dark"] .hl-user-pill,
html[data-theme="dark"] .hl-icon-btn{
    background:#1c2521!important;
    border-color:#344039!important;
}

html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] table{
    background:#18201c!important;
    border-color:#303b35!important;
}

html[data-theme="dark"] th{
    background:#202824!important;
    color:#aeb8b3!important;
}

html[data-theme="dark"] td{
    color:#d2dad6!important;
    border-color:#2c3731!important;
}

html[data-theme="dark"] .lost-photo,
html[data-theme="dark"] .lost-placeholder,
html[data-theme="dark"] .hl-pet-photo-wrap,
html[data-theme="dark"] .pet-photo{
    background:#202924!important;
}

html[data-theme="dark"] .hl-theme-toggle{
    background:rgba(29,39,34,.94);
    color:#f1e8c7;
    border-color:#3b4841;
    box-shadow:0 10px 28px rgba(0,0,0,.28);
}

/* pantallas Mi Huellink */
html[data-theme="dark"] .mi-shell,
html[data-theme="dark"] .mi-card,
html[data-theme="dark"] .mi-side{
    background:#18201c!important;
    border-color:#303a35!important;
    color:#e7ece9!important;
}

html[data-theme="dark"] .mi-brand,
html[data-theme="dark"] .mi-card h1,
html[data-theme="dark"] .mi-card h2{
    color:#edf2ef!important;
}

html[data-theme="dark"] .mi-card p,
html[data-theme="dark"] .mi-small{
    color:#9eaaa4!important;
}

@media(max-width:600px){
    .hl-theme-toggle{
        right:12px;
        bottom:12px;
        width:40px;
        height:40px;
    }
}


/* =========================================================
   FIX DASHBOARD KPI — MODO OSCURO
   ========================================================= */

/* Forzamos fondos oscuros sobre los fondos pastel del tema premium */
html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(1){
    background:linear-gradient(145deg,#1b2923,#19211d)!important;
    border-color:#30443a!important;
}
html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(1)::before{
    background:#72a58f!important;
}

html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(2){
    background:linear-gradient(145deg,#1c282c,#19211d)!important;
    border-color:#304047!important;
}
html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(2)::before{
    background:#7198aa!important;
}

html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(3){
    background:linear-gradient(145deg,#2a211f,#19211d)!important;
    border-color:#493532!important;
}
html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(3)::before{
    background:#c77872!important;
}

html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(4){
    background:linear-gradient(145deg,#24222c,#19211d)!important;
    border-color:#403b4d!important;
}
html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(4)::before{
    background:#9188ad!important;
}

html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(5){
    background:linear-gradient(145deg,#29261f,#19211d)!important;
    border-color:#494131!important;
}
html[data-theme="dark"] .dashboard-cards .metric-card:nth-child(5)::before{
    background:#c4a262!important;
}

/* Textos legibles dentro de KPI */
html[data-theme="dark"] .dashboard-cards .metric-card,
html[data-theme="dark"] .dashboard-cards .metric-card:link,
html[data-theme="dark"] .dashboard-cards .metric-card:visited{
    color:#e8efeb!important;
    text-decoration:none!important;
}

html[data-theme="dark"] .dashboard-cards .metric-card span{
    color:#bdc8c2!important;
}

html[data-theme="dark"] .dashboard-cards .metric-card strong{
    color:#f5f8f6!important;
    text-shadow:none!important;
}

html[data-theme="dark"] .dashboard-cards .metric-card small{
    color:#94a19a!important;
}

/* Hover sin volver a colores claros */
html[data-theme="dark"] .dashboard-cards .metric-card:hover{
    filter:brightness(1.06);
    box-shadow:0 16px 38px rgba(0,0,0,.25)!important;
}

/* Otros textos habituales del dashboard */
html[data-theme="dark"] .dashboard-row strong,
html[data-theme="dark"] .dashboard-row b{
    color:#e5ece8!important;
}

html[data-theme="dark"] .dashboard-row span,
html[data-theme="dark"] .dashboard-row small{
    color:#9eaaa4!important;
}


/* =========================================================
   FIX SIDEBAR — TU COMUNIDAD HUELLINK EN MODO OSCURO
   ========================================================= */

html[data-theme="dark"] .hl-premium-side-card{
    background:
        radial-gradient(circle at 90% 8%,rgba(177,144,82,.10),transparent 30%),
        linear-gradient(145deg,#202923,#1b231f)!important;
    border:1px solid #344139!important;
    box-shadow:0 12px 30px rgba(0,0,0,.18)!important;
}

html[data-theme="dark"] .hl-premium-side-card .hl-premium-side-icon{
    background:#2d2a21!important;
    color:#d1ad6a!important;
    border:1px solid #514833!important;
}

html[data-theme="dark"] .hl-premium-side-card strong{
    color:#edf2ef!important;
}

html[data-theme="dark"] .hl-premium-side-card p{
    color:#a9b4ae!important;
}

html[data-theme="dark"] .hl-premium-side-card a{
    color:#d3b16e!important;
}

html[data-theme="dark"] .hl-premium-side-card a:hover{
    color:#efd39a!important;
}