/* effects.css – Kliska Parkettboden
   Nur leichte Effekte. Kein Theme, keine Layout-Regeln, keine Bootstrap-Overrides. */

.card-hover {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card-hover:hover,
.card-hover:focus-within {
  transform: translateY(-4px);
  box-shadow: var(--bs-box-shadow);
}

.image-zoom {
  overflow: hidden;
}

.image-zoom img {
  transition: transform 0.35s ease;
}

.image-zoom:hover img {
  transform: scale(1.03);
}

.icon-link-hover {
  transition: opacity 0.15s ease;
}

.icon-link-hover:hover {
  opacity: 0.8;
}

/* Link-Lesbarkeit: das custom Bootstrap (#F6C12D giallo) hat zu wenig Kontrast
   auf weissem Hintergrund. Nur inhaltliche Links im <main> dunkler färben,
   nicht Buttons, Nav, Dropdown, Cards oder Footer. */
main a:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand):not(.card):not([role="tab"]):not(.accordion-button) {
  color: var(--bs-dark);
  text-decoration: underline;
}
main a:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand):not(.card):not([role="tab"]):not(.accordion-button):hover {
  color: var(--bs-primary);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}

.step-heading-focus:focus {
  outline: 2px solid var(--bs-primary, #F6C12D);
  outline-offset: 6px;
  border-radius: 4px;
}

/* Accessibility: darken review text for contrast */
.blockquote-footer,
.blockquote-footer small { color: #5a5a5a !important; }

/* Footer-Einsatzgebiete: echte responsive Spalten.
   Das custom Bootstrap-Build enthaelt keine row-cols-2/row-cols-md-4/row-cols-lg-6,
   daher CSS-Grid statt der wirkungslosen row-cols-Utilities. */
.footer-districts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1rem;
  row-gap: 0.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 768px) {
  .footer-districts {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .footer-districts {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

/* Accessibility: underline links in cookie banner */
#cookieBanner a { text-decoration: underline; }



/* Accessibility: improve focus visibility for keyboard navigation */
:focus-visible {
  outline: 3px solid #1C1915 !important;
  outline-offset: 3px !important;
  border-radius: 2px;
}
.btn:focus-visible, a:focus-visible, button:focus-visible, 
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid #1C1915 !important;
  outline-offset: 2px !important;
}

/* Accessibility: improve focus ring on dark backgrounds */
.bg-dark :focus-visible,
.bg-dark .btn:focus-visible,
.bg-dark a:focus-visible {
  outline-color: #F6C12D !important;
}

/* Accessibility: Bootstrap text-secondary (#6c757d) fails contrast on white.
   Replace with accessible colors. */
.text-secondary { color: #4A4A4A !important; }
.small.text-secondary, .card-text.small, p.small.text-secondary,
.form-text, .text-body-secondary, .text-muted { color: #424242 !important; }

/* ktable: Bootstrap grid as table replacement (no <table> markup on public pages) */
.ktable {
  margin-bottom: 1.5rem;
  max-width: 100%;
}
.ktable-row {
  margin-left: 0;
  margin-right: 0;
  border-bottom: 1px solid #dee2e6;
  padding: .4rem 0;
}
.ktable-row:first-child {
  border-top: 1px solid #dee2e6;
}
.ktable-head {
  border-bottom: 2px solid #adb5bd;
  background-color: #f4f4f4;
}
.ktable-head .ktable-cell {
  font-weight: 600;
}
.ktable-cell {
  padding: .35rem .75rem;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.ktable-row:nth-child(even):not(.ktable-head) {
  background-color: #fafafa;
}
@media (max-width: 767.98px) {
  .ktable-cell {
    padding: .3rem .5rem;
  }
}
/* Grid helpers used by .ktable cells (scoped; some col-md-* widths are
   missing from the custom Bootstrap build used by this project) */
@media (min-width: 768px) {
  .ktable .col-md-2 { flex: 0 0 auto; width: 16.66666667%; }
  .ktable .col-md-3 { flex: 0 0 auto; width: 25%; }
  .ktable .col-md-4 { flex: 0 0 auto; width: 33.33333333%; }
  .ktable .col-md-6 { flex: 0 0 auto; width: 50%; }
}

/* Grid: add missing col-8 and col-4 (custom Bootstrap build only has col-12/col-6) */
.col-8 { flex: 0 0 auto; width: 66.66666667%; }
.col-4 { flex: 0 0 auto; width: 33.33333333%; }

/* Accessibility: underline links in cookie banner */
#cookieBanner a { text-decoration: underline; }
