/* KulturaOne Mapas – mapas.css v1.3.0 | Autor: REYTONI */

/* ═══ VARIABLES ═══ */
.kom-wrap{
    --g:#c9a227;--gl:#e8c84f;--n:#111827;--gd:#374151;--gm:#6b7280;
    --gb:#d1d5db;--gf:#f3f4f6;--w:#ffffff;--t:.18s ease;
    box-sizing:border-box;
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    color:var(--n);background:var(--w);border-radius:12px;
    box-shadow:0 4px 28px rgba(0,0,0,.09);padding:22px 18px;
    margin:20px auto;max-width:1160px;
}
.kom-wrap *,.kom-wrap *::before,.kom-wrap *::after{box-sizing:inherit;}

/* ═══ CABECERA ═══ */
.kom-header{text-align:center;margin-bottom:14px;}
.kom-titulo{font-size:clamp(1.15rem,2.4vw,1.7rem);font-weight:800;color:var(--n);margin:0 0 4px;}
.kom-subtitulo{font-size:.91rem;color:var(--gm);margin:0;}

/* ═══ BREADCRUMB ═══ */
.kom-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:3px;font-size:.81rem;
    background:var(--gf);border:1px solid var(--gb);border-radius:8px;padding:7px 13px;margin-bottom:13px;}
.kom-bc-0{font-weight:700;color:var(--n);}
.kom-bc-sep{color:var(--gb);}
.kom-vacio{color:var(--gm);font-style:italic;}
.kom-activo{font-weight:700;color:var(--g);font-style:normal;}

/* ═══ LAYOUT ═══ */
.kom-body{display:flex;gap:16px;align-items:flex-start;}
.kom-mapa-wrap{flex:1 1 60%;min-width:0;position:relative;background:#eef0f4;
    border-radius:10px;overflow:hidden;border:1px solid var(--gb);}
#kom-canvas{position:relative;overflow:auto;}
#kom-canvas.kom-loading{opacity:.5;pointer-events:none;}
.kom-panel{flex:0 0 280px;min-width:240px;display:flex;flex-direction:column;gap:10px;}

/* ═══ SVG ESPAÑA – pointer-events explícito para evitar override de temas ═══ */
#kom-canvas svg{
    width:100%;height:auto;display:block;
    pointer-events:auto !important;   /* algunos temas ponen svg{pointer-events:none} */
}
#kom-canvas svg *{
    pointer-events:auto !important;
}
/* Forzar cursor y estilo en ko-prov dentro del canvas */
#kom-canvas .ko-prov{
    fill:#cdd1da;stroke:#fff;stroke-width:.9;stroke-linejoin:round;
    cursor:pointer !important;
    pointer-events:fill !important;   /* solo el relleno, más preciso */
    transition:fill var(--t);
}
#kom-canvas .ko-prov:hover{fill:#b5bbc7;}
#kom-canvas .ko-prov:focus{outline:none;fill:var(--g);}
#kom-canvas .ko-prov.ko-prov-sel{fill:var(--g);stroke:rgba(0,0,0,.14);stroke-width:1.2;}

/* ═══ SVG MUNICIPIOS ═══ */
#kom-canvas .ko-mun{
    fill:#d5d9e3;stroke:#fff;stroke-width:1;stroke-linejoin:round;
    cursor:default;transition:fill var(--t),filter var(--t);
    pointer-events:fill !important;
}
#kom-canvas .ko-mun.ko-activo,
#kom-canvas .ko-mun[data-activo="true"]{
    fill:var(--g)!important;stroke:rgba(0,0,0,.12)!important;
    cursor:pointer!important;
    filter:drop-shadow(0 1px 4px rgba(201,162,39,.4));
}
#kom-canvas .ko-mun.ko-activo:hover,
#kom-canvas .ko-mun[data-activo="true"]:hover,
#kom-canvas .ko-mun.ko-activo:focus,
#kom-canvas .ko-mun[data-activo="true"]:focus{
    fill:var(--gl)!important;
    filter:drop-shadow(0 2px 10px rgba(201,162,39,.65))!important;
    outline:none;
}
#kom-canvas .ko-mun:not(.ko-activo):hover{fill:#bec4d0;}
#kom-canvas text.ko-mun-label{
    fill:#2d3748;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    font-weight:500;pointer-events:none!important;user-select:none;
    paint-order:stroke;stroke:rgba(255,255,255,.92);stroke-width:2px;
}
#kom-canvas text.ko-mun-label.ko-lbl-activo{
    fill:#6b4e0a;font-weight:700;stroke-width:2.5px;
}

/* ═══ TOOLTIP ═══ */
#kom-tooltip{
    position:absolute;top:10px;left:50%;transform:translateX(-50%);
    background:rgba(17,24,39,.88);color:#fff;font-size:.78rem;font-weight:600;
    padding:4px 13px;border-radius:20px;pointer-events:none;opacity:0;
    transition:opacity var(--t);white-space:nowrap;z-index:20;max-width:90%;
    pointer-events:none!important;
}

/* ═══ PANEL ═══ */
.kom-btn-volver{
    align-items:center;gap:6px;background:var(--n);color:#fff;border:none;
    border-radius:7px;padding:8px 15px;font-size:.87rem;font-weight:600;
    cursor:pointer;transition:background var(--t);white-space:nowrap;
}
.kom-btn-volver:hover{background:#374151;}
.kom-estado{background:var(--gf);border:1px solid var(--gb);border-radius:8px;padding:11px 13px;min-height:48px;}
.kom-estado-txt{font-size:.86rem;color:var(--gd);line-height:1.5;margin:0;}
.kom-tools{display:flex;gap:5px;}
.kom-tools button{padding:5px 11px;border:1px solid var(--gb);border-radius:6px;
    background:var(--w);font-size:.8rem;cursor:pointer;color:var(--gd);}
.kom-tools button:hover{background:var(--gf);}

/* ═══ LOADER ═══ */
.kom-loader{display:flex;align-items:center;justify-content:center;
    min-height:200px;color:#6b7280;font-size:.9rem;flex-direction:column;gap:10px;}
.kom-loader::before{content:'';display:block;width:32px;height:32px;
    border:3px solid #e5e7eb;border-top-color:#c9a227;
    border-radius:50%;animation:kom-spin .7s linear infinite;}
@keyframes kom-spin{to{transform:rotate(360deg);}}

/* ═══ RESPONSIVE ═══ */
@media(max-width:900px){
    .kom-body{flex-direction:column;}
    .kom-mapa-wrap,.kom-panel{flex:none;width:100%;min-width:0;}
}
@media(max-width:580px){
    .kom-wrap{padding:12px 10px;margin:8px;border-radius:10px;}
    .kom-titulo{font-size:1.1rem;}
}

/* ═══ ADMIN – canvas de mapa ═══ */
#kom-admin-canvas svg,
#kom-admin-espana-canvas svg{width:100%;height:auto;display:block;}
#kom-admin-canvas [data-municipio],
#kom-admin-espana-canvas .ko-prov{transition:fill .15s,opacity .15s;cursor:pointer;}

/* ═══ ZOOM OVERLAY — botones dentro del mapa ═══ */
.kom-mapa-wrap { position:relative; }
.kom-zoom-overlay {
    position:absolute;
    top:12px; right:12px;
    z-index:30;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:2px;
    background:rgba(255,255,255,0.95);
    border:1px solid rgba(0,0,0,0.15);
    border-radius:8px;
    box-shadow:0 2px 8px rgba(0,0,0,0.18);
    padding:4px;
    pointer-events:auto;
}
.kom-zoom-overlay button {
    width:32px; height:32px;
    border:none; border-radius:6px;
    background:transparent;
    font-size:1.1rem; font-weight:700;
    color:#374151; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:background .15s;
    padding:0; line-height:1;
}
.kom-zoom-overlay button:hover { background:#f3f4f6; }
.kom-zoom-overlay button:active { background:#e5e7eb; }
.kom-zoom-level {
    font-size:.68rem; font-weight:700; color:#6b7280;
    padding:2px 0; min-width:32px; text-align:center;
    border-top:1px solid #e5e7eb;
    border-bottom:1px solid #e5e7eb;
}
/* Cursor grab en el canvas cuando hay provincia activa */
#kom-canvas.kom-provincia-activa { cursor:grab; }
#kom-canvas.kom-provincia-activa:active { cursor:grabbing; }