/* Generated by style_settings for entity horecatree */
/* Public theme: every look-and-feel value comes from a CSS variable.
   Defaults are defined here; per-entity overrides live in style_<entity>.css (variables only). */
:root {
  --site-bg-color: #ededed;
  --site-text-color: #212529;
  --site-link-color: #b51a00;
  --site-link-hover-color: #8b4513;
  --site-heading-color: #212529;
  --site-nav-link-color: #61177c;
  --site-nav-link-hover-color: #8b4513;
  --site-navbar-position: sticky;
  --site-logo-position: fixed;
  --site-navbar-bg-opacity: 100;
  --site-navbar-border-opacity: 0;
  --site-logo-width: 100px;
  --site-logo-height: 50px;
  --site-logo-bg: #ffffff;
  --site-logo-bg-opacity: 30;
  --site-navbar-bg: #ffffff;
  --site-navbar-text: #212529;
  --site-navbar-border: #dee2e6;
  --site-button-bg: #ffc107;
  --site-button-text: #444444;
  --site-button-hover-bg: #ffca2c;
  --site-card-bg: #ffffff;
  --site-card-border: #dee2e6;
  --site-font-family: Georgia, serif;
  --site-font-size: 16px;
  --site-container-padding: 12px;
  --site-navbar-padding: 8px;
  --site-button-padding-y: 6px;
  --site-button-padding-x: 12px;
  --site-card-padding: 16px;
  --site-border-radius: 8px;
  --site-product-desc-height: 200px;
}

/* css.css sets font-family/size on every element with `*`; make elements inherit from body again */
* {
  font-family: inherit;
  font-size: inherit;
}
body {
  background-color: var(--site-bg-color);
  color: var(--site-text-color);
  font-family: var(--site-font-family);
  font-size: var(--site-font-size);
}
h1, h2, h3, h4, h5, h6 { color: var(--site-heading-color); }
a { color: var(--site-link-color); }
a:hover { color: var(--site-link-hover-color); }
a.linku_produktit { color: var(--site-text-color); }
a.linku_produktit:hover { color: var(--site-link-hover-color); }
.container { padding-left: var(--site-container-padding); padding-right: var(--site-container-padding); }
.site-navbar {
  position: var(--site-navbar-position);
  top: 0;
  z-index: 1020;
  background-color: color-mix(in srgb, var(--site-navbar-bg) calc(var(--site-navbar-bg-opacity) * 1%), transparent) !important;
  color: var(--site-navbar-text);
  border-color: color-mix(in srgb, var(--site-navbar-border) calc(var(--site-navbar-border-opacity) * 1%), transparent) !important;
  padding-top: var(--site-navbar-padding) !important;
  padding-bottom: var(--site-navbar-padding) !important;
}
.nav-link, .nav-link.active { color: var(--site-nav-link-color); }
.nav-link:hover, .nav-link:focus, .nav-link.active:hover { color: var(--site-nav-link-hover-color); }
.site-navbar .nav-link, .site-navbar .navbar-brand { color: var(--site-navbar-text); }
.site-navbar .nav-link:hover { color: var(--site-nav-link-hover-color); }
.btn-warning, .btn-primary {
  background-color: var(--site-button-bg);
  border-color: var(--site-button-bg);
  color: var(--site-button-text);
  padding: var(--site-button-padding-y) var(--site-button-padding-x);
  border-radius: var(--site-border-radius);
}
.btn-warning:hover, .btn-primary:hover {
  background-color: var(--site-button-hover-bg);
  border-color: var(--site-button-hover-bg);
  color: var(--site-button-text);
}
.card { background-color: var(--site-card-bg); border-color: var(--site-card-border); border-radius: var(--site-border-radius); }
.card-body { padding: var(--site-card-padding); }
.product-description { max-height: var(--site-product-desc-height, 400px); overflow-y: auto; }
.product img { border-radius: var(--site-border-radius); }
.site-logo {
  position: var(--site-logo-position);
  top: 8px;
  left: 8px;
  z-index: 1030;
  background-color: color-mix(in srgb, var(--site-logo-bg) calc(var(--site-logo-bg-opacity) * 1%), transparent);
  border-radius: var(--site-border-radius);
}
.site-logo-img {
  width: var(--site-logo-width);
  max-width: 100%;
  height: var(--site-logo-height);
  object-fit: contain;
}
