/* =====================================================================
   2DIN-RADIO.CZ – moderní vzhled (vrstva nad exportem WebSite X5)
   Soubor se načítá jako poslední, proto přebíjí původní styly.
   Barvy a písmo lze měnit v proměnných níže.
   ===================================================================== */
:root{
  --m-navy:#0b1b33;
  --m-navy-2:#132a4d;
  --m-accent:#e0283e;
  --m-accent-2:#ff4d5e;
  --m-blue:#1f6feb;
  --m-text:#1d2433;
  --m-muted:#5b6475;
  --m-bg:#f4f6fa;
  --m-card:#ffffff;
  --m-line:#e3e7ef;
  --m-radius:16px;
  --m-shadow:0 1px 2px rgba(16,24,40,.06),0 4px 16px rgba(16,24,40,.06);
  --m-shadow-hover:0 10px 30px rgba(16,24,40,.14);
  --m-font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
}

/* ---------- Základ ---------- */
html{scroll-behavior:smooth}
body,#imPageExtContainer{background:var(--m-bg)!important;color:var(--m-text)}
body,#imPage,#imPage div,#imPage span,#imPage p,#imPage li,#imPage a,#imPage h1,#imPage h2,#imPage h3,
#imPage td,#imPage th,#imPage input,#imPage button,#imPage select,#imPage textarea,#imPage .label{
  font-family:var(--m-font)!important;
}
#imPage{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
::selection{background:var(--m-accent);color:#fff}

/* ---------- Hlavička ---------- */
#imHeader{
  /* hlavička je průhledná (jako v originále X5) – bílé pozadí dělá #imHeaderBg,
     takže hlavička nikdy nepřekryje obsah stránky */
  background:transparent!important;box-shadow:none!important;
}
/* Nadpisy v hlavičce (logo text + značky) – bez 3D stínů, moderní písmo */
#imHeader [id^="imHeader_imObjectTitle_"][id$="_text"],
#imHeader [id^="imHeader_imObjectTitle_"][id$="_text"] a{
  text-shadow:none!important;font-style:normal!important;letter-spacing:-.01em;
}
#imHeader_imObjectTitle_02_text,#imHeader_imObjectTitle_15_text,#imHeader_imObjectTitle_19_text,#imHeader_imObjectTitle_02_text a,#imHeader_imObjectTitle_15_text a,#imHeader_imObjectTitle_19_text a{
  color:var(--m-navy)!important;font-weight:800!important;
}
#imHeader_imObjectTitle_03_text,#imHeader_imObjectTitle_04_text,#imHeader_imObjectTitle_05_text,#imHeader_imObjectTitle_16_text,#imHeader_imObjectTitle_17_text,#imHeader_imObjectTitle_18_text,#imHeader_imObjectTitle_20_text,#imHeader_imObjectTitle_21_text,#imHeader_imObjectTitle_22_text,#imHeader_imObjectTitle_03_text a,#imHeader_imObjectTitle_04_text a,#imHeader_imObjectTitle_05_text a,#imHeader_imObjectTitle_16_text a,#imHeader_imObjectTitle_17_text a,#imHeader_imObjectTitle_18_text a,#imHeader_imObjectTitle_20_text a,#imHeader_imObjectTitle_21_text a,#imHeader_imObjectTitle_22_text a{
  color:var(--m-accent)!important;font-weight:800!important;
}
/* Horní lišta s kontakty */
#imHeader_imObjectTitle_08_text,#imHeader_imObjectTitle_09_text,#imHeader_imObjectTitle_10_text,#imHeader_imObjectTitle_11_text,#imHeader_imObjectTitle_12_text,#imHeader_imObjectTitle_23_text,#imHeader_imObjectTitle_26_text,#imHeader_imObjectTitle_27_text,#imHeader_imObjectTitle_28_text,#imHeader_imObjectTitle_29_text,#imHeader_imObjectTitle_30_text,#imHeader_imObjectTitle_08_text a,#imHeader_imObjectTitle_09_text a,#imHeader_imObjectTitle_10_text a,#imHeader_imObjectTitle_11_text a,#imHeader_imObjectTitle_12_text a,#imHeader_imObjectTitle_23_text a,#imHeader_imObjectTitle_26_text a,#imHeader_imObjectTitle_27_text a,#imHeader_imObjectTitle_28_text a,#imHeader_imObjectTitle_29_text a,#imHeader_imObjectTitle_30_text a{
  color:var(--m-muted)!important;font-weight:600!important;font-size:13px!important;
  transition:color .2s;
}
#imHeader a:hover{color:var(--m-accent)!important}

/* Menu – „pilulky“ */
#imHeader [id$="_container"] > ul > li > .label-wrapper{
  background:transparent!important;border-color:transparent!important;
  border-radius:999px!important;transition:background .2s,color .2s,transform .2s;
}
#imHeader [id$="_container"] > ul > li > .label-wrapper .label{
  color:var(--m-navy)!important;font-weight:600!important;font-size:15px!important;
}
#imHeader [id$="_container"] > ul > li:hover > .label-wrapper{
  background:#eef2f8!important;
}
#imHeader [id$="_container"] > ul > li.imMnMnCurrent > .label-wrapper{
  background:var(--m-navy)!important;box-shadow:0 4px 12px rgba(11,27,51,.25);
}
#imHeader [id$="_container"] > ul > li.imMnMnCurrent > .label-wrapper .label{color:#fff!important}
/* Rozbalovací podmenu */
#imHeader .multiple-column,#imHeader ul ul{
  border-radius:12px!important;overflow:hidden;box-shadow:var(--m-shadow-hover)!important;
}
#imHeader ul ul .label-wrapper{background:#fff!important;border-color:var(--m-line)!important}
#imHeader ul ul .label-wrapper .label{color:var(--m-navy)!important;font-weight:500!important}
#imHeader ul ul li.imLevel:hover > .label-wrapper,#imHeader ul ul li:hover > .label-wrapper{background:#eef2f8!important}

/* Hamburger (mobil) */
#imHeader .hamburger-button{
  background:var(--m-navy)!important;border-color:var(--m-navy)!important;border-radius:10px!important;
}
#imHeader .hamburger-bar{background-color:#fff!important;border-radius:2px}
.menu-mobile .label-wrapper,[id$="-menu-opened"] .label-wrapper{border-radius:10px}
[id$="-menu-opened"] ul li::after{border-color:var(--m-line)!important;border-style:solid!important;border-width:0 0 1px 0!important}
[id$="-menu-opened"] ul > li:hover:not(.imMnMnSeparator) > .label-wrapper,
[id$="-menu-opened"] ul > .imMnMnCurrent > .label-wrapper{background:var(--m-navy)!important}

/* Košík v hlavičce */
.cartstatus{font-weight:600!important}
.cartstatus__text,.cartstatus__text--rm{color:var(--m-navy)!important}
.cartstatus__iconwrapper{background:#eef2f8;border-radius:999px;padding:6px}

/* ---------- Obsah ---------- */
#imContent{background:transparent}
.imHeading1,#imContent h1{color:var(--m-navy)!important;font-weight:800!important;letter-spacing:-.02em;line-height:1.2!important}
.imHeading2,#imContent h2{color:var(--m-navy)!important;font-weight:700!important;letter-spacing:-.01em;line-height:1.3!important}
.imHeading3,#imContent h3{color:var(--m-navy)!important;font-weight:700!important}
#imContent .text-inner{line-height:1.7}
#imContent .text-inner a,#imContent a.imCssLink{color:var(--m-blue)!important;text-decoration:none;font-weight:600;transition:color .2s}
#imContent .text-inner a:hover,#imContent a.imCssLink:hover{color:var(--m-accent)!important;text-decoration:underline}
#imContent .text-inner ul{padding-left:1.2em}
#imContent .text-inner li{margin:.25em 0}
#imContent .text-inner li::marker{color:var(--m-accent)}
#imContent hr{border:0!important;height:1px;background:var(--m-line)!important}

/* Buňky obsahu jako karty (jen tam, kde má buňka rámeček) */
[id^="imCellStyleBorders_"]{border-radius:var(--m-radius)!important}
[id^="imCellStyleGraphics_"]{border-radius:var(--m-radius)!important}

/* ---------- Produktové karty (seznam produktů) ---------- */
[id^="imProductList_"] .im-cc-products-card{
  background:var(--m-card)!important;
  border:1px solid var(--m-line)!important;
  border-radius:var(--m-radius)!important;
  box-shadow:var(--m-shadow);
  overflow:hidden;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s;
}
[id^="imProductList_"] .im-cc-products-card:hover{
  transform:translateY(-4px);box-shadow:var(--m-shadow-hover);border-color:#cfd6e4!important;
}
[id^="imProductList_"] .im-cc-products-card img{transition:transform .35s ease}
[id^="imProductList_"] .im-cc-products-card:hover img{transform:scale(1.04)}
[id^="imProductList_"] .im-cc-products-name,
[id^="imProductList_"] .im-cc-products-name *{
  color:var(--m-navy)!important;font-weight:700!important;letter-spacing:-.01em;
}
[id^="imProductList_"] .im-cc-products-availability{
  display:inline-flex!important;align-items:center;gap:6px;
  background:#e8f7ee;color:#137a3a!important;border-radius:999px;
  padding:4px 10px!important;font-size:13px!important;font-weight:600;width:auto!important;
}
[id^="imProductList_"] .im-cc-products-availability *{color:#137a3a!important}
[id^="imProductList_"] .im-cc-products-price,[id^="imProductList_"] [class*="price"]{
  color:var(--m-accent)!important;font-weight:800!important;
}
[id^="imProductList_"] button,[id^="imProductList_"] .im-cc-products-button,
.im-cc-products-button,.cart-button,.imCartButton{
  background:var(--m-accent)!important;border:0!important;color:#fff!important;
  border-radius:999px!important;font-weight:700!important;transition:background .2s,transform .2s;
}
[id^="imProductList_"] button:hover,.im-cc-products-button:hover{background:var(--m-navy)!important}

/* Obecná tlačítka a formuláře X5 */
#imContent input[type=submit],#imContent input[type=button],#imContent button,.imForm input[type=submit]{
  background:var(--m-accent)!important;border:0!important;color:#fff!important;border-radius:999px!important;
  padding:.6em 1.4em!important;font-weight:700!important;cursor:pointer;transition:background .2s;
}
#imContent input[type=submit]:hover,#imContent input[type=button]:hover,#imContent button:hover{background:var(--m-navy)!important}
#imContent input[type=text],#imContent input[type=email],#imContent input[type=tel],#imContent textarea,#imContent select{
  border:1px solid var(--m-line)!important;border-radius:10px!important;padding:.55em .8em!important;background:#fff!important;
  transition:border-color .2s,box-shadow .2s;
}
#imContent input:focus,#imContent textarea:focus,#imContent select:focus{
  outline:none;border-color:var(--m-blue)!important;box-shadow:0 0 0 3px rgba(31,111,235,.15)!important;
}

/* Obrázky – jemné zaoblení */
#imContent .text-inner img,#imContent [id^="imObjectImage_"] img{border-radius:12px}

/* ---------- Patička ---------- */
#imFooter{
  background:var(--m-navy)!important;
  color:#c9d3e3;
}
#imFooter,#imFooter div,#imFooter span,#imFooter a{color:#dfe6f2!important}
#imFooter a{transition:color .2s}
#imFooter a:hover{color:#fff!important;text-decoration:underline}
#imFooter [id^="imFooter_imObjectTitle_"][id$="_text"]{font-weight:600!important;font-size:14px!important;letter-spacing:.02em}
#imFooter b,#imFooter strong{color:#fff!important}

/* ---------- Tlačítko nahoru ---------- */
#imGoToTop,.imGoToTop{border-radius:999px!important;box-shadow:var(--m-shadow-hover)}

/* ---------- Přístupnost ---------- */
a:focus-visible,button:focus-visible,.label-wrapper:focus-visible{outline:3px solid var(--m-blue)!important;outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ---------- Doladění rozvržení ---------- */
/* Hlavička a patička přes celou šířku okna */
/* bílé pozadí hlavičky přes celou šířku okna (výšky odpovídají šabloně X5) */
#imHeaderBg{background:#fff!important;border-bottom:1px solid var(--m-line)}
/* Nižší hlavička – menu posunuté výš, obsah začíná hned pod ním */
@media(min-width:1440px){
  #imPage{grid-template-rows:208px auto 240px!important}
  #imHeaderObjects{height:208px!important}#imHeaderBg{height:208px!important}
  #imHeader_imMenuObject_01_wrapper{top:162px!important}
}
@media(max-width:1439.9px) and (min-width:1152px){
  #imPage{grid-template-rows:196px auto 350px!important}
  #imHeaderObjects{height:196px!important}#imHeaderBg{height:196px!important}
  #imHeader_imMenuObject_25_wrapper{top:140px!important}
}
@media(max-width:1151.9px) and (min-width:720px){#imHeaderBg{height:300px!important}}
@media(max-width:719.9px){
  #imPage{grid-template-rows:340px auto 60px!important}
  #imHeaderObjects{height:340px!important}#imHeaderBg{height:340px!important}
}
#imFooter{clip-path:inset(0 -100vmax);box-shadow:0 0 0 100vmax var(--m-navy)}
/* Texty v hlavičce se nezalamují */
#imHeader [id^="imHeader_imObjectTitle_"][id$="_text"]{white-space:nowrap!important}
#imHeader_imObjectTitle_02_text{font-size:32px!important}
#imHeader_imObjectTitle_03_text,#imHeader_imObjectTitle_04_text,#imHeader_imObjectTitle_05_text{font-size:30px!important}
/* Duplicitní odkaz „2DIN RÁDIO YETI“ v patičce se překrýval s jiným textem */
#imFooter_imObjectTitle_16_wrapper{display:none!important}
#imPage label,#imPage b,#imPage strong,#imPage em,#imPage i,#imPage small,#imPage font,#imPage legend,#imPage dt,#imPage dd{font-family:var(--m-font)!important}
/* Rámečky buněk – místo tmavě hnědé jemná šedá */
[id^="imCellStyleBorders_"]{border-color:var(--m-line)!important}
[id^="imCellStyleGraphics_"]{box-shadow:none}
/* Formuláře (kontakt, dotazy, recenze) */
#imContent input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]),#imContent textarea,#imContent select{
  border:1px solid #cfd6e4!important;border-radius:10px!important;background:#fff!important;box-sizing:border-box;
}
#imContent label{color:var(--m-navy)!important;font-weight:600!important}
#imContent iframe{border-radius:var(--m-radius)}

/* Rozbalovací výběry (varianty produktu apod.) – text se musí vejít do pole */
#imPage select,#imContent select{
  padding-top:0!important;padding-bottom:0!important;padding-left:.8em!important;padding-right:2em!important;
  line-height:1.2!important;min-height:38px;height:auto!important;font-size:14px!important;font-weight:500!important;
  text-overflow:ellipsis;box-sizing:border-box!important;
}

/* SEO úvodní texty a statická verze produktu */
.seo-intro-h1{font-size:28px!important;line-height:1.25!important;margin:10px 0 8px!important;color:var(--m-navy)!important;font-weight:800!important;text-align:center}
.seo-intro{font-size:16px;line-height:1.7;color:var(--m-text);max-width:900px;margin:8px auto 18px!important;padding:0 12px;text-align:center}
.seo-intro a{color:var(--m-blue)!important;font-weight:600}
.product-ssr{grid-column:2/3;grid-row:1/2;box-sizing:border-box;width:100%;display:flex;gap:28px;align-items:flex-start;flex-wrap:wrap;padding:24px 16px;max-width:1100px;margin:0 auto}
.product-ssr img{max-width:100%;height:auto;border-radius:12px}
.product-ssr>div{flex:1 1 320px}
.product-ssr h1{font-size:28px;color:var(--m-navy);margin:0 0 10px;font-weight:800}
.product-ssr__price{font-size:24px;font-weight:800;color:var(--m-accent);margin:0 0 12px}
.product-ssr__price small{font-size:14px;color:var(--m-muted);font-weight:500}
.product-ssr__desc{line-height:1.7;margin-bottom:12px}
.product-ssr a{color:var(--m-blue)!important;font-weight:600;text-decoration:none}
