/* archivo.css */
:root {
    --fg:#111; --muted:#666; --bg:#fff; --hr:#e8e8e8; --brand:#0162ff;
   --page-max: 1024px;  
   --page-pad: clamp(12px, 2vw, 24px);
   
}
* { box-sizing:border-box; }
html,body{
   margin:0; padding:0; background:var(--bg); color:var(--fg);
   font:19px/1.4 system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
   
}

.page{
  max-width: var(--page-max);
  margin-inline: auto;
  padding-inline: var(--page-pad);
}

.wrap{ max-width:1080px; margin:0 auto; padding:12px; }
h1{ font-size:28px; margin:8px 0 12px; }
.day__h{ font-size:20px; margin:16px 0 8px; }
.searchbar{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px; }
.searchbar input[type="search"], .searchbar input[type="date"]{ flex:1 1 220px; padding:10px 12px; border:1px solid var(--hr); border-radius:10px; resize: none; }
.searchbar button{ padding:10px 14px; border:0; border-radius:10px; background:var(--brand); color:#fff; cursor:pointer; }
.searchbar button:hover{ filter:brightness(0.95); }
.mv-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
@media (max-width:840px){ .mv-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .mv-grid{ display:flex; overflow:auto; gap:10px; padding-bottom:8px; scroll-snap-type:x mandatory; } .mv-item{ flex:0 0 75%; scroll-snap-align:start; } }
.mv-item a{ display:block; text-decoration:none; color:inherit; background:#fafafa; border:1px solid var(--hr); border-radius:12px; overflow:hidden; }
.mv-item img{ width:100%; height:160px; object-fit:cover; display:block; background:#ddd; }
.mv-item .mv-body{ padding:10px; }
.mv-item .mv-title{ font-size:15px; font-weight:600; margin:0 0 6px; }
.mv-item .mv-meta{ font-size:12px; color:var(--muted); display:flex; gap:8px; }
.day__list{ list-style:none; padding:0; margin:0; }
.hrsep{ margin:18px 0 8px; color:var(--muted); font-size:14px; font-weight:600; }
.row{ border-top:1px solid var(--hr); }
.row__link{ display:flex; gap:12px; padding:10px 0; text-decoration:none; color:inherit;
    align-items:top; 
   }
.row__media{
   width:160px; min-width:160px; height:90px; background:#eee; border-radius:10px; overflow:hidden;
   margin:.3rem;
}
@media (min-width:1024px) {
   .row__media { margin:1rem; }
}
@media (max-width:540px) {
   .row__media { width:120px; min-width:120px; margin:0; }
}
.row__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.row__body{ flex:1; min-width:0; }
.row__title{ margin:0 0 6px; font-size:1.15rem; font-weight:700; }
.row__meta{ font-size:12px; color:var(--muted); display:flex; gap:10px; align-items:center; }
.row__author::after{ content:"·"; margin-left:10px; color:var(--hr); }
.day__more{ display:flex; justify-content:center; margin:14px 0 24px; }
.btn-more{
   display:inline-block;
   padding:10px 16px; border-radius:1rem;
   background:#f3f3f3; color:#222; text-decoration:none;
   border:1px solid var(--hr); 
    text-decoration: none;
  touch-action: manipulation;      /* evita gestos raros */
  -webkit-tap-highlight-color: rgba(0,0,0,.08);
  user-select: none;
  font-size:1.5rem;
}
.btn-more:active{ transform: translateY(1px); }

.btn-more[disabled]{ opacity:.5; cursor:not-allowed; }
.row__snippet{
  margin:.25rem 0 0;
  font-size:.95rem; line-height:1.35; color:#333;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.text-center { text-align: center; }



/* Centrado y ancho fijo moderado */
.searchbar{
  display:flex; align-items:center; gap:.5rem; flex-wrap:nowrap;
  width:min(100%, 412px);
  margin:.75rem auto 1rem;
  font-size:clamp(16px,1.4vw,18px);
}

/* Input de texto */
.searchbar input[type="search"]{
  height:48px; padding:0 .75rem;
  border:1px solid #cfd6dd; border-radius:10px; background:#fff;
  font:inherit; line-height:1.2;
  flex:1 1 auto; min-width:0;
     resize: none;
     outline:none;
}

/* Contenedor del “botón” calendario */
.searchbar__cal{
  position:relative; width:48px; height:48px; flex:0 0 48px;
}

/* El input date ocupa todo el botón (invisible pero clickeable) */
.searchbar__cal input[type="date"]{
  position:absolute; inset:0;
  opacity:0; cursor:pointer;
  width:100%; height:100%; margin:0; padding:0; border:0;
}

/* El ícono visible */
.searchbar__iconbtn{
  position:absolute; inset:0;
  display:grid; place-items:center;
  border:1px solid #cfd6dd; border-radius:10px; background:#fff;
  pointer-events:none; /* para que el click pase al input date */
}
.searchbar__iconbtn svg{
  width:20px; height:20px; fill:none; stroke:#6b7280;
  stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;
}

/* Foco accesible */
.searchbar :focus{
  outline:2px solid transparent;
  box-shadow:0 0 0 2px rgba(0,132,255,.20);
  border-color:#0084ff;
}

/* Dark mode opcional */
/*
@media (prefers-color-scheme: dark){
  .searchbar input[type="search"], .searchbar__iconbtn{
    background:#111; border-color:#2a2f36; color:#e8eaed;
  }
  .searchbar__iconbtn svg{ stroke:#a7b0ba; }
}
*/






/* Evita scroll horizontal global */
html, body{ width:100%; overflow-x: clip; }   /* iOS 17+ */
@supports not (overflow-x: clip){
  html, body{ overflow-x: hidden; }
}

/* Imágenes/iframes nunca más anchos que la pantalla */
img, video, iframe{ max-width:100%; height:auto; }

/* Evita el clásico bug de 100vw (incluye scrollbar y safe areas) */
[class*="container"], [class*="wrap"]{ max-width:100%; }


:root{
  --page-max: 1200px;            /* o 1024px */
  --page-pad: clamp(12px, 2vw, 24px);
}

/* En desktop, limita y centra los contenedores típicos */
@media (min-width: 992px){
  main, .content, .wrap, .container, .archivo{
    max-width: var(--page-max);
    margin-inline: auto;
    padding-inline: var(--page-pad);
  }
}



header {
  background: #00A456;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
p.menu a {
  text-decoration: none;
  color: black;
}