/* ==========================================================================
   CAST Trust — Cookie consent banner styles
   --------------------------------------------------------------------------
   Self-contained, scope-olt CSS. NEM Tailwind utility — szándékosan, hogy a
   banner build-lépés (Tailwind rebuild) nélkül működjön minden oldalon.

   Eredet: a pws/cookie-consent-vanilla Laravel package .cc-* témázási
   mintájából átemelve és a CAST Trust brand-pirosra (#bc1f26) színezve.
   A package-et nem módosítottuk; ez egy önálló, statikus változat.

   Minden szabály a #cc-banner alá van scope-olva, hogy ne ütközzön a site
   többi stílusával. A márkaszín a --cc-brand* változókkal egy helyen állítható.
   ========================================================================== */

#cc-banner {
  --cc-brand:        #bc1f26; /* brand-700 */
  --cc-brand-dark:   #8a161b; /* brand-800 */
  --cc-brand-tint:   #fdf2f3; /* brand-50  */
  --cc-ink-900:      #15151a;
  --cc-ink-700:      #3a3a41;
  --cc-ink-600:      #494951;
  --cc-ink-500:      #5f5f6a;
  --cc-ink-400:      #898993;
  --cc-ink-200:      #d6d6dc;
  --cc-ink-100:      #ededf0;
  --cc-ink-50:       #f7f7f8;

  position: fixed;
  z-index: 60; /* a fixed header (z-50) fölött */
  padding: 1rem;
  box-sizing: border-box;
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  opacity: 0;
  transform: translateY(1rem);
  transition: opacity .3s ease, transform .3s ease;
}

#cc-banner.cc-visible { opacity: 1; transform: translateY(0); }

/* --- Pozíciók --- */
#cc-banner[data-cc-position="bottom"]       { left: 0; right: 0; bottom: 0; }
#cc-banner[data-cc-position="top"]          { left: 0; right: 0; top: 0; transform: translateY(-1rem); }
#cc-banner[data-cc-position="top"].cc-visible { transform: translateY(0); }
#cc-banner[data-cc-position="bottom-left"]  { left: 0; bottom: 0; }
#cc-banner[data-cc-position="bottom-right"] { right: 0; bottom: 0; }

#cc-banner * { box-sizing: border-box; }

/* --- Kártya --- */
.cc-card {
  background: #fff;
  border: 1px solid var(--cc-ink-100);
  border-radius: .75rem;
  box-shadow: 0 10px 30px -5px rgba(21, 21, 26, .18), 0 4px 10px -4px rgba(21, 21, 26, .12);
}
#cc-banner[data-cc-position="bottom"] .cc-card,
#cc-banner[data-cc-position="top"]    .cc-card { max-width: 56rem; margin: 0 auto; }
#cc-banner[data-cc-position="bottom-left"]  .cc-card,
#cc-banner[data-cc-position="bottom-right"] .cc-card { max-width: 28rem; }

.cc-body { padding: 1.5rem; }

.cc-title {
  margin: 0 0 .5rem;
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--cc-ink-900);
}

.cc-text {
  margin: 0 0 1rem;
  font-size: .875rem;
  line-height: 1.55;
  color: var(--cc-ink-600);
}

.cc-link {
  color: var(--cc-brand);
  font-weight: 500;
  text-decoration: none;
}
.cc-link:hover { text-decoration: underline; }

/* --- Gombok --- */
.cc-actions { display: flex; flex-wrap: wrap; gap: .75rem; }

.cc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .55rem 1.1rem;
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.2;
  border-radius: .5rem;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.cc-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--cc-brand-tint);
}

.cc-btn-primary   { background: var(--cc-brand); color: #fff; }
.cc-btn-primary:hover { background: var(--cc-brand-dark); }

.cc-btn-secondary { background: var(--cc-ink-100); color: var(--cc-ink-700); }
.cc-btn-secondary:hover { background: var(--cc-ink-200); }

.cc-btn-outline   { background: #fff; border-color: var(--cc-ink-200); color: var(--cc-ink-700); }
.cc-btn-outline:hover { background: var(--cc-ink-50); border-color: var(--cc-ink-400); }

.cc-btn-block { width: 100%; }

/* --- Részletes beállítások --- */
.cc-details {
  border-top: 1px solid var(--cc-ink-100);
  padding: 1.5rem;
  opacity: 1;
  transition: opacity .2s ease;
}

.cc-cat { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.cc-cat + .cc-cat { margin-top: 1rem; }

.cc-cat-label {
  display: block;
  font-size: .9375rem;
  font-weight: 600;
  color: var(--cc-ink-900);
}
.cc-cat-required {
  margin-left: .35rem;
  font-size: .75rem;
  font-weight: 500;
  color: var(--cc-ink-400);
}
.cc-cat-desc {
  margin: .15rem 0 0;
  font-size: .8125rem;
  line-height: 1.45;
  color: var(--cc-ink-500);
}

.cc-save { margin-top: 1.5rem; }

/* --- Toggle kapcsoló --- */
.cc-toggle {
  position: relative;
  flex-shrink: 0;
  width: 2.75rem;
  height: 1.5rem;
  border-radius: 9999px;
  border: 2px solid transparent;
  background: var(--cc-ink-200);
  cursor: pointer;
  transition: background-color .2s ease;
}
.cc-toggle:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--cc-brand);
}
.cc-toggle.cc-toggle-active { background: var(--cc-brand); }
.cc-toggle[disabled] { opacity: .5; cursor: not-allowed; }

.cc-toggle-knob {
  position: absolute;
  top: 0;
  left: 0;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 9999px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
  transition: transform .2s ease;
  transform: translateX(0);
}
.cc-toggle.cc-toggle-active .cc-toggle-knob { transform: translateX(1.25rem); }

@media (max-width: 480px) {
  .cc-btn { flex: 1 1 auto; }
}
