/* RKT Distribuidores — CSS copiado EXACTO de servirepuestos-rkt.vercel.app/assets/styles.css */

/* Variables CSS del original */
:root {
    --blue: #1A3674;
    --navy: #0D1B45;
    --blue-mid: #1D2B6B;
    --yellow: #FFCA00;
    --yellow-dk: #E5B400;
    --red: #FF0616;
    --gray: #F5F5F0;
    --font-display: 'CWM', 'Kinship Sans', sans-serif;
    --font-body: 'Inter', 'Outfit', sans-serif;
}

/* Botones — copiado exacto */
.btn-rkt{display:inline-flex;align-items:center;position:relative;transform:skewX(-9deg);transition:transform .25s,box-shadow .25s;cursor:pointer;border:none;text-decoration:none;outline:none}
.btn-rkt:hover{transform:skewX(-9deg) translateY(-2px)}
.btn-rkt:active{transform:skewX(-9deg) scale(.97)}
.btn-rkt span{display:inline-block;transform:skewX(9deg);padding:.85rem 1.85rem;font-weight:700;font-size:.82rem;letter-spacing:.13em;text-transform:uppercase;white-space:nowrap}
.btn-blue{background:var(--blue);color:#fff}
.btn-blue:hover{box-shadow:0 10px 30px -8px rgba(26,54,116,.5)}
.btn-yellow{background:var(--yellow);color:var(--navy)}
.btn-yellow:hover{background:var(--yellow-dk);box-shadow:0 10px 30px -8px rgba(255,202,0,.55)}

/* Filter — copiado exacto */
.dist-filter{background:#fff;border:1px solid rgba(0,0,0,.1);padding:1.4rem;display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:.85rem;align-items:end}
.dist-input{border:none;border-bottom:2px solid var(--blue);padding:.65rem .25rem;font-family:var(--font-body);font-size:.92rem;background:transparent;width:100%;outline:none;color:var(--navy)}
.dist-input:focus{border-bottom-color:var(--yellow)}
.dist-select{border:1px solid rgba(0,0,0,.15);padding:.7rem .85rem;font-family:var(--font-body);font-size:.88rem;background:#fff;width:100%;outline:none;color:var(--navy);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%231A3674' stroke-width='2'><polyline points='6 9 12 15 18 9'/></svg>");background-repeat:no-repeat;background-position:right .8rem center;padding-right:2rem}
.field-lbl{font-size:.66rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#666;margin-bottom:.3rem;display:block}

/* Dist cards — copiado exacto */
.dist-card{border:1px solid rgba(0,0,0,.09);padding:1.25rem 1.4rem;background:#fff;border-left:4px solid var(--blue);transition:all .25s;cursor:pointer;display:flex;flex-direction:column;gap:.45rem}
.dist-card:hover{border-left-color:var(--yellow);box-shadow:0 8px 24px -10px rgba(26,54,116,.18);transform:translateX(3px)}
.dist-card.red{border-left-color:var(--red)}
.dist-card.active{border-left-color:var(--yellow);background:#fffdf0}
.dist-card .city{font-size:.66rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--red)}
.dist-card .name{font-family:var(--font-display);font-size:1.3rem;color:var(--navy);letter-spacing:.04em;line-height:1}
.dist-card .addr{font-size:.83rem;color:#666;line-height:1.5}
.dist-card .meta{font-size:.74rem;color:#888;display:flex;gap:1rem;margin-top:.2rem}

/* Map — copiado exacto */
#dist-map{height:520px;width:100%;border:1px solid rgba(0,0,0,.1)}

/* Grid map+list (nuestro layout, no existe en el original) */
.rkt-dist-grid{display:grid;grid-template-columns:3fr 2fr;gap:1.5rem;align-items:start}

/* stat-num y stat-lbl del original */
.stat-num{font-family:var(--font-display);font-size:3.6rem;line-height:.9;color:var(--yellow);letter-spacing:.02em}
.stat-lbl{font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#888;margin-top:.35rem}

/* Responsive — copiado exacto */
@media(max-width:900px){
    .dist-filter{grid-template-columns:1fr}
    #dist-map{height:380px}
    .rkt-dist-grid{grid-template-columns:1fr}
}