/* Advanced styling for SEO Summary Box */
/* CSS variables baseline */
#seo-summary-box-root { --ssb-card-bg:#ffffff; --ssb-tabs-bg:#f8fafc; --ssb-active-bg:#eef2ff; --ssb-tab-text:#0f172a; --brand-size: 84px; }
#seo-summary-box-root .ssb-card { background: var(--ssb-card-bg); border-radius: 14px; box-shadow: 0 14px 38px rgba(2,6,23,0.08); overflow: hidden; border: 1px solid rgba(15,23,42,0.06); direction: rtl; }
.ssb-card { margin-bottom: var(--ssb-mb, 24px); }
.ssb-tabs { display:flex; gap:0; background:var(--ssb-tabs-bg); }
.ssb-tabs button { flex:1; padding:12px 14px; border:0; background:transparent; cursor:pointer; font-weight:600; color:var(--ssb-tab-text); }
.ssb-tabs button.active { background:linear-gradient(90deg,var(--ssb-active-bg),#fff); }
.ssb-tabtitle { display:inline-flex; align-items:center; gap:8px; }
.ssb-badge { font-size:14px; line-height:1; }
.ssb-content { padding:16px; }
.ssb-infographic { width:100%; max-height:480px; overflow:auto; }
.ssb-tooltip { position: absolute; z-index:9999; background: #fff; padding:10px; border-radius:8px; box-shadow:0 6px 18px rgba(2,6,23,0.08); max-width:320px; }
.ssb-media { width:100%; height:auto; border-radius:8px; }
.ssb-media::-webkit-media-controls-enclosure { overflow: hidden; border-radius: 8px; }
/* Fix Chrome not showing audio element when parent styles interfere */
.ssb-audio { display:block !important; min-height:38px; background:#fff; }
.ssb-media[controls] { outline:none; }
.ssb-small { font-size:14px; color:#475569; }
.ssb-split { display:grid; grid-template-columns: 1fr; gap:12px; }
.ssb-split__media { order:1; }
.ssb-split__text { order:2; color:var(--ssb-tab-text); font-weight:600; }
@media (min-width: 768px) {
  .ssb-split { grid-template-columns: 1.2fr 1fr; align-items:center; }
  .ssb-split__media { order:1; }
  .ssb-split__text { order:2; }
}

/* Horizontal Accordion Layout */
#seo-summary-box-root .ssb-card.ssb-acc-h { display:flex; gap:0; }
#seo-summary-box-root .ssb-acc-h__headers { display:flex; flex-direction:column; background:var(--ssb-tabs-bg); min-width:180px; border-inline-end:1px solid rgba(15,23,42,0.06); }
#seo-summary-box-root .ssb-acc-h__headers button { padding:12px 14px; border:0; background:transparent; cursor:pointer; text-align:right; border-bottom:1px solid rgba(15,23,42,0.04); font-weight:600; color:var(--ssb-tab-text); }
#seo-summary-box-root .ssb-acc-h__headers button.active { background:linear-gradient(180deg,var(--ssb-active-bg),#fff); }
#seo-summary-box-root .ssb-acc-h__panel { padding:16px; flex:1; }

/* Vertical Accordion (collapsible full-width sections) */
#seo-summary-box-root .ssb-card.ssb-acc { display:block; }
#seo-summary-box-root .ssb-acc__item { border-bottom:1px solid rgba(15,23,42,0.06); }
#seo-summary-box-root .ssb-acc__header { 
  width:100%; text-align:right; display:block; padding:14px 16px; 
  background:var(--ssb-tabs-bg); border:0; cursor:pointer; font-weight:700; 
  color:var(--ssb-tab-text); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
}
#seo-summary-box-root .ssb-acc__header:hover { 
  background:linear-gradient(180deg,var(--ssb-active-bg),#fff); 
  transform: translateY(-1px);
}
#seo-summary-box-root .ssb-acc__header.active { 
  background:linear-gradient(180deg,var(--ssb-active-bg),#fff); 
  box-shadow: 0 2px 8px rgba(2,6,23,0.08);
}
#seo-summary-box-root .ssb-acc__header::after {
  content: "▼";
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: var(--ssb-tab-text);
  opacity: 0.6;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
#seo-summary-box-root .ssb-acc__header.active::after {
  transform: translateY(-50%) rotate(180deg);
  opacity: 1;
}
#seo-summary-box-root .ssb-acc__panel { 
  padding:0 16px 16px; 
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
#seo-summary-box-root .ssb-acc__content { 
  opacity: 0;
  transform: translateY(-10px);
  animation: ssb-acc-fade-in 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
@keyframes ssb-acc-fade-in {
  to { 
    opacity: 1; 
    transform: translateY(0); 
  }
}
@media (prefers-reduced-motion: reduce) {
  #seo-summary-box-root .ssb-acc__header,
  #seo-summary-box-root .ssb-acc__panel,
  #seo-summary-box-root .ssb-acc__content {
    transition: none;
    animation: none;
  }
  #seo-summary-box-root .ssb-acc__header:hover {
    transform: none;
  }
}

/* Attractive header accents */
#seo-summary-box-root .ssb-tabs button { position:relative; }
#seo-summary-box-root .ssb-tabs button.active::after { content:""; position:absolute; inset-inline-start:0; inset-inline-end:0; bottom:0; height:3px; background:var(--ssb-active-bg); }

/* Elevation on hover to attract attention */
#seo-summary-box-root .ssb-card:hover { box-shadow: 0 18px 48px rgba(2,6,23,0.12); }

/* Preset themes using CSS variables */
#seo-summary-box-root.theme-default { --ssb-card-bg:#ffffff; --ssb-tabs-bg:#f8fafc; --ssb-active-bg:#eef2ff; --ssb-tab-text:#0f172a; }
#seo-summary-box-root.theme-ocean { --ssb-card-bg:#ffffff; --ssb-tabs-bg:#e6f3ff; --ssb-active-bg:#cfe8ff; --ssb-tab-text:#0b3b60; }
#seo-summary-box-root.theme-sunset { --ssb-card-bg:#ffffff; --ssb-tabs-bg:#fff1e6; --ssb-active-bg:#ffe0cc; --ssb-tab-text:#6b2e15; }
#seo-summary-box-root.theme-emerald { --ssb-card-bg:#ffffff; --ssb-tabs-bg:#e9f8f1; --ssb-active-bg:#d3f1e3; --ssb-tab-text:#0b3d2e; }
#seo-summary-box-root.theme-midnight { --ssb-card-bg:#0b1220; --ssb-tabs-bg:#121a2b; --ssb-active-bg:#1c2740; --ssb-tab-text:#dbeafe; }
#seo-summary-box-root.theme-rose { --ssb-card-bg:#ffffff; --ssb-tabs-bg:#fff0f4; --ssb-active-bg:#ffe3ec; --ssb-tab-text:#6d0b2f; }

/* Hero header (PRO) */
#seo-summary-box-root .ssb-hero { padding:18px 18px 10px; display:flex; align-items:center; gap:12px; position:relative; background: linear-gradient(135deg, rgba(14,165,233,0.12), rgba(236,72,153,0.10)); border-bottom: 1px solid rgba(15,23,42,0.06); box-shadow: inset 0 -12px 24px rgba(2,6,23,0.04); overflow:hidden; }
#seo-summary-box-root .ssb-hero::after { content:""; position:absolute; inset:-2px; background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 35%, rgba(255,255,255,0.28) 50%, rgba(255,255,255,0) 65%, rgba(255,255,255,0) 100%); background-size: 250% 250%; background-position: -120% 0; mix-blend-mode: screen; pointer-events:none; animation: ssb-sheen 7s linear infinite; }
@keyframes ssb-sheen { 0% { background-position: -120% 0; } 100% { background-position: 220% 0; } }
@media (prefers-reduced-motion: reduce) { #seo-summary-box-root .ssb-hero::after { animation-duration: 12s; } }
@media (max-width: 640px) { #seo-summary-box-root .ssb-hero::after { background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 40%, rgba(255,255,255,0.16) 50%, rgba(255,255,255,0) 60%, rgba(255,255,255,0) 100%); animation-duration: 10s; } }
#seo-summary-box-root .ssb-hero .ssb-title { font-weight:900; color:var(--ssb-tab-text); display:flex; align-items:center; gap:10px; font-size:20px; letter-spacing:-0.2px; }

#seo-summary-box-root .ssb-hero .typewriter { position:relative; white-space:nowrap; overflow:hidden; }
#seo-summary-box-root .ssb-hero .typewriter::after { content:""; position:absolute; inset-inline-end:-2px; top:50%; transform:translateY(-50%); width:1px; height:1.2em; background: currentColor; animation: ssb-caret 1s step-end infinite; }
@keyframes ssb-caret { 0%, 50% { opacity:1; } 50.01%, 100% { opacity:0; } }
#seo-summary-box-root .ssb-hero .brand {
  margin-right:auto; order:2;
  width: var(--brand-size); height: var(--brand-size); flex: 0 0 var(--brand-size);
  box-sizing: border-box; aspect-ratio: 1 / 1; overflow: hidden;
  display: grid; place-items: center; gap: 0;
  padding: 4px; border-radius: 50%;
  background: linear-gradient(135deg, #38bdf8, #a78bfa, #f472b6);
  box-shadow: 0 10px 20px rgba(2,6,23,0.18);
}
#seo-summary-box-root .ssb-hero > * { position:relative; z-index:1; }
#seo-summary-box-root .ssb-hero .brand .brand-bg {
  width: 100%; height: 100%;
  border-radius: 50%;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  display: block;
  background-color: #fff;
}
#seo-summary-box-root .ssb-hero .rating { font-weight:800; color:#f59e0b; display:flex; align-items:center; gap:4px; font-size:14px; }
#seo-summary-box-root .ssb-hero .rating .star { color:#f59e0b; }
#seo-summary-box-root .ssb-band { position:relative; }
#seo-summary-box-root .ssb-band::before { content:""; position:absolute; left:0; right:0; top:0; height:72px; background:linear-gradient(90deg, rgba(14,165,233,.08), rgba(236,72,153,.08)); z-index:-1; }
#seo-summary-box-root .ssb-takeaways { padding:0 16px 8px; color:#0f172a; }
#seo-summary-box-root .ssb-takeaways ul { margin:8px 0 0; padding-inline-start:20px; }


/* Teaser and Bottom Sheet removed by request */