/* =========================================================
   VENDECAR - AJUSTES RESPONSIVE LIMPIOS
   Author: vendecar

   Reemplaza el CSS móvil anterior. No toca Swiper globalmente
   y no pisa h1/h2/main de la plantilla inicio.php.
========================================================= */

*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;padding:0;overflow-x:hidden;}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:#f5f7fa;color:#222;line-height:1.5;}
img{max-width:100%;height:auto;display:block;}

/* No aplicar contenedor global a la home nueva. */
body:not(.vc-inicio-page) main{width:100%;max-width:1400px;margin:auto;padding:20px;}
body.vc-inicio-page main,body.vc-inicio-page .vch-home{max-width:none!important;margin:0!important;padding-left:0!important;padding-right:0!important;}

/* =========================================================
   MENÚ MÓVIL GENERAL DEL TEMA
========================================================= */
@media (min-width:1025px){.menu-movil,.app-bottom-bar{display:none!important;}}

@media (max-width:1024px){
  body:not(.vc-inicio-page){padding-bottom:74px;}
  .menu-movil,.menu-movil *,.app-bottom-bar,.app-bottom-bar *{box-sizing:border-box;}
  .menu-movil{position:sticky;top:0;z-index:100000;background:rgba(255,255,255,.98);border-bottom:1px solid rgba(8,27,58,.09);box-shadow:0 8px 24px rgba(8,27,58,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;}
  .menu-top{display:flex;align-items:center;gap:8px;padding:10px;}
  .btn-login,.btn-registro,.menu-toggle{min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:999px;padding:8px 12px;text-decoration:none!important;font-size:12px;font-weight:800;line-height:1;border:1px solid #DDE7F4;white-space:nowrap;}
  .btn-login{background:#fff;color:#075CF8!important;}
  .btn-registro,.menu-toggle{background:#075CF8;color:#fff!important;border-color:#075CF8;box-shadow:0 8px 20px rgba(7,92,248,.22);}
  .menu-toggle{margin-left:auto;cursor:pointer;}
  .menu-badge{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#E53935;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;}
  .menu-items{display:none;list-style:none;margin:0;padding:10px;background:#F6FAFF;border-top:1px solid #E6EEF8;}
  .menu-items.active{display:grid;gap:8px;}
  .menu-items li{margin:0;}
  .menu-items a{display:flex;align-items:center;gap:9px;min-height:44px;padding:11px 13px;border-radius:14px;background:#fff;border:1px solid #DDE7F4;text-decoration:none!important;color:#081B3A;font-weight:800;font-size:13px;box-shadow:0 6px 16px rgba(8,27,58,.045);}
  .menu-items a.is-active{color:#075CF8;border-color:rgba(7,92,248,.32);}
  .menu-item-icon{width:22px;text-align:center;}
  .app-bottom-bar{position:fixed;left:0;right:0;bottom:0;z-index:99998;min-height:72px;background:rgba(255,255,255,.98);border-top:1px solid rgba(8,27,58,.10);box-shadow:0 -8px 26px rgba(8,27,58,.10);display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;padding:5px 3px calc(5px + env(safe-area-inset-bottom));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);}
  .app-bottom-bar a{min-width:0;height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none!important;color:#52637E;font-size:18px;line-height:1;}
  .app-bottom-bar a span:last-child{font-size:8.5px;font-weight:800;line-height:1.05;text-align:center;white-space:normal;max-width:100%;}
  .app-bottom-bar a.is-active{color:#075CF8!important;}
  .app-bottom-bar a.action .bottom-icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#075CF8;color:#fff;margin-top:-16px;box-shadow:0 10px 22px rgba(7,92,248,.27);}
}

@media(max-width:390px){
  .menu-top{padding:9px 7px;gap:6px;}
  .btn-login,.btn-registro,.menu-toggle{min-height:36px;padding:7px 9px;font-size:11px;}
  .app-bottom-bar a{font-size:16px;}
  .app-bottom-bar a span:last-child{font-size:7.7px;}
  .app-bottom-bar a.action .bottom-icon{width:34px;height:34px;}
}

/* =========================================================
   GRID DE ANUNCIOS GENERAL
========================================================= */
.anuncios-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;width:100%;}
.anuncio-item{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 18px rgba(0,0,0,.08);display:flex;flex-direction:column;transition:.2s;}
.anuncio-item:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.12);}
.anuncio-item img{width:100%;aspect-ratio:16/10;object-fit:cover;}
.anuncio-item .contenido,.anuncio-contenido{padding:14px;}
.anuncio-titulo{font-size:1rem;font-weight:700;line-height:1.3;margin-bottom:8px;color:#111;}
.anuncio-precio{font-size:1.1rem;font-weight:700;color:#0094d8;}
.btn,.anuncio-btn,.btn-comparar-anuncio,.btn-contactar{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:999px;background:#1da1f2;color:#fff;text-decoration:none!important;border:none;font-weight:600;transition:.2s;cursor:pointer;}
.btn:hover,.anuncio-btn:hover,.btn-comparar-anuncio:hover,.btn-contactar:hover{transform:translateY(-2px);background:#007dc5;color:#fff;}

@media(max-width:768px){
  body{font-size:14px;}
  body:not(.vc-inicio-page) main{padding:10px;}
  .anuncios-grid{grid-template-columns:1fr;gap:14px;}
  .anuncio-item{border-radius:14px;}
  .anuncio-item img{aspect-ratio:16/9;}
  .anuncio-titulo{font-size:.95rem;}
  .anuncio-precio{font-size:1rem;}
  .btn,.anuncio-btn,.btn-comparar-anuncio,.btn-contactar{width:100%;}
  body:not(.vc-inicio-page) h1{font-size:1.5rem!important;}
  body:not(.vc-inicio-page) h2{font-size:1.25rem!important;}
  body:not(.vc-inicio-page) h3{font-size:1.05rem!important;}
}
@media(max-width:480px){
  body:not(.vc-inicio-page) main{padding:8px;}
  .anuncios-grid{gap:12px;}
  .anuncio-item img{aspect-ratio:4/3;}
  .anuncio-item .contenido,.anuncio-contenido{padding:12px;}
  .anuncio-titulo{font-size:.92rem;}
  .anuncio-precio{font-size:.95rem;}
}
@media(min-width:769px) and (max-width:1024px){.anuncios-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1025px) and (max-width:1366px){.anuncios-grid{grid-template-columns:repeat(3,1fr);}}
@media(min-width:1367px){.anuncios-grid{grid-template-columns:repeat(4,1fr);}}

/* Importantísimo: no tocar Swiper globalmente. */
/* =========================================================
   VENDECAR - MENÚ MÓVIL TIPO APP
   Author: vendecar
========================================================= */

.vcm-mobile-root {
  display: none;
}

@media (min-width: 1025px) {
  .vcm-mobile-root {
    display: none !important;
  }
}

/* =========================================================
   MÓVIL / TABLET
========================================================= */

@media (max-width: 1024px) {

  html,
  body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }

  body {
    padding-bottom: calc(78px + env(safe-area-inset-bottom));
  }

  .vcm-mobile-root,
  .vcm-mobile-root * {
    box-sizing: border-box;
  }

  .vcm-mobile-root {
    display: block;
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100000;
    width: 100%;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Inter, Arial, sans-serif;
  }

  .vcm-mobile-root svg {
    width: 1em;
    height: 1em;
    display: block;
    fill: currentColor;
  }

  .vcm-mobile-root a {
    text-decoration: none !important;
  }

  /* =====================================================
     LOGIN / REGISTRO ARRIBA DEL TODO
  ===================================================== */

  .vcm-account-top {
    background: #061735;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,.10);
  }

  .vcm-account-inner {
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 4px 12px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .vcm-account-inner::-webkit-scrollbar {
    display: none;
  }

  .vcm-account-link {
    min-height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 5px 9px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.16);
    color: #fff !important;
    font-size: 11px;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
  }

  .vcm-account-link svg {
    font-size: 14px;
  }

  .vcm-account-link.is-blue {
    background: #075CF8;
    border-color: #075CF8;
    box-shadow: 0 8px 20px rgba(7,92,248,.25);
  }

  .vcm-badge {
    min-width: 17px;
    height: 17px;
    padding: 0 5px;
    border-radius: 999px;
    background: #F23A3A;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 900;
  }

  /* =====================================================
     HEADER APP: LOGO + BUSCAR + MENÚ
  ===================================================== */

  .vcm-app-header {
    min-height: 66px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 14px;
    background: rgba(255,255,255,.98);
    border-bottom: 1px solid rgba(8,27,58,.08);
    box-shadow: 0 8px 26px rgba(8,27,58,.075);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
  }

  .vcm-logo {
    min-width: 0;
    max-width: min(64vw, 260px);
    height: 48px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #071A3D !important;
    overflow: hidden;
  }

  .vcm-logo img {
    display: block;
    width: auto;
    max-width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .vcm-logo-mark {
    width: 32px;
    height: 20px;
    border-radius: 999px;
    background: #075CF8;
    color: #075CF8;
    flex: 0 0 auto;
  }

  .vcm-logo-text {
    font-size: 25px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: -.05em;
    white-space: nowrap;
  }

  .vcm-logo-text span {
    color: #075CF8;
  }

  .vcm-header-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 9px;
  }

  .vcm-icon-btn {
    width: 43px;
    height: 43px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 14px;
    background: #F2F6FF;
    color: #071A3D !important;
    cursor: pointer;
  }

  .vcm-icon-btn svg {
    font-size: 23px;
  }

  /* =====================================================
     DRAWER DESPLEGABLE
  ===================================================== */

  .vcm-drawer {
    position: fixed;
    z-index: 100002;
    top: 0;
    left: 0;
    right: 0;
    max-height: 92vh;
    overflow: auto;
    padding: 14px 14px 18px;
    background: rgba(255,255,255,.99);
    border-bottom: 1px solid rgba(8,27,58,.10);
    box-shadow: 0 18px 46px rgba(8,27,58,.18);
    transform: translateY(-112%);
    transition: transform .24s ease;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
  }

  .vcm-drawer.is-open {
    transform: translateY(0);
  }

  .vcm-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
  }

  .vcm-logo-drawer {
    height: 48px;
    max-width: 230px;
  }

  .vcm-drawer-menu {
    display: grid;
    gap: 9px;
  }

  .vcm-drawer-menu a {
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 12px 14px;
    border: 1px solid #DDE7F4;
    border-radius: 17px;
    background: #fff;
    color: #081B3A !important;
    font-size: 14px;
    font-weight: 900;
    box-shadow: 0 7px 16px rgba(8,27,58,.045);
  }

  .vcm-drawer-menu a svg {
    font-size: 19px;
    color: #075CF8;
  }

  .vcm-drawer-menu a.is-active {
    border-color: rgba(7,92,248,.34);
    background: #F0F6FF;
    color: #075CF8 !important;
  }

  .vcm-drawer-menu a.is-primary {
    background: #075CF8;
    color: #fff !important;
    border-color: #075CF8;
    box-shadow: 0 12px 26px rgba(7,92,248,.22);
  }

  .vcm-drawer-menu a.is-primary svg {
    color: #fff;
  }

  /* =====================================================
     BARRA INFERIOR APP
  ===================================================== */

  .vcm-bottom-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99999;
    min-height: 74px;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    align-items: center;
    gap: 0;
    padding: 6px 3px calc(6px + env(safe-area-inset-bottom));
    background: rgba(255,255,255,.985);
    border-top: 1px solid rgba(8,27,58,.10);
    box-shadow: 0 -8px 30px rgba(8,27,58,.11);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .vcm-bottom-nav a {
    min-width: 0;
    height: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: #52637E !important;
    font-size: 8.5px;
    font-weight: 900;
    line-height: 1.04;
    text-align: center;
    overflow: hidden;
  }

  .vcm-bottom-nav a span:last-child {
    display: block;
    max-width: 100%;
    white-space: normal;
  }

  .vcm-nav-icon {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    color: inherit;
  }

  .vcm-nav-icon svg {
    font-size: 22px;
  }

  .vcm-bottom-nav a.is-active {
    color: #075CF8 !important;
  }

  .vcm-bottom-nav a.is-primary .vcm-nav-icon {
    width: 40px;
    height: 40px;
    margin-top: -17px;
    border-radius: 999px;
    background: #075CF8;
    color: #fff;
    box-shadow: 0 10px 22px rgba(7,92,248,.27);
  }

  .vcm-bottom-nav a.is-primary .vcm-nav-icon svg {
    font-size: 22px;
  }

  .vcm-bottom-nav a.is-primary span:last-child {
    margin-top: -3px;
  }

  body.vcm-drawer-open {
    overflow: hidden !important;
  }

  /* Ocultar header Astra solo en móvil si molesta */
  .vca-astra-header-wrap {
    display: none !important;
  }
}

/* =========================================================
   AJUSTES MÓVIL PEQUEÑO
========================================================= */

@media (max-width: 420px) {
  .vcm-account-inner {
    justify-content: flex-start;
    padding-left: 8px;
    padding-right: 8px;
  }

  .vcm-app-header {
    min-height: 62px;
    padding: 8px 10px;
  }

  .vcm-logo {
    height: 43px;
    max-width: 58vw;
  }

  .vcm-logo-text {
    font-size: 22px;
  }

  .vcm-icon-btn {
    width: 40px;
    height: 40px;
    border-radius: 13px;
  }

  .vcm-icon-btn svg {
    font-size: 21px;
  }

  .vcm-bottom-nav a {
    font-size: 7.7px;
  }

  .vcm-nav-icon svg {
    font-size: 19px;
  }

  .vcm-bottom-nav a.is-primary .vcm-nav-icon {
    width: 36px;
    height: 36px;
    margin-top: -14px;
  }
}

@media (max-width: 360px) {
  .vcm-bottom-nav a {
    font-size: 7px;
  }

  .vcm-logo-text {
    font-size: 20px;
  }

  .vcm-logo {
    max-width: 55vw;
  }
}
/* =========================================================
   VENDECAR - AJUSTE FINAL ICONOS MENÚ MÓVIL APP
   Iconos más pequeños y menú desplegable más fino
   Author: vendecar
========================================================= */

@media (max-width: 1024px) {

    /* =====================================================
       MENÚ INFERIOR APP - PÁGINAS INTERNAS
       header-movil.php / .vcm2-bottom
    ===================================================== */

    .vcm2-bottom {
        min-height: 66px !important;
        padding: 4px 3px calc(4px + env(safe-area-inset-bottom)) !important;
    }

    .vcm2-bottom a {
        min-height: 54px !important;
        gap: 3px !important;
        font-size: 7px !important;
        line-height: 1.05 !important;
        font-weight: 850 !important;
    }

    .vcm2-bottom svg {
        width: 16px !important;
        height: 16px !important;
    }

    .vcm2-bottom a.is-primary svg {
        width: 30px !important;
        height: 30px !important;
        padding: 7px !important;
        margin-top: -11px !important;
        box-shadow: 0 8px 18px rgba(7,92,248,.24) !important;
    }

    /* =====================================================
       HEADER SUPERIOR APP - PÁGINAS INTERNAS
    ===================================================== */

    .vcm2-head {
        min-height: 48px !important;
        padding: 5px 9px !important;
        gap: 7px !important;
    }

    .vcm2-action {
        min-width: 38px !important;
        width: 38px !important;
        height: 38px !important;
        border-radius: 13px !important;
    }

    .vcm2-action svg {
        width: 18px !important;
        height: 18px !important;
        font-size: 18px !important;
    }

    .vcm2-action.is-blue {
        width: auto !important;
        min-width: auto !important;
        height: 38px !important;
        padding: 0 10px !important;
        gap: 6px !important;
        font-size: 11px !important;
    }

    .vcm2-action.is-blue svg {
        width: 16px !important;
        height: 16px !important;
    }

    /* =====================================================
       MENÚ DESPLEGABLE AL PINCHAR - PÁGINAS INTERNAS
    ===================================================== */

    .vcm2-drawer {
        padding: 12px !important;
    }

    .vcm2-drawer-head {
        margin-bottom: 10px !important;
    }

    .vcm2-menu {
        gap: 7px !important;
    }

    .vcm2-menu a {
        min-height: 42px !important;
        padding: 10px 12px !important;
        border-radius: 15px !important;
        gap: 9px !important;
        font-size: 13px !important;
    }

    .vcm2-menu a svg {
        width: 15px !important;
        height: 15px !important;
        flex: 0 0 auto !important;
    }

    /* =====================================================
       MENÚ INFERIOR APP - INICIO.PHP
       .vci-bottom-nav
    ===================================================== */

    .vci-bottom-nav {
        min-height: 66px !important;
        padding: 4px 3px calc(4px + env(safe-area-inset-bottom)) !important;
    }

    .vci-bottom-nav a {
        min-height: 54px !important;
        gap: 3px !important;
        font-size: 7px !important;
        line-height: 1.05 !important;
        font-weight: 850 !important;
    }

    .vci-bottom-nav svg {
        width: 16px !important;
        height: 16px !important;
    }

    .vci-bottom-nav a.is-primary svg {
        width: 30px !important;
        height: 30px !important;
        padding: 7px !important;
        margin-top: -11px !important;
        box-shadow: 0 8px 18px rgba(7,92,248,.24) !important;
    }

    /* =====================================================
       MENÚ DESPLEGABLE AL PINCHAR - INICIO.PHP
    ===================================================== */

    .vci-drawer {
        padding: 12px !important;
    }

    .vci-drawer-head {
        margin-bottom: 10px !important;
    }

    .vci-drawer-close {
        width: 38px !important;
        height: 38px !important;
        border-radius: 13px !important;
    }

    .vci-drawer-close svg {
        width: 18px !important;
        height: 18px !important;
    }

    .vci-drawer-links {
        gap: 7px !important;
    }

    .vci-drawer-links a {
        min-height: 42px !important;
        padding: 10px 12px !important;
        border-radius: 15px !important;
        gap: 9px !important;
        font-size: 13px !important;
    }

    .vci-drawer-links a svg {
        width: 15px !important;
        height: 15px !important;
        flex: 0 0 auto !important;
    }

    /* =====================================================
       LOGIN / REGISTRO ARRIBA
    ===================================================== */

    .vcm2-account-inner,
    .vci-account-inner {
        min-height: 30px !important;
        gap: 6px !important;
    }

    .vcm2-pill,
    .vci-account-pill {
        min-height: 23px !important;
        padding: 4px 8px !important;
        font-size: 10px !important;
        gap: 5px !important;
    }

    .vcm2-pill svg,
    .vci-account-pill svg {
        width: 11px !important;
        height: 11px !important;
    }

    .vcm2-badge,
    .vci-badge {
        min-width: 16px !important;
        height: 16px !important;
        font-size: 9px !important;
    }
}

/* =========================================================
   MÓVILES MUY PEQUEÑOS
========================================================= */

@media (max-width: 390px) {

    .vcm2-bottom a,
    .vci-bottom-nav a {
        font-size: 6.4px !important;
    }

    .vcm2-bottom svg,
    .vci-bottom-nav svg {
        width: 15px !important;
        height: 15px !important;
    }

    .vcm2-bottom a.is-primary svg,
    .vci-bottom-nav a.is-primary svg {
        width: 28px !important;
        height: 28px !important;
        padding: 7px !important;
    }

    .vcm2-menu a,
    .vci-drawer-links a {
        min-height: 40px !important;
        font-size: 12.5px !important;
    }

    .vcm2-menu a svg,
    .vci-drawer-links a svg {
        width: 14px !important;
        height: 14px !important;
    }
}