/* ==========================================================================
   md-theme.css  –  Môj Dodávateľ, vizuálny update celého webu
   --------------------------------------------------------------------------
   Načítava sa ako POSLEDNÝ štýl v layout.latte (za style.css a style2.css).
   Nemení HTML ani JS – iba prepisuje vzhľad existujúcich tried, aby sa web
   priblížil novému návrhu (svetlé plochy, tenké linky, oblé tlačidlá).

   Obsah:
     1.  Farby a premenné
     2.  Základ (písmo, nadpisy, kontajner)
     3.  Tlačidlá
     4.  Formuláre
     5.  Horný pás (topmenu)
     6.  Hlavička (logo, vyhľadávanie, ikony)
     7.  Menu kategórií + rozbaľovacie menu
     8.  Fixná hlavička pri scrollovaní
     9.  Vyhľadávanie – našepkávač
    10.  Produktová karta (výpisy)
    11.  Stránka kategórie
    12.  Detail produktu
    13.  Bočný košík + košík
    14.  Kontakt, stránky, blog, katalógy
    15.  Zákaznícka zóna (profil, zoznamy, adresy)
    16.  Modály, offcanvas, cookies
    17.  Pätička
    18.  Mobil
   ========================================================================== */


/* ---------- 1. Farby a premenné ------------------------------------------ */
:root {
  --md-brand:      #109AA6;
  --md-brand-600:  #0E8A95;
  --md-brand-800:  #075A63;
  --md-brand-900:  #06474F;
  --md-brand-soft: #E8F5F6;

  --md-accent:     #F5A623;
  --md-accent-600: #E2940F;
  --md-accent-ink: #2A1C00;   /* text na oranžovom tlačidle */

  --md-hot:        #FF4537;

  --md-ink:        #272223;
  --md-ink-70:     #57514F;
  --md-muted:      #6E6869;
  --md-line:       #E6E3E3;
  --md-line-soft:  #F0EEEE;
  --md-bg-soft:    #F7F6F6;

  --md-radius:     10px;
  --md-radius-lg:  14px;
  --md-shadow-sm:  0 1px 2px rgba(39, 34, 35, .05);
  --md-shadow-md:  0 6px 24px rgba(39, 34, 35, .08);
  --md-shadow-lg:  0 14px 44px rgba(39, 34, 35, .12);
  --md-ease:       cubic-bezier(.22, .61, .36, 1);
}


/* ---------- 2. Základ ---------------------------------------------------- */
body {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--md-ink);
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--md-brand-600);
}

a:hover {
  color: var(--md-brand-800);
}

.text-primary {
  color: var(--md-brand) !important;
}

.badge-primary {
  background-color: var(--md-brand);
}

/* Kontajner – na veľkých monitoroch užší a s väčším odsadením od okraja,
   aby obsah nepôsobil „od kraja po kraj" (pôvodne až 1800px). */
@media (min-width: 992px) {
  .container {
    padding-left: 32px;
    padding-right: 32px;
  }
}

@media (min-width: 1400px) {
  .container {
    padding-left: 48px;
    padding-right: 48px;
  }
}

@media (min-width: 1600px) {
  .container {
    max-width: 1560px;
  }
}

/* veľké monitory – stránka sa roztiahne širšie (ako pôvodný web) */
@media (min-width: 1900px) {
  .container {
    max-width: 1800px;
  }

  .mainmenu .search-input {
    max-width: 820px;
  }
}

/* Hlavné nadpisy podstránok (kategória, košík, kontakt, blog...) */
.category h1,
.basket h1,
.contact h1,
.page h1,
.katalogy h1,
.profilenav h1 {
  font-weight: 700;
  letter-spacing: -.015em;
  color: var(--md-ink);
}

.category h1,
.basket h1,
.contact h1 {
  font-size: 32px;
}


/* ---------- 3. Tlačidlá -------------------------------------------------- */
.btn {
  font-family: inherit;
  transition: background-color .18s var(--md-ease), border-color .18s var(--md-ease),
              color .18s var(--md-ease), box-shadow .18s var(--md-ease);
}

/* oranžové (hlavná akcia) */
.btn-warning {
  background-color: var(--md-accent);
  border-color: var(--md-accent);
  color: var(--md-accent-ink);
  font-size: 14px;
  font-weight: 700;
  padding: 9px 24px;
  border-radius: 999px;
}

.btn-warning:hover,
.btn-warning:focus {
  background-color: var(--md-accent-600);
  border-color: var(--md-accent-600);
  color: var(--md-accent-ink);
  box-shadow: 0 8px 20px rgba(245, 166, 35, .32);
}

/* tyrkysové */
.btn-primary {
  background-color: var(--md-brand);
  border-color: var(--md-brand);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  padding: 9px 24px;
  border-radius: 999px;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--md-brand-600);
  border-color: var(--md-brand-600);
  color: #fff;
  box-shadow: 0 8px 20px rgba(16, 154, 166, .3);
}

.btn-sm {
  font-size: 13px;
  padding: 6px 16px;
}

.btn-outline-secondary {
  border: 1.5px solid var(--md-line);
  color: var(--md-ink);
  border-radius: 999px;
  font-weight: 600;
}

.btn-outline-secondary:hover {
  background-color: #fff;
  border-color: var(--md-brand);
  color: var(--md-brand);
}

/* ikona košíka v oranžovom tlačidle – tmavá, ladí s tmavým textom */
.item-product .add-basket img,
.item-product .add-basket2 img,
.product .add-basket img,
.product .add-basket2 img {
  filter: none;
}


/* ---------- 4. Formuláre ------------------------------------------------- */
.form-control {
  border: 1px solid var(--md-line);
  border-radius: 8px;
  color: var(--md-ink);
  transition: border-color .18s var(--md-ease), box-shadow .18s var(--md-ease), background-color .18s var(--md-ease);
}

.form-control:focus {
  border-color: var(--md-brand);
  box-shadow: 0 0 0 3px rgba(16, 154, 166, .12);
}

.custom-radio .custom-control-input:checked ~ .custom-control-label::before,
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--md-brand);
}

input[type="radio"]:checked + .custom-control-label {
  color: var(--md-brand-800);
}

/* Kontaktný formulár (homepage aj stránka Kontakt) – ľahká biela karta */
.home-contact form,
.mdh-form {
  background-color: #fff;
  border: 1px solid var(--md-line);
  border-radius: var(--md-radius-lg);
  padding: 32px;
}

.home-contact form label,
.mdh-form label {
  font-size: 12px;
  font-weight: 600;
  color: var(--md-muted);
  margin-bottom: 5px;
}

.home-contact form .form-control,
.mdh-form .form-control {
  height: 44px;
  border: 1px solid var(--md-line);
  border-radius: 8px;
  background-color: var(--md-bg-soft);
  font-size: 14px;
}

.home-contact form textarea.form-control,
.mdh-form textarea.form-control {
  height: auto;
  min-height: 96px;
}

.home-contact form .form-control:hover,
.mdh-form .form-control:hover {
  background-color: #fff;
}

.home-contact form .form-control:focus,
.mdh-form .form-control:focus {
  background-color: #fff;
  border-color: var(--md-brand);
  box-shadow: 0 0 0 3px rgba(16, 154, 166, .12);
}

.home-contact .form-group,
.mdh-form .form-group {
  margin-bottom: 14px;
}

.home-contact .custom-control-label,
.mdh-form .custom-control-label {
  font-size: 13px;
  color: var(--md-muted);
  font-weight: 500;
}

.home-contact .custom-control-label::before,
.mdh-form .custom-control-label::before {
  background-color: #fff;
  border: 1px solid var(--md-line);
}


/* ---------- 5. Horný pás (topmenu) --------------------------------------- */
.topmenu {
  height: auto;
  background-color: var(--md-bg-soft);
  border-bottom: 1px solid var(--md-line-soft);
}

.topmenu > .container {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.topmenu ul li {
  padding: 0 22px 0 0;
  line-height: 40px;
}

.topmenu ul.float-right li {
  padding: 0 0 0 22px;
}

.topmenu ul li a {
  font-weight: 500;
  font-size: 13px;
  color: var(--md-ink-70);
}

.topmenu ul li a:hover,
.topmenu ul li.active a {
  color: var(--md-brand);
  opacity: 1;
}


/* ---------- 6. Hlavička -------------------------------------------------- */
@media (min-width: 993px) {

  .mainmenu {
    margin-bottom: 0;
    background-color: #fff;
    border-bottom: 1px solid var(--md-line-soft);
  }

  .mainmenu nav {
    height: 78px;
  }

  .mainmenu .brand img {
    height: 44px;
  }

  /* vyhľadávanie – oblé pole s tyrkysovým tlačidlom */
  .mainmenu .search-input {
    max-width: 680px;
    padding: 0 40px;
  }

  .mainmenu .search-input input {
    height: 46px;
    padding: 0 52px 0 20px;
    background-color: #fff;
    border: 1.5px solid var(--md-line);
    border-radius: 999px;
    font-size: 15px;
    color: var(--md-ink);
    transition: border-color .18s var(--md-ease), box-shadow .18s var(--md-ease);
  }

  .mainmenu .search-input input::placeholder {
    color: #9B9698;
  }

  .mainmenu .search-input input:focus {
    border: 1.5px solid var(--md-brand);
    box-shadow: 0 0 0 4px rgba(16, 154, 166, .12);
  }

  .mainmenu .search-input .searchicon {
    position: absolute;
    right: 45px;
    top: 5px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--md-brand);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .mainmenu .search-input .searchicon img {
    position: static;
    height: 16px;
    filter: brightness(0) invert(1);
  }

  /* ikony vpravo: Zoznamy, Prihlásenie, Košík – vždy zarovnané k pravému okraju
     (.navbar-expand-lg má justify-content: flex-start, preto margin-left: auto) */
  .mainmenu nav > .d-flex:last-child {
    margin-left: auto;
  }

  /* ikony vpravo: Zoznamy, Prihlásenie, Košík */
  .mainmenu .nav-link {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--md-ink-70) !important;
    padding: 0 12px;
  }

  .mainmenu .nav-link:hover {
    color: var(--md-brand) !important;
  }

  .mainmenu .nav-link img {
    height: 18px;
    top: 0;
    margin-right: 7px;
  }

  .mainmenu .nav-link img.red {
    filter: none;
  }

  /* košík ako tmavá „pilulka" */
  .mainmenu .nav-link-basket {
    height: 42px;
    margin-left: 8px;
    padding: 0 18px;
    border-radius: 999px;
    background-color: var(--md-ink);
    color: #fff !important;
  }

  .mainmenu .nav-link-basket:hover {
    background-color: var(--md-brand);
    color: #fff !important;
  }

  .mainmenu .nav-link-basket img {
    filter: brightness(0) invert(1);
  }

  /* počítadlá (košík, zoznamy) */
  .mainmenu .nav-link .nav-count {
    top: -8px;
    left: 22px;
    min-width: 19px;
    height: 19px;
    line-height: 19px;
    font-weight: 700;
    box-shadow: 0 0 0 2px #fff;
  }

  .mainmenu .nav-link-basket .nav-count {
    top: -6px;
    left: 28px;
    background-color: var(--md-accent);
    color: var(--md-accent-ink);
  }
}


/* ---------- 7. Menu kategórií -------------------------------------------- */
.categorymenu {
  background-color: var(--md-brand);
}

@media (min-width: 993px) {

  .categorymenu .cat-link,
  .categorymenu .cat-link:first-of-type {
    display: inline-flex;
    align-items: center;
    height: 48px;
    padding: 0 18px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    transition: background-color .18s var(--md-ease);
  }

  .categorymenu ul.mb-0 > li:first-child > .cat-link {
    margin-left: -18px;
  }

  .categorymenu .cat-link:hover,
  .categorymenu .dropdown:hover > .cat-link {
    background-color: rgba(255, 255, 255, .14);
    color: #fff;
  }

  .categorymenu .cat-link .fa {
    float: none;
    position: static;
    margin-left: 7px;
    font-size: 10px;
    opacity: .75;
  }

  /* veľké rozbaľovacie menu */
  .categorymenu .dropdown-menu {
    top: 48px;
    margin: 0;
    padding: 28px 0 20px;
    border: 0;
    border-top: 1px solid var(--md-line-soft);
    border-radius: 0 0 var(--md-radius-lg) var(--md-radius-lg);
    box-shadow: var(--md-shadow-lg);
  }

  .categorymenu .dropdown-menu strong {
    font-size: 15px;
    font-weight: 700;
    color: var(--md-ink);
  }

  .categorymenu .dropdown-menu a:hover strong {
    color: var(--md-brand-800);
  }

  .categorymenu .dropdown-menu .cat-circle {
    border-radius: var(--md-radius);
    background-color: var(--md-bg-soft);
  }

  .categorymenu .sub2 a {
    background-color: var(--md-bg-soft);
    border: 1px solid var(--md-line-soft);
    border-radius: 999px;
    padding: 4px 11px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--md-ink-70);
    transition: border-color .18s var(--md-ease), color .18s var(--md-ease);
  }

  .categorymenu .sub2 a:hover {
    opacity: 1;
    border-color: var(--md-brand);
    color: var(--md-brand-800);
  }
}


/* ---------- 8. Fixná hlavička pri scrollovaní ---------------------------- */
/* Výška hlavičky sa zmenila (40 + 78 + 1 + 48 px), preto treba upraviť
   odsadenie obsahu, aby stránka pri prepnutí na fixnú hlavičku „neskočila". */
@media (min-width: 993px) {
  .fixed-header main {
    padding-top: 167px;
  }

  .fixed-header header {
    box-shadow: 0 4px 18px rgba(39, 34, 35, .10);
  }

  .fixed-header .basket-hover {
    top: 72px;
  }
}


/* ---------- 9. Našepkávač vyhľadávania ----------------------------------- */
@media (min-width: 993px) {
  .autocomplete-modal {
    top: 118px;
    border-top: 1px solid var(--md-line);
    box-shadow: var(--md-shadow-lg);
  }

  .hasalarm .autocomplete-modal {
    top: 150px;
  }
}

.allresults {
  background-color: var(--md-bg-soft);
}

.allresults a:hover {
  color: var(--md-brand) !important;
}


/* ---------- 10. Produktová karta ----------------------------------------- */
.item-product {
  border: 1px solid var(--md-line);
  border-radius: var(--md-radius-lg);
  transition: border-color .18s var(--md-ease), box-shadow .18s var(--md-ease);
}

/* Pozor: karta nesmie mať background ani transform – tyrkysové pozadie
   počítadla kusov (.product-count-set-bg, z-index:-1) by zmizlo
   a popup so zoznamami by sa schoval pod susedné karty. */
.item-product:hover {
  border-color: #CDE9EC;
  box-shadow: var(--md-shadow-md);
}

.item-product.inbasket {
  border: 1px solid var(--md-brand);
  box-shadow: 0 0 0 1px var(--md-brand);
}

.item-product .title,
.item-product .title a {
  font-size: 14.5px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--md-ink);
}

.item-product select,
.item-product select:focus {
  border: 1px solid var(--md-line);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--md-ink);
  background-color: var(--md-bg-soft);
}

.item-product select:focus {
  border-color: var(--md-brand);
}

.item-product .package-info,
.item-product .dph {
  color: var(--md-muted);
  font-size: 12.5px;
  font-weight: 500;
}

.item-product .instock,
.item-product .outstock {
  font-size: 13px;
  color: #3E8E1F;
}

.item-product .instockext {
  font-size: 13px;
  color: var(--md-brand-600);
}

.item-product .price {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.015em;
  color: var(--md-ink);
}

.item-product .list-button {
  top: 16px;
  right: 16px;
  font-size: 1.25rem;
}

.toggle-list,
.product .toggle-list {
  color: var(--md-brand);
}

/* štítky (akcia, novinka, bestseller) */
.ico_actions span {
  border-radius: 0;
  border-top-left-radius: var(--md-radius-lg);
  border-bottom-right-radius: var(--md-radius);
  font-size: 11px;
  letter-spacing: .03em;
}

.ico_actions .sale {
  background-color: var(--md-brand);
}

.ico_actions .bestseller {
  background-color: var(--md-hot);
}

/* počítadlo kusov po pridaní do košíka */
.product-count-set-bg,
.product-count-set input,
.basket-count-set-bg,
.basket-count-set input {
  background-color: var(--md-brand);
}

.in-basket {
  border-bottom-left-radius: var(--md-radius-lg);
  border-bottom-right-radius: var(--md-radius-lg);
}


/* ---------- 11. Stránka kategórie ---------------------------------------- */
.breadcrumbs nav > ul > li,
.breadcrumbs nav > ul > li > a {
  color: var(--md-muted);
  font-size: 13px;
  font-weight: 500;
}

.breadcrumbs nav > ul > li > a:hover {
  color: var(--md-brand);
}

.breadcrumbs nav > ul > li > a::after {
  content: "/";
  color: #C4BFC0;
  padding: 0 4px 0 8px;
}

/* podkategórie */
.tags-list .tag-item {
  background-color: #fff;
  border: 1px solid var(--md-line);
  border-radius: var(--md-radius);
  transition: border-color .18s var(--md-ease), box-shadow .18s var(--md-ease);
}

.tags-list .tag-item:hover {
  border-color: var(--md-brand);
  box-shadow: var(--md-shadow-md);
}

.tags-list .tag-item a {
  font-weight: 700;
  font-size: 13.5px;
  color: var(--md-ink);
}

.tags-list .tag-item .tag-img {
  background-color: var(--md-bg-soft);
  border-radius: 8px;
  overflow: hidden;
}

.tags-list .tag-item img {
  border-radius: 8px;
}

/* banner „Nenašli ste, čo ste hľadali?" */
.placeholder {
  border-radius: var(--md-radius-lg);
  position: relative;
  overflow: hidden;
}

.placeholder h3 {
  font-weight: 700;
  letter-spacing: -.015em;
}

/* stránkovanie */
.page-number a,
.page-next a,
.page-prev a {
  border-radius: 50%;
  color: var(--md-ink);
}

.page-number a:hover {
  background-color: var(--md-brand-soft);
}

.page-number a.active {
  background-color: var(--md-brand);
  color: #fff;
}


/* ---------- 12. Detail produktu ------------------------------------------ */
.product .content {
  background-color: var(--md-bg-soft);
  border: 1px solid var(--md-line-soft);
  border-bottom: 0;
  border-radius: var(--md-radius-lg) var(--md-radius-lg) 0 0;
}

.product h1 {
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -.01em;
}

.product .bg {
  background-color: #fff;
  border: 1px solid var(--md-line);
  border-radius: 0 0 var(--md-radius-lg) var(--md-radius-lg);
}

.product select,
.product select:focus {
  border: 1px solid var(--md-line);
  border-radius: 8px;
}

.product .price {
  font-weight: 800;
  letter-spacing: -.015em;
}

.parameters .nav-link {
  color: var(--md-brand-600);
}

.parameters .nav li a.active {
  border-bottom-color: var(--md-brand);
  color: var(--md-ink);
}


/* ---------- 13. Bočný košík + košík -------------------------------------- */
.basket-hover {
  background-color: var(--md-bg-soft);
  border: 1px solid var(--md-line-soft);
  border-radius: var(--md-radius-lg);
}

.basket-hover .freeshipping {
  background-color: var(--md-brand);
  border-top-left-radius: var(--md-radius-lg);
  border-top-right-radius: var(--md-radius-lg);
}

.gotoorder,
.gotoorder:hover {
  background-color: var(--md-brand-800);
  border-bottom-left-radius: var(--md-radius-lg);
  border-bottom-right-radius: var(--md-radius-lg);
}

.gotoorder:hover {
  background-color: var(--md-brand-900);
}

.minicart .item {
  border: 1px solid var(--md-line-soft);
  border-radius: var(--md-radius);
}

.minicart .price,
.minicart .fa {
  color: var(--md-accent-600);
}

.basket h3 {
  font-size: 17px;
  letter-spacing: -.01em;
}

.basket-row .basket-inc,
.basket-row .basket-dec,
.basket-row .list-inc,
.basket-row .list-dec {
  color: var(--md-accent);
}

.basket-row .fa-bigger {
  color: var(--md-brand);
}

.basket-right .total p {
  border-top: 1px solid var(--md-line);
}

.alert-basket {
  border-radius: var(--md-radius-lg);
}

.alert-basket.alert-success {
  border: 1px solid #BFE3C6;
}

.alert-basket.alert-warning {
  border: 1px solid #FBD58A;
}

.basket-stock-box {
  background-color: #F4FAFB;
  border: 1px solid #CDE9EC;
  border-radius: var(--md-radius-lg);
}

.basket-stock-box .basket-box-title {
  color: var(--md-brand-800);
  border-radius: 999px;
  box-shadow: var(--md-shadow-md);
}

.basket-external-box {
  border: 1px solid #FFC9C4;
  border-radius: var(--md-radius-lg);
}

.basket-external-box .basket-box-title {
  border-radius: 999px;
  box-shadow: var(--md-shadow-md);
}

/* výber adresy, firmy a delenia objednávky */
.delivery-address,
.company-address,
.split-box {
  background-color: var(--md-bg-soft);
  border: 1px solid var(--md-line-soft);
  border-radius: var(--md-radius);
}

.delivery-address.main,
.company-address.main,
.split-box.main {
  background-color: var(--md-brand-soft);
  border: 1px solid var(--md-brand);
}

.insert-user-address span,
.insert-user-company span,
.card-add-list span,
.list-tab-add span {
  background-color: var(--md-brand-soft);
}


/* ---------- 14. Kontakt, stránky, blog, katalógy ------------------------- */
.card-contact {
  background: linear-gradient(135deg, #17B0BD 0%, var(--md-brand) 55%, var(--md-brand-800) 100%);
  border-radius: var(--md-radius-lg);
  padding: 28px;
}

.card-contact h3 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 12px;
}

.card-contact2 {
  background: var(--md-brand-soft);
  color: var(--md-ink);
}

.card-contact2 a {
  color: var(--md-ink);
}

.card-contact3 {
  background: var(--md-bg-soft);
  border: 1px solid var(--md-line-soft);
  color: var(--md-ink);
}

.card-contact3 a {
  color: var(--md-brand-600);
}

.home-contact h3 {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -.015em;
}

.home-contact p {
  color: var(--md-ink-70);
}

/* textové stránky (VOP, reklamácie, ...) */
.page-box {
  box-shadow: none;
  border: 1px solid var(--md-line);
  border-radius: var(--md-radius-lg);
}

.page-box h1 {
  font-size: 28px;
  margin-bottom: 20px;
}

/* blog – výpis */
.news-item {
  border: 1px solid var(--md-line);
  border-radius: var(--md-radius);
  background-color: #fff;
  transition: border-color .18s var(--md-ease), box-shadow .18s var(--md-ease), transform .18s var(--md-ease);
}

.news-item:hover {
  opacity: 1;
  border-color: #CDE9EC;
  box-shadow: var(--md-shadow-md);
  transform: translateY(-3px);
}

.news-item > a > img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.news-item .badge {
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.news-desc {
  background-color: #fff;
  padding: 20px;
}

.news-desc strong {
  display: block;
  margin-bottom: 8px;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -.01em;
  color: var(--md-ink);
}

.news-item:hover .news-desc strong {
  color: var(--md-brand-800);
}

.news-desc p {
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--md-muted);
  margin-bottom: 0;
}

/* blog – detail článku */
.article .bg {
  box-shadow: none;
  border: 1px solid var(--md-line);
  border-radius: var(--md-radius-lg);
}

.article h1 {
  color: var(--md-ink);
  letter-spacing: -.015em;
}

/* katalógy */
.card-katalog {
  border-radius: var(--md-radius-lg);
}


/* ---------- 15. Zákaznícka zóna ------------------------------------------ */
.profilenav ul,
.profilenav ul li,
.profilenav h1,
.profilenav form.filter,
.btn-box {
  border-color: var(--md-line-soft);
}

.profilenav ul li a:hover,
.offcanvas-body ul li a:hover {
  opacity: 1;
  color: var(--md-brand);
}

.profilenav ul li a.active,
.offcanvas-body ul li a.active {
  color: var(--md-brand-800);
  font-weight: 700;
}

.profile-table {
  box-shadow: none;
  border: 1px solid var(--md-line);
  border-radius: var(--md-radius-lg);
}

#form-register {
  box-shadow: none;
  border: 1px solid var(--md-line);
  border-radius: var(--md-radius-lg);
}

#form-register .form-control,
.profilenav form .form-control {
  background-color: var(--md-bg-soft);
  border: 1px solid var(--md-line);
}

.card-edit-list {
  border-color: var(--md-line);
  border-radius: var(--md-radius-lg);
  transition: border-color .18s var(--md-ease), box-shadow .18s var(--md-ease);
}

.card-edit-list:hover {
  border-color: var(--md-brand);
  box-shadow: var(--md-shadow-md);
}

.card-add-list {
  border-radius: var(--md-radius-lg);
  background-color: var(--md-bg-soft);
}

.list-filter-item {
  background-color: var(--md-bg-soft);
  border-radius: 999px;
  padding: 9px 15px;
}

.list-filter-item.active {
  background-color: var(--md-brand);
  color: #fff;
}

.list-detail {
  border-color: var(--md-line);
  border-radius: var(--md-radius-lg);
  border-top-left-radius: 0;
}

.list-tab {
  border-color: var(--md-line);
  border-top-left-radius: var(--md-radius);
  border-top-right-radius: var(--md-radius);
}


/* ---------- 16. Modály, offcanvas, cookies ------------------------------- */
.modal-content {
  border-radius: var(--md-radius-lg);
  box-shadow: var(--md-shadow-lg);
}

.modal-body h2 {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.01em;
}

.offcanvas-body h4 {
  font-weight: 700;
  letter-spacing: -.01em;
}

.offcanvas-body ul li {
  border-top-color: var(--md-line-soft);
}

.offcanvas-body ul li a .fas {
  color: var(--md-brand);
  margin-right: 6px;
}

.header_register {
  background-color: var(--md-bg-soft);
  border-top: 1px solid var(--md-line-soft);
}

#cookies {
  border-radius: var(--md-radius-lg);
  box-shadow: var(--md-shadow-lg);
  overflow: hidden;
}

.label-default {
  background-color: var(--md-brand);
}

.cd-top {
  background-color: var(--md-brand-600) !important;
  border-radius: 8px 0 0 8px;
}

.cd-top:hover {
  background-color: var(--md-brand) !important;
}

.swiper-pagination .swiper-pagination-bullet-active {
  background-color: var(--md-accent);
}


/* ---------- 17. Pätička -------------------------------------------------- */
footer {
  background-color: var(--md-brand);
  padding: 64px 0 48px;
}

footer .footer-headline {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  color: rgba(255, 255, 255, .85);
  margin: 20px 0 16px;
  max-width: 34ch;
}

footer h5 {
  margin: 4px 0 20px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .7);
}

footer ul li {
  font-size: 14px;
  line-height: 1.55;
  margin-bottom: 9px;
}

footer ul li a {
  color: rgba(255, 255, 255, .92);
}

footer ul li a:hover {
  color: #fff;
  text-decoration: underline;
}

.copyright {
  background-color: var(--md-brand);
  border-top: 1px solid rgba(255, 255, 255, .18);
  color: rgba(255, 255, 255, .75);
  font-size: 13px;
}


/* ---------- 18. Mobil ---------------------------------------------------- */
@media (max-width: 992px) {

  .mainmenu {
    background-color: var(--md-brand);
  }

  .mobile-search #search-head {
    background-color: var(--md-bg-soft);
    border: 1px solid var(--md-line);
    border-radius: 999px;
    padding: 10px 16px;
  }

  .mobile-search .searchicon {
    top: 21px;
    right: 7%;
  }

  .category h1,
  .basket h1,
  .contact h1 {
    font-size: 22px;
  }

  .home-contact form,
  .mdh-form {
    padding: 24px 18px;
  }

  footer {
    padding: 40px 15px 24px;
  }
}