/* =========================================================
   SC3D SERP – Google-like UI (Dark + Light support)
   - Mantiene todas tus clases existentes
   - Añade estilos para .sc3d-knowledge-panel (kp-*)
   - Sidebar sticky y widgets compactos
   ========================================================= */

/* ---------- THEME TOKENS ---------- */
.sc3d-serp{
  /* Dark (por defecto) */
  --bg:#1f1f1f;
  --bg-elev:#222;
  --bg-card:#2d2d2d;
  --bg-hover:#3a3a3a;
  --text:#e8eaed;
  --text-strong:#f1f3f4;
  --text-light:#9aa0a6;
  --muted:#9aa0a6;
  --link:#8ab4f8;
  --link-hover:#a0c0fb;
  --visited:#c58af9;
  --border:#3c4043;
  --border-light:#5f6368;
  --brand:#8ab4f8;
  --accent:#8ab4f8;
  --warning:#ea4335;
  --success:#34a853;
  --rating:#fbbc04;
  --ai-bg:#0b2a4c;         /* más sutil, Googley */
  --ai-bg-grad1:#102d4f;
  --ai-bg-grad2:#173a66;
  --ai-border:#2d5a8f;
  --shadow:0 1px 6px rgba(0,0,0,.4);
  --shadow-card:0 1px 2px rgba(0,0,0,.3),0 2px 6px 2px rgba(0,0,0,.15);

  font:14px/1.58 Roboto, Arial, sans-serif;
  color:var(--text);
  background:var(--bg);
}

/* Light theme (auto por preferencia o añadiendo .theme-light a .sc3d-serp) */
.sc3d-serp.theme-light,
@media (prefers-color-scheme: light){
  .sc3d-serp:not(.theme-dark){
    --bg:#fff;
    --bg-elev:#fff;
    --bg-card:#fff;
    --bg-hover:#f1f3f4;
    --text:#202124;
    --text-strong:#202124;
    --text-light:#5f6368;
    --muted:#5f6368;
    --link:#1a73e8;
    --link-hover:#1259b2;
    --visited:#681da8;
    --border:#dadce0;
    --border-light:#e0e0e0;
    --brand:#1a73e8;
    --accent:#1a73e8;
    --warning:#d93025;
    --success:#188038;
    --rating:#fbbc04;
    --ai-bg:#e8f0fe;
    --ai-bg-grad1:#e8f0fe;
    --ai-bg-grad2:#d2e3fc;
    --ai-border:#d2e3fc;
    --shadow:0 1px 2px rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15);
    --shadow-card:0 1px 2px rgba(60,64,67,.2),0 2px 6px rgba(60,64,67,.15);
    color:var(--text);
    background:var(--bg);
  }
}

/* ---------- BASE ---------- */
@keyframes sc3d-fadeIn{from{opacity:0}to{opacity:1}}
.sc3d-as-wrap{
  background:var(--bg);
  padding:0;
  max-width:none !important;
  width:100% !important;
  margin:0;
  animation:sc3d-fadeIn .18s ease-out;
  box-sizing:border-box;
}
.sc3d-as, .sc3d-serp{ color:var(--text); }

/* Focus visible accesible */
.sc3d-serp :focus-visible{
  outline:2px solid var(--brand);
  outline-offset:2px;
  border-radius:6px;
}

/* Links */
.sc3d-serp a{ color:var(--link); text-decoration:none; }
.sc3d-serp a:hover{ text-decoration:underline; color:var(--link-hover); }
.sc3d-serp a:visited{ color:var(--visited); }

/* ---------- NAV CHIPS ---------- */
.sc3d-nav-chips{
  display:flex; gap:8px; padding:12px 16px;
  overflow-x:auto; overflow-y:hidden; scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  border-bottom:1px solid var(--border);
  background:var(--bg);
}
.sc3d-nav-chips::-webkit-scrollbar{display:none}
.sc3d-nav-chip{
  flex:0 0 auto; padding:8px 14px;
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--bg-elev);
  color:var(--text);
  font-size:13px; font-weight:500;
  cursor:pointer; transition:all .2s; white-space:nowrap;
}
.sc3d-nav-chip:hover{ background:var(--bg-hover); border-color:var(--border-light); }
.sc3d-nav-chip.active{ background:var(--brand); color:#fff; border-color:var(--brand); }

/* ---------- LAYOUT ---------- */
.sc3d-serp-layout{
  display:flex !important; flex-direction:column !important;
  gap:0 !important; width:100% !important; margin:0 !important; padding:0 !important;
  box-sizing:border-box !important;
}
.sc3d-serp-main{
  flex:1 !important; min-width:0 !important; width:100% !important; padding:0 !important;
}

/* Sidebar oculto por defecto (móvil) */
.sc3d-serp-sidebar{ display:none !important; }

/* Desktop maximizado con RHS */
[data-sc3d-cb].is-fullscreen .sc3d-serp-layout{
  flex-direction:row !important; gap:24px !important;
  max-width:1280px !important; margin:0 auto !important; padding:0 24px !important;
}
[data-sc3d-cb].is-fullscreen .sc3d-serp-main{
  flex:1 !important; max-width:760px !important;
}
[data-sc3d-cb].is-fullscreen .sc3d-serp-sidebar{
  display:block !important; flex:0 0 360px !important;
  position:sticky !important; top:16px !important; align-self:flex-start !important;
  /* Optimización de rendimiento para scroll suave */
  will-change: top; /* hint para compositor */
  transform: translateZ(0); /* fuerza capa propia */
  contain: content; /* aísla pintura/contenido */
}

/* Desactivar sticky cuando el contenido supera el alto de la ventana (controlado por JS) */
[data-sc3d-cb].is-fullscreen .sc3d-serp-sidebar.no-sticky{
  position:static !important; top:auto !important;
}

/* Nunca sidebar en <768px */
@media (max-width:768px){
  .sc3d-serp-sidebar{ display:none !important; }
  .sc3d-serp-layout{ flex-direction:column !important; }
  [data-sc3d-cb].is-fullscreen .sc3d-serp-sidebar{ display:none !important; }
}

/* ---------- AI OVERVIEW (Googley) ---------- */
.sc3d-ai-overview{
  background:linear-gradient(135deg, var(--ai-bg-grad1) 0%, var(--ai-bg-grad2) 100%);
  border:1px solid var(--ai-border);
  border-radius:16px; padding:16px; margin:16px; position:relative; overflow:hidden;
  box-shadow:var(--shadow);
}
.sc3d-ai-overview::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent);
  transform:translateX(-100%); animation:sc3d-shimmer 2.4s infinite;
}
@keyframes sc3d-shimmer{ 0%{transform:translateX(-100%)} 100%{transform:translateX(100%)} }

.sc3d-ai-header{ display:flex; align-items:center; gap:8px; margin:0 0 8px; color:var(--brand); font-weight:500; }
.sc3d-ai-icon{
  width:24px; height:24px; border-radius:50%;
  background:linear-gradient(135deg, var(--brand), var(--visited));
  display:flex; align-items:center; justify-content:center; font-size:14px;
}
.sc3d-ai-title{ font-size:14px; color:var(--brand); }
.sc3d-ai-toggle{
  margin-left:auto; background:none; border:none; color:var(--brand);
  font-size:13px; cursor:pointer; font-weight:500; padding:0;
}
.sc3d-ai-content{ color:var(--text); line-height:1.6; font-size:14px; white-space:pre-wrap; }
.sc3d-ai-content p{ margin:0 0 12px; }
.sc3d-ai-content p:last-child{ margin-bottom:0; }

.sc3d-ai-typing{
  display:inline-block; width:8px; height:16px;
  background:var(--brand); margin-left:2px; animation:sc3d-blink 1s infinite;
}
@keyframes sc3d-blink{ 0%,49%{opacity:1} 50%,100%{opacity:0} }

.sc3d-ai-sources{
  margin-top:12px; padding-top:12px; border-top:1px solid rgba(255,255,255,0.08);
  display:flex; gap:8px; flex-wrap:wrap;
}
.sc3d-ai-source{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 10px; background:rgba(255,255,255,.06);
  border-radius:12px; font-size:12px; color:var(--text-light);
}
.sc3d-ai-source:hover{ background:rgba(255,255,255,.12); }

.sc3d-ai-content.collapsed{ max-height:88px; overflow:hidden; position:relative; }
.sc3d-ai-content.collapsed::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:36px;
  background:linear-gradient(transparent, var(--ai-bg-grad2));
}

/* ---------- FAQS ---------- */
.sc3d-faqs{
  margin:16px; border:1px solid var(--border); border-radius:16px; overflow:hidden; background:var(--bg-card);
}
.sc3d-faq-header{ padding:16px; font-weight:500; font-size:18px; color:var(--text); border-bottom:1px solid var(--border); }
.sc3d-faq-item{ border-bottom:1px solid var(--border); }
.sc3d-faq-item:last-child{ border-bottom:none; }
.sc3d-faq-question{
  width:100%; padding:14px 16px; background:transparent; border:none;
  text-align:left; font-size:14px; color:var(--text); cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; transition:background .15s;
}
.sc3d-faq-question:hover{ background:var(--bg-hover); }
.sc3d-faq-question::after{ content:'▼'; font-size:12px; color:var(--muted); transition:transform .25s; margin-left:12px; }
.sc3d-faq-question[aria-expanded="true"]::after{ transform:rotate(180deg); }
.sc3d-faq-answer{ max-height:0; overflow:hidden; transition:max-height .25s ease; }
.sc3d-faq-answer-content{ padding:0 16px 14px; color:var(--text-light); line-height:1.58; font-size:14px; }

/* ---------- IMÁGENES (grid 2x2) ---------- */
.sc3d-images-section{
  margin:16px; padding:16px; background:var(--bg-card);
  border:1px solid var(--border); border-radius:16px;
}
.sc3d-images-header{ display:flex; justify-content:space-between; align-items:center; margin:0 0 12px; }
.sc3d-images-title{ font-size:18px; font-weight:500; color:var(--text); margin:0; }
.sc3d-images-toggle{ background:none; border:none; color:var(--brand); font-size:14px; cursor:pointer; padding:0; font-weight:500; }
.sc3d-images-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.sc3d-image-item{ position:relative; aspect-ratio:1; border-radius:12px; overflow:hidden; background:var(--bg-hover); }
.sc3d-image-item img{ width:100%; height:100%; object-fit:cover; display:block; }
.sc3d-image-caption{
  position:absolute; inset:auto 0 0 0; padding:8px;
  background:linear-gradient(transparent, rgba(0,0,0,.7)); color:#fff; font-size:12px; line-height:1.3;
}
.sc3d-images-more{ margin-top:10px; text-align:center; }
.sc3d-images-more-btn{
  background:none; border:1px solid var(--border); color:var(--brand);
  padding:8px 16px; border-radius:999px; font-size:13px; cursor:pointer; font-weight:500;
}

/* Mostrar/Ocultar extras de imágenes */
.sc3d-images-section .sc3d-image-item.is-extra{ display:none; }
.sc3d-images-section.is-expanded .sc3d-image-item.is-extra{ display:block; }

/* ---------- PRODUCT CARDS (Shopping-like) ---------- */
.sc3d-product-cards{ padding:0 16px; }
.sc3d-product-card{
  background:var(--bg-card); border:1px solid var(--border); border-radius:16px;
  margin:0 0 16px; overflow:hidden; box-shadow:var(--shadow-card);
}
.sc3d-product-card-image{ position:relative; width:100%; aspect-ratio:16/9; background:var(--bg-hover); }
.sc3d-product-card-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.sc3d-product-badge{
  position:absolute; top:8px; left:8px; background:#1f1f1fcc; color:#fff;
  padding:4px 8px; border-radius:4px; font-size:11px; font-weight:700; text-transform:uppercase;
}
.sc3d-product-card-body{ padding:12px; }
.sc3d-product-title{ font-size:16px; font-weight:400; color:var(--link); margin:0 0 4px; line-height:1.3; display:block; }
.sc3d-product-title:hover{ text-decoration:underline; }
.sc3d-product-price{ font-size:20px; font-weight:500; color:var(--text); margin:0 0 4px; }
.sc3d-product-price-old{ font-size:14px; color:var(--muted); text-decoration:line-through; margin-left:8px; }
.sc3d-product-vendor{ display:flex; align-items:center; gap:6px; margin:0 0 8px; }
.sc3d-product-vendor-icon{ width:16px; height:16px; border-radius:50%; background:var(--bg-hover); }
.sc3d-product-vendor-name{ font-size:12px; color:var(--text-light); }
.sc3d-product-rating{ display:flex; align-items:center; gap:4px; font-size:12px; color:var(--text-light); }
.sc3d-product-stars{ color:var(--rating); font-size:14px; }

/* ---------- RHS / SIDEBAR ---------- */
.sc3d-serp-rhs{display:none}
@media (min-width:1024px){
  .sc3d-serp-layout{ flex-direction:row; gap:24px; padding:16px; }
  .sc3d-serp-main{ flex:1; }
  .sc3d-serp-rhs{ display:block; width:360px; flex-shrink:0; }
}
.sc3d-serp-rhs-card{
  background:var(--bg-card); border:1px solid var(--border); border-radius:16px;
  padding:16px; box-shadow:var(--shadow-card); position:sticky; top:16px;
}
.sc3d-serp-rhs-card .rhs-img{
  width:100%; height:200px; object-fit:cover; border-radius:12px; margin:0 0 12px;
}
.sc3d-serp-rhs-card .rhs-title{ font-size:18px; font-weight:500; color:var(--text); margin:0 0 8px; line-height:1.3; }
.sc3d-serp-rhs-card .rhs-price{ font-size:24px; font-weight:500; color:var(--text); margin:0 0 8px; }
.sc3d-serp-rhs-card .rhs-meta{ color:var(--text-light); font-size:13px; margin:0 0 12px; line-height:1.58; }
.sc3d-serp-rhs-card .rhs-cta{
  display:block; width:100%; text-align:center; padding:12px 24px;
  background:var(--brand); color:#fff; border-radius:999px; font-weight:500; font-size:14px; transition:filter .2s;
}
.sc3d-serp-rhs-card .rhs-cta:hover{ filter:brightness(0.95); }

/* ---------- KNOWLEDGE PANEL (kp-*) ---------- */
.sc3d-knowledge-panel{
  background:var(--bg-card); border:1px solid var(--border); border-radius:16px;
  padding:16px; box-shadow:var(--shadow-card);
}
.sc3d-knowledge-panel .kp-image{
  width:100%; height:auto; border-radius:12px; overflow:hidden; margin:0 0 12px;
  background:var(--bg-hover);
}
.sc3d-knowledge-panel .kp-image img{ width:100%; height:auto; display:block; object-fit:cover; }

.sc3d-knowledge-panel .kp-title{
  font-size:20px; font-weight:500; color:var(--text-strong); margin:0 0 4px; line-height:1.3;
}
.sc3d-knowledge-panel .kp-subtitle{
  font-size:13px; color:var(--text-light); margin:0 0 10px;
}
.sc3d-knowledge-panel .kp-description{
  font-size:14px; color:var(--text); line-height:1.58; margin:0 0 12px;
}

.sc3d-knowledge-panel .kp-rating{
  display:flex; align-items:center; gap:6px; margin:8px 0 12px;
  font-size:13px; color:var(--text-light);
}
.sc3d-knowledge-panel .kp-stars{ color:var(--rating); letter-spacing:.5px; }
.sc3d-knowledge-panel .kp-rate-text{ color:var(--text-light); }

.sc3d-knowledge-panel .kp-dl{ margin:0; padding:0; }
.sc3d-knowledge-panel .kp-data-row{
  display:flex; gap:8px; align-items:flex-start;
  padding:6px 0; border-bottom:1px solid var(--border-light);
}
.sc3d-knowledge-panel .kp-data-row:last-child{ border-bottom:none; }
.sc3d-knowledge-panel .kp-data-label{
  min-width:110px; color:var(--text-light); font-weight:500;
}
.sc3d-knowledge-panel .kp-data-value{ color:var(--text); }

.sc3d-knowledge-panel .kp-contact{ margin:8px 0 12px; }
.sc3d-knowledge-panel .kp-contact-list{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.sc3d-knowledge-panel .kp-contact a{ color:var(--link); }

.sc3d-knowledge-panel .kp-links{ margin:8px 0 0; }
.sc3d-knowledge-panel .kp-links-title{ font-size:14px; color:var(--text); margin:0 0 8px; }
.sc3d-knowledge-panel .kp-link-list{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.sc3d-knowledge-panel .kp-link{ color:var(--link); }

.sc3d-knowledge-panel .kp-cta{
  display:block; width:100%; text-align:center; margin-top:12px;
  padding:10px 16px; background:var(--brand); color:#fff; border-radius:999px; font-weight:500; font-size:14px;
}
.sc3d-knowledge-panel .kp-cta:hover{ filter:brightness(0.95); }

/* ---------- RESULTADOS ORGÁNICOS ---------- */
.sc3d-organic-results{ padding:0 16px; }
.sc3d-organic-result{ padding:16px 0; border-bottom:1px solid var(--border); }
.sc3d-organic-result:last-child{ border-bottom:none; }
.sc3d-or-header{ display:flex; align-items:center; gap:8px; margin:0 0 6px; }
.sc3d-or-favicon{
  width:20px; height:20px; border-radius:50%; overflow:hidden; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center; background:var(--bg-hover);
}
.sc3d-or-favicon img{ width:100%; height:100%; object-fit:cover; }
.sc3d-or-domain{ flex:1; font-size:13px; color:var(--text-light); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sc3d-or-menu{
  flex:0 0 auto; width:28px; height:28px; border:none; background:transparent;
  color:var(--muted); font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center;
  border-radius:50%; transition:background .15s;
}
/* Popover del menú (⋮) en resultados orgánicos */
.sc3d-or-header{ position:relative; }
.sc3d-or-menu-popover{
  position:absolute; right:0; top:100%; margin-top:6px;
  background:var(--bg-card); border:1px solid var(--border); border-radius:10px;
  box-shadow:var(--shadow); z-index:1000; min-width:180px; padding:6px;
}
.sc3d-or-menu-popover button{
  width:100%; background:transparent; border:none; cursor:pointer;
  padding:8px 10px; color:var(--text); font-size:14px; text-align:left; border-radius:8px;
}
.sc3d-or-menu-popover button:hover{ background:var(--bg-hover); }

.sc3d-or-menu:hover{ background:var(--bg-hover); }
.sc3d-or-title{ font-size:20px; font-weight:400; margin:0 0 6px; line-height:1.3; }
.sc3d-or-title a{ color:var(--link); }
.sc3d-or-title a:visited{ color:var(--visited); }
.sc3d-or-snippet{ font-size:14px; color:var(--text-light); line-height:1.58; margin:6px 0 0; }

.sc3d-or-images-carousel{
  position:relative; display:flex; align-items:center; gap:4px; margin:10px 0; padding:0 4px;
}
.sc3d-or-carousel-track{
  display:flex; gap:8px; overflow-x:auto; overflow-y:hidden;
  scroll-behavior:smooth; scrollbar-width:none; -webkit-overflow-scrolling:touch;
  flex:1; min-width:0;
}
.sc3d-or-carousel-track::-webkit-scrollbar{ display:none; }
.sc3d-or-carousel-item{
  flex:0 0 auto; width:112px; height:112px; border-radius:8px; overflow:hidden;
  background:var(--bg-hover); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center; position:relative;
}
.sc3d-or-carousel-item img{ width:100%; height:100%; object-fit:cover; display:block; }
.sc3d-or-carousel-btn{
  flex:0 0 auto; width:36px; height:36px; border-radius:50%;
  background:rgba(45,45,45,.95); border:1px solid var(--border); color:var(--text);
  font-size:22px; cursor:pointer; display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.4); transition:transform .15s, background .15s; user-select:none;
}
.sc3d-or-carousel-btn:hover{ background:rgba(58,58,58,.95); transform:scale(1.06); }
.sc3d-or-carousel-btn[style*="opacity: 0"]{ opacity:0; pointer-events:none; }

.sc3d-or-rating{ font-size:13px; color:var(--muted); display:flex; align-items:center; gap:4px; margin-top:6px; }
.sc3d-or-stars{ color:var(--rating); }

/* ---------- TABS (filtro) ---------- */
.sc3d-serp .tabs{
  display:flex; gap:22px; align-items:center; margin:0 0 12px; color:var(--muted);
  flex-wrap:wrap; border-bottom:1px solid var(--border); padding:0 16px 8px;
}
.sc3d-serp .tabs input{ position:absolute; opacity:0; pointer-events:none; }
.sc3d-serp .tab{ cursor:pointer; position:relative; padding:0 0 8px; transition:color .15s; font-size:13px; }
.sc3d-serp .tab:hover{ color:var(--text); }

#sc3d-tab-all:checked + label,
#sc3d-tab-products:checked + label,
#sc3d-tab-categories:checked + label,
#sc3d-tab-cms:checked + label,
#sc3d-tab-blog:checked + label,
#sc3d-tab-offers:checked + label{
  color:var(--brand); font-weight:500;
}
#sc3d-tab-all:checked + label::after,
#sc3d-tab-products:checked + label::after,
#sc3d-tab-categories:checked + label::after,
#sc3d-tab-cms:checked + label::after,
#sc3d-tab-blog:checked + label::after,
#sc3d-tab-offers:checked + label::after{
  content:""; position:absolute; left:0; right:0; bottom:-9px; height:3px;
  background:var(--brand); border-radius:3px 3px 0 0;
}

/* Filtro por tipo */
.sc3d-serp .results .sr{ display:block!important; }
#sc3d-tab-products:checked ~ .sc3d-serp-layout .results .sr{ display:none!important; }
#sc3d-tab-products:checked ~ .sc3d-serp-layout .results .sr[data-type="product"]{ display:block!important; }
#sc3d-tab-categories:checked ~ .sc3d-serp-layout .results .sr{ display:none!important; }
#sc3d-tab-categories:checked ~ .sc3d-serp-layout .results .sr[data-type="category"]{ display:block!important; }
#sc3d-tab-cms:checked ~ .sc3d-serp-layout .results .sr{ display:none!important; }
#sc3d-tab-cms:checked ~ .sc3d-serp-layout .results .sr[data-type="cms"]{ display:block!important; }
#sc3d-tab-blog:checked ~ .sc3d-serp-layout .results .sr{ display:none!important; }
#sc3d-tab-blog:checked ~ .sc3d-serp-layout .results .sr[data-type="blog"]{ display:block!important; }
#sc3d-tab-offers:checked ~ .sc3d-serp-layout .results .sr{ display:none!important; }
#sc3d-tab-offers:checked ~ .sc3d-serp-layout .results .sr[data-type="offer"]{ display:block!important; }

/* ---------- CAROUSELES (productos, vídeos, shopping, news) ---------- */
.sc3d-products-section{ margin:16px; }
.sc3d-products-header{ margin:0 0 12px; }
.sc3d-products-title{ font-size:18px; font-weight:500; color:var(--text); margin:0; }
.sc3d-products-carousel{ position:relative; display:flex; align-items:center; gap:8px; }
.sc3d-carousel-track{
  display:flex; gap:12px; overflow-x:auto; overflow-y:hidden; scroll-behavior:smooth;
  scrollbar-width:none; -webkit-overflow-scrolling:touch; padding:4px 0;
}
.sc3d-carousel-track::-webkit-scrollbar{ display:none; }
.sc3d-carousel-item{ flex:0 0 auto; width:180px; }
.sc3d-carousel-btn{
  flex:0 0 auto; width:40px; height:40px; border-radius:50%;
  background:var(--bg-card); border:1px solid var(--border);
  color:var(--text); font-size:22px; cursor:pointer; display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow); transition:transform .15s, background .15s;
}
.sc3d-carousel-btn:hover{ background:var(--bg-hover); transform:scale(1.06); }
.sc3d-carousel-btn:disabled, .sc3d-carousel-btn[style*="opacity: 0"]{ opacity:0; pointer-events:none; }

/* Product card carousel */
.sc3d-product-card-carousel{
  background:var(--bg-card); border:1px solid var(--border);
  border-radius:12px; overflow:hidden; height:100%; display:flex; flex-direction:column; transition:box-shadow .15s, border-color .15s;
}
.sc3d-product-card-carousel:hover{ box-shadow:var(--shadow-card); border-color:var(--border-light); }
.sc3d-pcc-link{ text-decoration:none; color:inherit; display:flex; flex-direction:column; height:100%; }
.sc3d-pcc-image{ position:relative; width:100%; height:180px; background:var(--bg-hover); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.sc3d-pcc-image img{ width:100%; height:100%; object-fit:contain; }
.sc3d-pcc-badge{ position:absolute; top:8px; left:8px; background:var(--warning); color:#fff; font-size:11px; font-weight:700; padding:4px 8px; border-radius:4px; text-transform:uppercase; }
.sc3d-pcc-info{ padding:12px; display:flex; flex-direction:column; gap:6px; }
.sc3d-pcc-title{ font-size:14px; font-weight:400; color:var(--text); margin:0; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sc3d-pcc-price{ font-size:16px; font-weight:700; color:var(--text); }
.sc3d-pcc-vendor{ font-size:12px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sc3d-pcc-rating{ font-size:12px; color:var(--muted); display:flex; align-items:center; gap:4px; }
.sc3d-pcc-stars{ color:var(--rating); }

/* Videos */
.sc3d-videos-section{ margin:16px; }
.sc3d-videos-title{ font-size:18px; font-weight:500; margin-bottom:12px; color:var(--text); }
.sc3d-videos-carousel{ position:relative; display:flex; align-items:center; gap:8px; }
.sc3d-videos-track{ display:flex; gap:12px; overflow-x:auto; overflow-y:hidden; scroll-behavior:smooth; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding:4px 0; }
.sc3d-videos-track::-webkit-scrollbar{ display:none; }
.sc3d-video-item{
  flex:0 0 auto; width:240px; background:var(--bg-card); border:1px solid var(--border);
  border-radius:8px; overflow:hidden; cursor:pointer; transition:transform .15s, border-color .15s;
}
.sc3d-video-item:hover{ transform:translateY(-1px); border-color:var(--link); }
.sc3d-video-thumbnail{ position:relative; width:100%; aspect-ratio:16/9; background:var(--bg-hover); display:flex; align-items:center; justify-content:center; }
.sc3d-video-thumbnail img{ width:100%; height:100%; object-fit:cover; }
.sc3d-video-play{
  position:absolute; width:48px; height:48px; background:rgba(0,0,0,.8);
  border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:20px;
}
.sc3d-video-info{ padding:12px; }
.sc3d-video-title{ font-size:14px; color:var(--text); margin-bottom:4px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sc3d-video-channel{ font-size:12px; color:var(--muted); }

/* Shopping */
.sc3d-shopping-section{ margin:16px; background:var(--bg-card); border:1px solid var(--border); border-radius:12px; padding:16px; }
.sc3d-shopping-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.sc3d-shopping-title{ font-size:18px; font-weight:500; color:var(--text); }
.sc3d-shopping-badge{ background:var(--warning); color:#fff; padding:4px 8px; border-radius:4px; font-size:12px; font-weight:700; }
.sc3d-shopping-carousel{ position:relative; display:flex; align-items:center; gap:8px; }
.sc3d-shopping-track{ display:flex; gap:12px; overflow-x:auto; overflow-y:hidden; scroll-behavior:smooth; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding:4px 0; }
.sc3d-shopping-track::-webkit-scrollbar{ display:none; }
.sc3d-shopping-item{
  flex:0 0 auto; width:180px; background:var(--bg); border:1px solid var(--border);
  border-radius:8px; overflow:hidden; cursor:pointer; transition:transform .15s, border-color .15s;
}
.sc3d-shopping-item:hover{ transform:translateY(-1px); border-color:var(--link); }
.sc3d-shopping-image{ width:100%; aspect-ratio:1; background:var(--bg-hover); display:flex; align-items:center; justify-content:center; position:relative; }
.sc3d-shopping-image img{ width:100%; height:100%; object-fit:contain; }
.sc3d-shopping-discount{ position:absolute; top:8px; right:8px; background:var(--warning); color:#fff; padding:4px 8px; border-radius:4px; font-size:12px; font-weight:700; }
.sc3d-shopping-info{ padding:12px; }
.sc3d-shopping-name{ font-size:14px; color:var(--text); margin-bottom:8px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sc3d-shopping-prices{ display:flex; align-items:center; gap:8px; margin-bottom:4px; }
.sc3d-shopping-price{ font-size:16px; font-weight:700; color:var(--success); }
.sc3d-shopping-old-price{ font-size:14px; color:var(--muted); text-decoration:line-through; }
.sc3d-shopping-store{ font-size:12px; color:var(--muted); }

/* News */
.sc3d-news-section{ margin:16px; }
.sc3d-news-title{ font-size:18px; font-weight:500; margin-bottom:12px; color:var(--text); }
.sc3d-news-carousel{ position:relative; display:flex; align-items:center; gap:8px; }
.sc3d-news-track{ display:flex; gap:16px; overflow-x:auto; overflow-y:hidden; scroll-behavior:smooth; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding:4px 0; }
.sc3d-news-track::-webkit-scrollbar{ display:none; }
.sc3d-news-item{
  flex:0 0 auto; width:320px; background:var(--bg-card); border:1px solid var(--border);
  border-radius:12px; overflow:hidden; cursor:pointer; transition:transform .15s, border-color .15s;
}
.sc3d-news-item:hover{ transform:translateY(-1px); border-color:var(--link); }
.sc3d-news-image{ width:100%; height:160px; background:var(--bg-hover); display:flex; align-items:center; justify-content:center; }
.sc3d-news-image img{ width:100%; height:100%; object-fit:cover; }
.sc3d-news-content{ padding:16px; }
.sc3d-news-meta{ display:flex; align-items:center; gap:8px; margin-bottom:8px; font-size:12px; color:var(--muted); }
.sc3d-news-source{ font-weight:500; }
.sc3d-news-date{ opacity:.8; }
.sc3d-news-headline{ font-size:16px; font-weight:500; color:var(--link); margin-bottom:8px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sc3d-news-snippet{ font-size:14px; color:var(--text-light); line-height:1.6; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

/* ---------- RESULTADOS fallback (legacy .sr) ---------- */
.sc3d-serp .sr{ margin:0 0 16px; padding:12px 16px; }
.sc3d-serp .sr .title{ margin:0 0 4px; }
.sc3d-serp .sr .title a{ font-size:18px; line-height:1.3; color:var(--link)!important; font-weight:400; }
.sc3d-serp .sr .snippet{ color:var(--text-light); margin:0; font-size:14px; line-height:1.58; }
.sc3d-serp .sr .row{ display:flex; gap:12px; align-items:flex-start; }
.sc3d-serp .sr .thumb{ min-width:112px; max-width:112px; height:112px; object-fit:cover; border-radius:8px; background:#f1f3f4; border:1px solid var(--border); }
.sc3d-serp .sr .path{ display:flex; align-items:center; gap:6px; margin:0 0 4px; color:var(--muted); }
.sc3d-serp .sr .favicon{ width:16px; height:16px; border-radius:4px; flex:0 0 16px; }
.sc3d-serp .sr .host{ font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sc3d-serp .sr .meta{ color:var(--muted); font-size:13px; margin:0 0 4px; }
.sc3d-serp .sr mark{ background:transparent; color:var(--text); font-weight:700; }
.sc3d-serp .rc{ color:var(--muted); font-size:14px; margin:0 0 16px; padding:0 16px; }

/* ---------- RESPONSIVE FINO ---------- */
@media (max-width:640px){
  .sc3d-as-wrap{ padding:0; }
  .sc3d-nav-chips{ padding:12px 12px; }
  .sc3d-ai-overview{ margin:12px; padding:12px; }
  .sc3d-faqs{ margin:12px; }
  .sc3d-images-section{ margin:12px; }
  .sc3d-product-cards{ padding:0 12px; }
  .sc3d-serp .sr .row{ flex-direction:column; }
  .sc3d-serp .sr .thumb{ min-width:100%; max-width:100%; height:auto; }
  .sc3d-serp .tabs{ padding:0 12px 8px; }
  .sc3d-serp .rc{ padding:0 12px; }
  .sc3d-products-section{ margin:12px; }
  .sc3d-organic-results{ padding:0 12px; }
}


/* ---------- LAZY IMAGE LOADER (skeleton shimmer) ---------- */
.sc3d-img-loading{ position:relative; overflow:hidden; }
.sc3d-img-loading::after{
  content:""; position:absolute; inset:0; border-radius:inherit;
  background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.12) 50%, rgba(255,255,255,0) 100%);
  background-size: 200% 100%; animation: sc3d-img-shimmer 1.2s linear infinite;
}
.sc3d-img-loaded::after{ display:none; }
@keyframes sc3d-img-shimmer { 0%{ background-position: -200% 0; } 100%{ background-position: 200% 0; } }
/* ===== Miniatura de resultados orgánicos estilo Google ===== */
.sc3d-organic-result{
  padding:16px 0;
  border-bottom:1px solid var(--border);
}
.sc3d-organic-result:last-child{ border-bottom:none; }

.sc3d-or-row{
  display:grid;
  grid-template-columns: 1fr 132px;  /* texto + thumb */
  gap:16px;
  align-items:start;
}

.sc3d-or-col{ min-width:0; } /* permite elipsis correctas */

.sc3d-or-title{
  font-size:20px;
  font-weight:400;
  margin:0 0 6px;
  line-height:1.3;
}
.sc3d-or-title a{ color:var(--link); text-decoration:none; }
.sc3d-or-title a:hover{ text-decoration:underline; }
.sc3d-or-title a:visited{ color:var(--visited); }

.sc3d-or-snippet{
  font-size:14px;
  color:var(--text-light);
  line-height:1.58;
  margin:6px 0 0;
}

/* Cabecera (favicon + dominio + menú) */
.sc3d-or-header{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 6px;
}
.sc3d-or-favicon{
  width:20px; height:20px; border-radius:50%;
  overflow:hidden; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center;
  background:var(--bg-hover);
}
.sc3d-or-favicon img{ width:100%; height:100%; object-fit:cover; display:block; }
.sc3d-or-domain{ flex:1; font-size:13px; color:var(--text-light); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sc3d-or-menu{
  width:28px; height:28px; border:none; background:transparent; color:var(--muted);
  font-size:18px; cursor:pointer; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  transition:background .15s;
}
.sc3d-or-menu:hover{ background:var(--bg-hover); }

/* Miniatura derecha */
.sc3d-or-thumb{
  display:block;
  width:132px;
  aspect-ratio:1 / 1;
  border-radius:12px;
  overflow:hidden;
  border:1px solid var(--border);
  background:var(--bg-hover);
  box-shadow: var(--shadow-card);
  align-self:start;
}
.sc3d-or-thumb img{
  width:100%; height:100%;
  object-fit:cover; display:block;
}

/* Rating */
.sc3d-or-rating{
  font-size:13px; color:var(--muted);
  display:flex; align-items:center; gap:4px; margin-top:6px;
}
.sc3d-or-stars{ color:var(--rating); }

/* Responsive: miniatura más compacta y a la derecha igual */
@media (max-width: 680px){
  .sc3d-or-row{
    grid-template-columns: 1fr 96px;
    gap:12px;
  }
  .sc3d-or-thumb{
    width:96px; border-radius:10px;
  }
}

/* Si prefieres que en pantallas muy pequeñas la imagen baje debajo del texto: */
/*
@media (max-width: 480px){
  .sc3d-or-row{
    grid-template-columns: 1fr;
  }
  .sc3d-or-thumb{
    width:100%;
    max-width:320px;
    aspect-ratio:16/9;
    justify-self:end;
  }
}
*/