/* Cookie consent banner — AGE / EVO kit, v1.0
   Visual copy of the evo.gov.md banner (Figma: Components → Cookie Banner).
   Change the colours in :root-level variables below if your product has another palette. */

.cc-banner {
  --cc-blue: #0058d2;
  --cc-blue-dark: #0047ab;
  --cc-blue-light: #eaf2fd;
  --cc-black: #121212;
  --cc-text: #383838;
  --cc-muted: #757575;
  --cc-line: #d9d9d9;
  --cc-bg-soft: #f5f5f5;
  --cc-bg-chip: #f1f1f1;
  --cc-switch-off: #b2b2b2;
  --cc-white: #fff;
  --cc-font: 'Onest', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;

  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1060;
  width: 792px;
  max-width: calc(100vw - 16px);
  min-width: 280px;
  box-sizing: border-box;
  background: var(--cc-white);
  border: 1.5px solid var(--cc-line);
  border-radius: 16px;
  box-shadow: 0 0 0.5px 0 rgba(0, 0, 0, 0.15), 0 5px 12px 0 rgba(0, 0, 0, 0.08), 0 1px 3px 0 rgba(0, 0, 0, 0.08);
  font-family: var(--cc-font);
  color: var(--cc-black);
  transition: opacity 0.3s ease-out;
}
.cc-banner *, .cc-banner *::before, .cc-banner *::after { box-sizing: border-box; }
.cc-banner[hidden] { display: none !important; }
.cc-banner.cc-fade-out { opacity: 0; pointer-events: none; }

/* Default vs extended state */
.cc-banner:not(.is-extended) .cc-only-extended { display: none !important; }
.cc-banner.is-extended .cc-only-default { display: none !important; }

/* Header */
.cc-banner__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 20px 20px 0 40px; }
.cc-banner__title { margin: 0; font-weight: 600; font-size: 20px; line-height: 28px; letter-spacing: -0.2px; color: var(--cc-black); overflow-wrap: break-word; }
.cc-banner__collapse {
  flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; padding: 8px; border: 0; border-radius: 999px;
  background: var(--cc-bg-chip); color: var(--cc-black); cursor: pointer;
}
.cc-banner__collapse:hover { background: var(--cc-line); }
.cc-banner__collapse:focus-visible { outline: 2px solid var(--cc-blue); outline-offset: 2px; }

/* Content */
.cc-banner__content { display: flex; flex-direction: column; gap: 24px; padding: 8px 40px 0 40px; }
.cc-banner__desc { margin: 0; font-size: 14px; line-height: 20px; color: var(--cc-text); overflow-wrap: break-word; }
.cc-link { color: var(--cc-blue); text-decoration: underline; }

.cc-banner__groups { display: flex; flex-direction: column; background: var(--cc-bg-soft); border-radius: 12px; padding: 8px 20px 12px 20px; }
.cc-group { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 40px; row-gap: 8px; align-items: center; padding: 12px 0; }
.cc-group__titleRow { grid-column: 1; grid-row: 1; display: flex; align-items: center; gap: 16px; }
.cc-group__title { font-size: 18px; line-height: 28px; font-weight: 500; color: var(--cc-black); }
.cc-group__tag {
  display: inline-flex; align-items: center; height: 20px; padding: 0 8px;
  border: 1.5px solid var(--cc-blue); border-radius: 4px;
  font-size: 12px; line-height: 16px; font-weight: 500; color: var(--cc-blue); white-space: nowrap;
}
.cc-group__desc { grid-column: 1; grid-row: 2; margin: 0; font-size: 14px; line-height: 20px; color: var(--cc-muted); overflow-wrap: break-word; }
.cc-group__control { grid-column: 2; grid-row: 1 / span 2; display: flex; align-items: center; justify-content: center; width: 48px; }
.cc-group__check { display: block; }
.cc-banner__separator { margin: 2px 0; border: 0; border-top: 1px solid var(--cc-line); }

/* Switch 48×28 */
.cc-switch { display: inline-flex; cursor: pointer; margin: 0; position: relative; }
.cc-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.cc-switch__track { display: inline-block; width: 48px; height: 28px; border-radius: 999px; background: var(--cc-switch-off); position: relative; transition: background-color 0.2s ease-in-out; }
.cc-switch__thumb {
  position: absolute; top: 50%; left: 2px; transform: translateY(-50%);
  width: 24px; height: 24px; border-radius: 999px; background: var(--cc-white);
  box-shadow: 0 0 0.5px 0 rgba(0, 0, 0, 0.3), 0 1px 3px 0 rgba(0, 0, 0, 0.16);
  transition: left 0.2s ease-in-out;
}
.cc-switch input:checked + .cc-switch__track { background: var(--cc-blue); }
.cc-switch input:checked + .cc-switch__track .cc-switch__thumb { left: 22px; }
.cc-switch input:focus-visible + .cc-switch__track { outline: 2px solid var(--cc-blue); outline-offset: 2px; }

/* Footer */
.cc-banner__footer { padding: 12px 40px 20px 40px; }
.cc-banner__footerDefault { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cc-banner__footerActions { display: flex; align-items: center; gap: 12px; width: 414px; max-width: 100%; }
.cc-banner__footerActions .cc-btn { flex: 1 1 0; }
.cc-banner__footerExtended { display: flex; justify-content: flex-end; }

/* Buttons */
.cc-btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: 40px; min-width: 56px; padding: 0 16px; border-radius: 6px;
  border: 1.5px solid transparent; background: transparent;
  font-family: inherit; font-size: 14px; line-height: 20px; font-weight: 500;
  cursor: pointer; white-space: nowrap;
  transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.2s ease-in-out;
}
.cc-btn:focus-visible { outline: 2px solid var(--cc-blue); outline-offset: 2px; }
.cc-btn--primary { background: var(--cc-blue); color: var(--cc-white); }
.cc-btn--primary:hover { background: var(--cc-blue-dark); }
.cc-btn--outline { border-color: var(--cc-blue); color: var(--cc-blue); background: var(--cc-white); }
.cc-btn--outline:hover { background: var(--cc-blue-light); }
.cc-btn--neutral { border-color: var(--cc-black); color: var(--cc-black); background: var(--cc-white); }
.cc-btn--neutral:hover { background: var(--cc-bg-soft); }
.cc-btn--confirm { width: 201px; }

/* Mobile (Figma: 359 px) */
@media (max-width: 767px) {
  .cc-banner { width: 359px; max-width: calc(100vw - 16px); }
  .cc-banner__header { padding: 24px 12px 0 16px; }
  .cc-banner__title { font-size: 22px; line-height: 30px; letter-spacing: -0.22px; }
  .cc-banner__content { padding: 16px; gap: 20px; max-height: calc(100dvh - 240px); overflow-y: auto; }
  .cc-banner__groups { border-radius: 8px; padding: 16px 20px; gap: 8px; }
  .cc-group { column-gap: 16px; row-gap: 12px; padding: 12px 0; }
  .cc-group__control { grid-row: 1; width: auto; }
  .cc-group__desc { grid-column: 1 / -1; }
  .cc-group__title { flex: 1 1 0; min-width: 0; }
  .cc-group__control--check { display: none; }
  .cc-group__titleRow { justify-content: space-between; }
  .cc-banner__footer { padding: 12px 16px 24px 16px; }
  .cc-banner__footerDefault { flex-direction: column; align-items: stretch; gap: 8px; }
  .cc-banner__footerActions { width: 100%; flex-direction: column; gap: 8px; order: -1; }
  .cc-banner__footerActions .cc-btn { flex: initial; }
  .cc-btn--all { order: -1; }
  .cc-btn { width: 100%; height: 48px; min-width: 72px; padding: 0 20px; border-radius: 8px; font-size: 16px; line-height: 24px; }
  .cc-btn--confirm { width: 100%; }
}