/* Keep the established cascade layers: older surface declarations are important. */
@layer vl-colors {
 #loja-tiempo {background:#122b30!important;color:#fff!important;}
 #loja-tiempo .vl-time-intro h2 {color:#fff!important;}
 #loja-tiempo .vl-time-intro p,#loja-tiempo #timeSpotDesc {color:#d7e4e3!important;}
 #loja-tiempo .vl-time-intro h2 span,#loja-tiempo #timeSpotTitle {color:#ffd29b!important;}
 #lojaTimeTabsContainer button {background:#203c41!important;color:#e8f0ef!important;border-color:#486165!important;}
 #lojaTimeTabsContainer button[aria-pressed="true"] {background:#ffd29b!important;color:#152e33!important;border-color:#ffd29b!important;}
 #lojaTimeTabsContainer button i {color:inherit!important;}
 #loja-tiempo .vl-time-details {background:#18343a!important;border-color:#486165!important;}
 #loja-tiempo .vl-time-details button {background:#ffd29b!important;color:#152e33!important;border-color:#ffd29b!important;}
 #loja-tiempo .vl-time-details button :is(span,i) {color:inherit!important;}
 #loja-tiempo #timeAudioGuideBtn {background:#25474d!important;color:#fff!important;border-color:#6c8b91!important;}
 #loja-tiempo #timeLabelBefore {background:#13282e!important;color:#fff!important;}
 #loja-tiempo #timeLabelAfter {background:#fff1dc!important;color:#21353a!important;}
 #loja-tiempo .vl-time-comparison {color:#e8f0ef!important;}
}
@layer vl-layout {
 #loja-tiempo {padding-block:clamp(48px,7vw,96px)!important;}
 #loja-tiempo .vl-time-intro {text-align:left!important;margin-bottom:24px!important;}
 #loja-tiempo .vl-time-intro h2 {font-size:clamp(2rem,4vw,3.7rem)!important;line-height:1.08!important;}
 #loja-tiempo .vl-time-intro p {font-size:1rem!important;line-height:1.7!important;margin-top:18px!important;}
 #lojaTimeTabsContainer {justify-content:flex-start!important;flex-wrap:wrap!important;overflow:visible!important;}
 #lojaTimeTabsContainer button {min-height:44px!important;white-space:normal!important;text-align:left;max-width:100%;}
 #loja-tiempo .vl-time-panel {width:100%;max-width:none!important;padding:12px!important;border:1px solid #668087!important;border-radius:28px!important;}
 #beforeAfterViewer {height:clamp(280px,48vw,440px)!important;border-radius:18px!important;touch-action:pan-y;}
 #timeOverlayBefore {width:100%!important;}
 #loja-tiempo .vl-time-details {padding:18px!important;margin-top:12px!important;flex-direction:column!important;align-items:stretch!important;}
 #loja-tiempo .vl-time-details button {min-height:46px!important;}
 #loja-tiempo #timeSpotTitle {font-size:1.65rem!important;line-height:1.3!important;}
 #loja-tiempo #timeSpotDesc {font-size:1rem!important;line-height:1.75!important;margin-top:10px!important;}
 .vl-time-comparison {padding:16px 8px 0;display:grid;gap:6px;}
 .vl-time-comparison label {font-size:.8rem;line-height:1.5;}
 #timeComparisonRange {width:100%;min-height:44px;accent-color:#ffd29b;cursor:ew-resize;}
 #loja-tiempo :is(button,input):focus-visible {outline:3px solid #fff!important;outline-offset:4px!important;}
 @media(min-width:1024px){.vl-time-layout {display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:48px;align-items:center;}.vl-time-intro{margin:0!important;}}
 @media(max-width:390px){#loja-tiempo .vl-time-details button{width:100%;justify-content:center;}.vl-time-details>div:last-child{width:100%;}}

/* V142: selector visual y búsqueda histórica */
#loja-tiempo .vl-time-search{display:block;margin-top:22px;font-size:13px;line-height:1.5;font-weight:700}
#loja-tiempo .vl-time-search input{display:block;width:100%;margin-top:8px;padding:12px 14px;border:1px solid #789399;border-radius:12px;background:#203c41;color:#fff;font-size:14px;line-height:1.5}
#lojaTimeTabsContainer{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin-top:14px!important}
#lojaTimeTabsContainer button{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:10px!important;padding:10px!important;min-width:0!important;font-size:13px!important;line-height:1.45!important}
#lojaTimeTabsContainer button img{height:90px;width:100%;object-fit:cover;border-radius:8px}
#lojaTimeTabsContainer button img[hidden]{display:none!important}
#lojaTimeTabsContainer button span{overflow-wrap:anywhere}
#loja-tiempo .vl-time-search-empty{grid-column:1/-1;font-size:13px!important;line-height:1.7!important}
#loja-tiempo .vl-time-panel[hidden]{display:none!important}
@media(min-width:1024px){.vl-time-layout{gap:30px!important;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr)!important;align-items:start!important}}
@media(max-width:1023px) and (min-width:650px){#lojaTimeTabsContainer{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
}

/* V166: full historic place names and adaptable comparison space. */
@layer vl-layout {
 #loja-tiempo #lojaTimeTabsContainer button span { word-break:normal !important; overflow-wrap:normal !important; white-space:normal !important; line-height:1.5 !important; }
 #loja-tiempo .vl-time-search input { min-height:48px; min-width:0; }
 #loja-tiempo .vl-time-details { align-items:flex-start !important; }
 #loja-tiempo .vl-time-details>div:first-child { min-width:0; flex:1 1 auto; }
 #loja-tiempo .vl-time-details>div:last-child { max-width:100%; flex-shrink:1 !important; }
 #loja-tiempo .vl-time-details button { min-height:44px !important; white-space:normal; line-height:1.4 !important; }
 #loja-tiempo #timeSpotTitle { word-break:normal; overflow-wrap:normal; }
 @media(max-width:639px) {
  #loja-tiempo #beforeAfterViewer { height:clamp(260px,54svh,400px) !important; }
  #loja-tiempo .vl-time-details { padding:18px !important; gap:16px !important; }
  #loja-tiempo .vl-time-details>div:last-child { width:100%; display:grid !important; grid-template-columns:1fr 1fr; gap:8px !important; }
  #loja-tiempo .vl-time-details button { width:100%; justify-content:center; padding:10px !important; }
  #loja-tiempo #lojaTimeTabsContainer>button:last-child:nth-child(odd) { grid-column:1 / -1; }
 }
 @media(max-width:380px) { #loja-tiempo .vl-time-details>div:last-child { grid-template-columns:1fr; } }
}