/* =========================================================
   Canal VTM V2 - Header + Footer (CSS limpio)
   - padding correcto (PC y móvil)
   - lupa DENTRO del input con fondo negro
   - móvil: 1 línea (logo + buscar + cuenta)
========================================================= */

.v2h{
  border-bottom: 1px solid #e5e7eb;
  background: #fff;
}

/* padding global del header (lo que marcas con 1 y 4) */
.v2h__inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px 18px 10px; /* + aire general */
}

/* ---------- Línea 1: logo - search - account ---------- */
.v2h__row1{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px; /* + aire entre logo/buscar/cuenta */
}

/* Logo */
.v2h__brand{
  display: inline-flex;
  align-items: center;
  margin-left: -6px; /* ajuste fino */
}

.v2h__logo{
  height: 44px;
  width: auto;
  display: block;
}

/* Search */
.v2h__search{
  width: 100%;
  min-width: 0;
}

.v2h__searchBox{
  position: relative;
  width: 100%;
  min-width: 0;
}

/* input con padding a la derecha para que quepa la lupa dentro */
.v2h__searchInput{
  width: 100%;
  min-width: 0;
  height: 46px;
  border-radius: 999px;
  padding: 0 54px 0 16px; /* hueco para botón a la derecha */
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
  outline: none;
}

/* botón lupa dentro, negro */
.v2h__searchBtn{
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  height: 36px;
  width: 36px;
  border-radius: 999px;
  border: 0;
  background: #111;         /* negro */
  color: #fff;              /* icono blanco */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.v2h__searchBtn i{
  font-size: 14px;
}

/* Cuenta */
.v2h__account{
  position: relative;
}

.v2h__accountBtn{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
}

.v2h__accountTxt{
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.v2h__accountDd{
  position: absolute;
  right: 0;
  top: 50px;
  z-index: 60;
  min-width: 220px;
  padding: 8px;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  display: none;
}

.v2h__account.is-open .v2h__accountDd{
  display: block;
}

.v2h__ddItem{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  font-weight: 600;
  font-size: 14px;
}

.v2h__ddItem:hover{
  background: rgba(0,0,0,.04);
}

/* ---------- Línea 2 (padding que marcas con 4) ---------- */
.v2h__row2{
  margin-top: 10px;
}

.v2h__title{
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 700;
}

/* =======================================================
   MÓVIL: UNA SOLA LÍNEA para el buscador (como pides)
   (logo + campo buscar con lupa dentro + cuenta)
======================================================= */
@media (max-width: 820px){
  .v2h__inner{
    padding: 12px 12px 10px;
  }

  .v2h__row1{
    grid-template-columns: auto minmax(0, 1fr) auto; /* 1 línea */
    gap: 10px;
  }

  .v2h__logo{
    height: 38px;
  }

  .v2h__searchInput{
    height: 44px;
    padding: 0 48px 0 14px;
    font-size: 15px;
  }

  .v2h__searchBtn{
    height: 34px;
    width: 34px;
    right: 5px;
  }

  /* en móvil, el botón cuenta sin texto */
  .v2h__accountTxt{
    display: none;
  }

  .v2h__accountBtn{
    padding: 10px 10px;
    gap: 8px;
  }

  /* título más compacto */
  .v2h__row2{ margin-top: 8px; }
  .v2h__title{ font-size: 16px; }
}

/* =======================================================
   Footer (estable)
======================================================= */
.vtm-tv-footer{
  background: #0f172a;
  color: #e5e7eb;
  padding: 20px 0;
  margin-top: 40px;
}

.vtm-tv-footer__inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
  text-align: center;
}

.vtm-tv-footer__link{
  color: #e5e7eb;
  text-decoration: none;
  margin: 0 6px;
}

.vtm-tv-footer__link:hover{
  text-decoration: underline;
}

.vtm-tv-footer__separator{
  margin: 0 4px;
  opacity: .6;
}
