/* =====================================================================
   E-shop katalog – vzhled nad motivem Olivero
   ---------------------------------------------------------------------
   BARVY: měň jen v tomto bloku. Zbytek souboru je používá přes var(…).
   Po změně: drush cr  a v prohlížeči Ctrl+Shift+R
   ===================================================================== */
:root {
  /* hlavní barva katalogu */
  --ek-hlavni:          #1f5f99;  /* tlačítko Hledat, rámeček dlaždice/štítku pod myší */
  --ek-hlavni-tmava:    #174a78;  /* tlačítko Hledat pod myší */
  --ek-hlavni-svetla:   #eef4fa;  /* pozadí dlaždice a štítku pod myší */
  --ek-text-tlacitka:   #ffffff;  /* písmo na tlačítku Hledat */

  /* text */
  --ek-text:            #1f2933;  /* názvy hlavních kategorií na dlaždicích */
  --ek-text-sedy:       #6b7480;  /* „Kód: …“ a „/ ks vč. DPH“ u produktu */
  --ek-text-info:       #555555;  /* hlášky „Nic jsme nenašli…“, „Zadejte aspoň 2 znaky“ */
  --ek-oddelovac:       #888888;  /* šipka › v drobečkové navigaci */

  /* rámečky */
  --ek-ramecek-pole:    #b8bec7;  /* rámeček vyhledávacího pole */
  --ek-ramecek-dlazdice:#dde1e6;  /* rámeček dlaždic hlavních kategorií */
  --ek-ramecek-stitku:  #c9d3de;  /* rámeček štítků podkategorií */
  --ek-ramecek-karty:   #e1e5ea;  /* rámeček karet produktů */

  /* pozadí */
  --ek-pozadi-dlazdice: #fafbfc;  /* pozadí dlaždic hlavních kategorií */
  --ek-pozadi-karty:    #ffffff;  /* pozadí karet produktů */
  --ek-pozadi-bezfoto:  #f2f4f6;  /* šedé pole „bez fotky“ */
  --ek-text-bezfoto:    #8a939c;  /* text „bez fotky“ */
}

/* ---------- vyhledávání ---------- */
.ek-search { display: flex; gap: .5rem; margin: 0 0 1.5rem; max-width: 40rem; }
.ek-search input[type="search"] {
  flex: 1; padding: .6rem .8rem; font-size: 1rem;
  border: 1px solid var(--ek-ramecek-pole); border-radius: 6px;
}
.ek-search button {
  padding: .6rem 1.2rem; font-size: 1rem; cursor: pointer;
  border: 0; border-radius: 6px;
  background: var(--ek-hlavni); color: var(--ek-text-tlacitka);
}
.ek-search button:hover { background: var(--ek-hlavni-tmava); }

/* ---------- drobečková navigace ---------- */
ul.ek-crumbs { list-style: none; padding: 0; margin: 0 0 1rem; display: flex; flex-wrap: wrap; font-size: 1rem; }
ul.ek-crumbs li + li::before { content: "›"; margin: 0 .45rem; color: var(--ek-oddelovac); }

/* ---------- hlavní kategorie – dlaždice ---------- */
ul.ek-tiles {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: .75rem;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
}
ul.ek-tiles li a {
  display: block; height: 100%; padding: 1rem 1.1rem;
  border: 1px solid var(--ek-ramecek-dlazdice); border-radius: 8px;
  background: var(--ek-pozadi-dlazdice);
  text-decoration: none; font-weight: 600; color: var(--ek-text);
}
ul.ek-tiles li a:hover { border-color: var(--ek-hlavni); background: var(--ek-hlavni-svetla); }

/* ---------- podkategorie – štítky ---------- */
ul.ek-subcats { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-wrap: wrap; gap: .4rem; }
ul.ek-subcats li a {
  display: inline-block; padding: .35rem .75rem; font-size: 1rem;
  border: 1px solid var(--ek-ramecek-stitku); border-radius: 999px; text-decoration: none;
}
ul.ek-subcats li a:hover { background: var(--ek-hlavni-svetla); border-color: var(--ek-hlavni); }

/* ---------- mřížka produktů ---------- */
.ek-grid {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(3, 1fr);   /* 3 produkty vedle sebe */
  margin-bottom: 1.5rem;
}
@media (max-width: 40rem) { .ek-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 25rem) { .ek-grid { grid-template-columns: 1fr; } }
.ek-card {
  display: flex; flex-direction: column; gap: .35rem;
  padding: .8rem; border: 1px solid var(--ek-ramecek-karty); border-radius: 8px;
  background: var(--ek-pozadi-karty);
}
.ek-card img { display: block; width: 100%; height: 160px; object-fit: contain; }
.ek-noimg {
  display: flex; align-items: center; justify-content: center;
  height: 160px; background: var(--ek-pozadi-bezfoto); color: var(--ek-text-bezfoto);
  font-size: 1rem; border-radius: 4px;
}
.ek-title { font-size: 1rem; line-height: 1.3; margin: .2rem 0 0; }
.ek-title a { text-decoration: none; }           /* barva = odkazy Oliveru (Base Primary Color) */
.ek-sku { font-size: 1rem; color: var(--ek-text-sedy); }
.ek-price { font-size: 1.125rem; font-weight: 700; margin-top: auto; }   /* barva = běžný text */
.ek-price .field, .ek-price .field__item { display: inline; }
.ek-mj { font-size: 1rem; font-weight: 400; color: var(--ek-text-sedy); }
.ek-card form { margin: .3rem 0 0; }
.ek-card form .form-item { margin: 0 0 .3rem; }
.ek-card form input[type="number"] { width: 5rem; }
.ek-h { font-size: 1.125rem; margin: 0 0 1rem; }
.ek-info { color: var(--ek-text-info); }

/* ===== Košík na řádek s drobečky ===== */
.region--breadcrumb {
  position: relative;
}
.region--breadcrumb .block-commerce-cart {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
}

/* větší mezery mezi kartami – první karta zůstává vlevo, 2. a 3. jdou doprava */
.ek-grid {
  gap: 2rem;
}

/* ---------- rámeček karet produktů (upravujte jen tady) ---------- */
:root {
  --ek-ramecek-karty-barva: #04193a;  /*b2b2b2*/
  --ek-ramecek-karty-sirka: 4px;
}
.ek-card {
  border-width: var(--ek-ramecek-karty-sirka);
  border-color: var(--ek-ramecek-karty-barva);
}

/* ---------- rámeček tlačítka "Vložit do košíku" (upravujte jen tady, nezávisle na kartách) ---------- */
:root {
  --ek-ramecek-kosik-barva: #04193a;
  --ek-ramecek-kosik-sirka: 4px;
}
.ek-card .form-submit,
.ek-card button[type="submit"],
.ek-card input[type="submit"] {
  border-style: solid;
  border-width: var(--ek-ramecek-kosik-sirka);
  border-color: var(--ek-ramecek-kosik-barva);
}


/* ---------- pozadí a písmo tlačítka "Vložit do košíku" (upravujte jen tady) ---------- */
:root {
  --ek-kosik-pozadi:        #ffffff;  /* pozadí tlačítka */
  --ek-kosik-text:          #2b2b2b;  /* písmo tlačítka */
  --ek-kosik-pozadi-mys:    #eef1f4;  /* pozadí pod myší */
  --ek-kosik-text-mys:      #000000;  /* písmo pod myší */
}
.ek-card input.form-submit {
  background-color: var(--ek-kosik-pozadi) !important;
  color: var(--ek-kosik-text) !important;
}
.ek-card input.form-submit:hover,
.ek-card input.form-submit:focus {
  background-color: var(--ek-kosik-pozadi-mys) !important;
  color: var(--ek-kosik-text-mys) !important;
}
/* Košík vždy u spodního okraje karty */
.ek-card {
  display: flex;
  flex-direction: column;
}
.ek-card > .field--name-variations {
  margin-top: auto;
}
@media (forced-colors: active) {
  .ek-card {
    border: 1px solid CanvasText;   /* rámeček karty i bez stínů */
  }
  .ek-card form .form-submit,
  .ek-card form input[type="number"] {
    border-color: ButtonBorder !important;
  }
}
:root {
  --ek-ramecek-zpravy-barva: #10c110;  /* barva rámečku zprávy */
  --ek-ramecek-zpravy-sirka: 4px;      /* tloušťka rámečku zprávy */
}
.region-content .messages {
  box-sizing: border-box;
  max-width: calc(3 * var(--ek-karta-max-sirka) + 2 * var(--ek-karta-mezera));
  margin: 1rem auto !important;
  position: relative;
  left: calc(-1 * var(--ek-karty-posun));
  border: var(--ek-ramecek-zpravy-sirka) solid var(--ek-ramecek-zpravy-barva) !important;
}
