/* pizzakrabica-style.css */

/* --- Definícia farebnej palety a fontov --- */
:root {
  --pizza-primary: #D75A4A; /* Hlavná farba z loga (tehlovo-oranžová) */
  --pizza-light: #FDF6E8;  /* Svetlá farba z loga (krémová/biela) */
  --pizza-dark: #333333;   /* Tmavá farba pre text */
  --pizza-secondary: #EFEBE5; /* Veľmi svetlá sivá/béžová pre pozadia */
  --font-sans: 'Open Sans', sans-serif; /* Príklad čistého fontu */
  --font-headings: 'Roboto Slab', serif; /* Príklad fontu pre nadpisy (import potrebný) */
}

/* Import fontov (ak používate Google Fonts) - pridajte do <head> alebo na začiatok CSS */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&family=Roboto+Slab:wght@400;700&display=swap');

/* --- Základné štýly --- */
body {
  font-family: var(--font-sans);
  color: var(--pizza-dark);
  background-color: #ffffff; /* Čisté biele pozadie */
  /* Prípadne jemné pozadie: background-color: var(--pizza-secondary); */
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-headings);
  color: var(--pizza-primary); /* Hlavná farba pre nadpisy */
  font-weight: 700;
}

h1 { font-size: 2.5rem; margin-bottom: 1rem;}
h2 { font-size: 2rem; margin-bottom: 1rem; margin-top: 2rem; }
h3 { font-size: 1.75rem; margin-bottom: 0.8rem; margin-top: 1.5rem;}
h4 { font-size: 1.25rem; }

a {
  color: var(--pizza-primary);
}

a:hover {
  color: darken(var(--pizza-primary), 10%);
}

/* --- Hlavička (Navbar) --- */
.navbar.bg-light {
  background-color: var(--pizza-light) !important; /* Svetlá farba z loga */
}

.navbar-brand img {
  /* Prípadné úpravy veľkosti loga */
}

.navbar .nav-link {
  color: var(--pizza-dark);
  font-weight: 700;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
  color: var(--pizza-primary);
}

/* --- Hero sekcia --- */
#hero-section img {
  border: 5px solid var(--pizza-light); /* Jemný rámik */
}

/* --- Karty kategórií --- */
#category-cards .card {
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  border: 1px solid #ddd;
}

#category-cards .card:hover {
  transform: translateY(-5px);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1) !important;
}

.category-card-img {
  height: 180px; /* Upravte podľa potreby */
  object-fit: cover; /* Zabezpečí pekné orezanie obrázkov */
}

#category-cards .card-title {
  color: var(--pizza-dark); /* Tmavší nadpis na karte */
}

/* --- Tlačidlá --- */
.btn-primary {
  background-color: var(--pizza-primary);
  border-color: var(--pizza-primary);
  color: var(--pizza-light);
  font-weight: bold;
  padding: 0.6rem 1.2rem;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.btn-primary:hover {
  background-color: darken(var(--pizza-primary), 10%);
  border-color: darken(var(--pizza-primary), 10%);
  color: var(--pizza-light);
}

.btn-secondary {
  background-color: var(--pizza-dark);
  border-color: var(--pizza-dark);
  color: #ffffff;
}
.btn-secondary:hover {
  background-color: lighten(var(--pizza-dark), 15%);
  border-color: lighten(var(--pizza-dark), 15%);
   color: #ffffff;
}

/* --- Obsahová sekcia --- */
#homepage-content ul,
#vyhody ul {
  list-style: none;
  padding-left: 0;
}

#homepage-content ul li,
#vyhody ul li {
  padding-left: 1.5em;
  position: relative;
  margin-bottom: 0.5em;
}

#homepage-content ul li::before,
#vyhody ul li::before {
  content: '\F26E'; /* Bootstrap Ikona (napr. pizza) - upravte podľa želania */
  font-family: 'bootstrap-icons';
  position: absolute;
  left: 0;
  color: var(--pizza-primary);
  font-weight: bold;
}

/* --- FAQ Accordion --- */
.accordion-button {
 font-family: var(--font-headings);
 font-weight: 700;
 font-size: 1.1rem;
 color: var(--pizza-dark);
}

.accordion-button:not(.collapsed) {
  color: var(--pizza-light);
  background-color: var(--pizza-primary);
}

.accordion-button:focus {
  box-shadow: 0 0 0 0.25rem rgba(215, 90, 74, 0.25); /* Tieň vo farbe primary */
}

.accordion-button::after {
 /* Prípadná úprava šípky */
}

/* --- Sidebar --- */
.sidebar .card {
  margin-bottom: 1.5rem;
}

.sidebar-toc .list-group-item {
  border: none;
  padding: 0.5rem 1rem;
  font-size: 0.9rem;
}

.sidebar-toc .list-group-item.active {
  color: var(--pizza-primary);
  font-weight: bold;
  background-color: transparent;
}

.sidebar-toc .list-group-item:hover {
  background-color: var(--pizza-secondary);
  color: var(--pizza-primary);
}
.sidebar-toc .list-group-item.ps-4 { /* Odsadenie podpoložiek */
   padding-left: 2.5rem !important;
}

.sidebar-categories .list-group-item.active,
.sidebar-categories a.active { /* Pridané pre kategórie */
  color: var(--pizza-primary);
  font-weight: bold;
  background-color: var(--pizza-secondary);
}

.sidebar-categories a:hover {
    background-color: var(--pizza-secondary);
    color: var(--pizza-primary);
}

.consultation-cta .btn-secondary {
    background-color: var(--pizza-dark);
    border-color: var(--pizza-dark);
}

.consultation-cta .btn-secondary:hover {
     background-color: lighten(var(--pizza-dark), 15%);
     border-color: lighten(var(--pizza-dark), 15%);
}

/* --- Pätička --- */
.footer.bg-dark {
  background-color: var(--pizza-dark) !important;
}

.footer a.text-white-50:hover {
    color: var(--pizza-light) !important;
}

/* --- Utility --- */
.category-card-img {
    border-bottom: 1px solid #eee;
}

/* --- Responzivita (Príklad) --- */
@media (max-width: 991.98px) {
    .sidebar {
        margin-top: 2rem;
    }
}