#cookie-banner,
.cookie-settings-panel {
  color: var(--lnd-color-text);
  font-family: var(--lnd-font-sans);
}

#cookie-banner {
  position: fixed;
  bottom: 2rem;
  left: 2rem;
  z-index: 9999;
  width: clamp(17.5rem, 90vw, 26.25rem);
  padding: var(--lnd-space-5);
  border: 0.0625rem solid var(--lnd-border-strong);
  border-radius: var(--lnd-radius-card);
  background: var(--lnd-color-surface-elevated);
  box-shadow: 0 1.5rem 4rem rgba(2, 4, 7, 0.42), var(--lnd-shadow-featured);
  backdrop-filter: blur(1rem);
  opacity: 0;
  pointer-events: none;
  transform: translateY(0.5rem);
  transition: opacity var(--lnd-duration-fast) var(--lnd-ease-standard),
    transform var(--lnd-duration-fast) var(--lnd-ease-standard);
}

#cookie-banner.is-visible,
html:not(.js-ready) #cookie-banner {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}





html:not(.js-ready) .cookie-details-arrow {
  display: none;
}

.cookie-banner-title {
  display: flex;
  align-items: center;
  gap: var(--lnd-space-2);
  margin: 0 0 var(--lnd-space-3);
  color: var(--lnd-color-heading);
  font-size: 0.875rem;
  font-weight: 700;
}

.cookie-banner-text {
  margin: 0 0 var(--lnd-space-3);
  color: var(--lnd-color-text-muted);
  font-size: 0.875rem;
  line-height: 1.55;
}

.cookie-banner-links,
.cookie-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--lnd-space-2);
}

.cookie-banner-links {
  margin-bottom: var(--lnd-space-4);
  gap: var(--lnd-space-4);
}

.cookie-banner-links a,
.cookie-detail-list a {
  color: var(--lnd-color-accent-text);
  font-size: 0.75rem;
  text-decoration: underline;
  text-underline-offset: 0.125rem;
}

.cookie-buttons .btn-cookie,
#cookie-banner-save {
  min-height: 2.25rem;
  padding: var(--lnd-space-2) var(--lnd-space-4);
  border: 0.0625rem solid var(--lnd-border-default);
  border-radius: var(--lnd-radius-pill);
  background: var(--lnd-color-control);
  color: var(--lnd-color-heading);
  font-size: 0.75rem;
  font-weight: 600;
  transition: border-color var(--lnd-duration-fast) var(--lnd-ease-standard),
    background-color var(--lnd-duration-fast) var(--lnd-ease-standard);
}

.cookie-buttons .btn-cookie:hover,
#cookie-banner-save:hover {
  border-color: var(--lnd-border-strong);
  background: var(--lnd-color-overlay-subtle);
}




.cookie-banner-details-toggle {
  display: contents;
}

.btn-details {
  cursor: pointer;
  list-style: none;
}

.btn-details::-webkit-details-marker {
  display: none;
}




.cookie-banner-details-body {
  width: 100%;
  margin-top: var(--lnd-space-4);
  padding-top: var(--lnd-space-4);
  border-top: 0.0625rem solid var(--lnd-border-default);
}

.cookie-details-arrow,
.details-arrow,
.toggle-icon {
  display: inline-block;
  transition: transform var(--lnd-duration-fast) var(--lnd-ease-standard);
}

#cookie-banner-details[open] .cookie-details-arrow,
.cookie-tech-toggle[aria-expanded="true"] .details-arrow {
  transform: rotate(180deg);
}

.cookie-categories {
  display: flex;
  flex-direction: column;
  gap: var(--lnd-space-2);
  margin-bottom: var(--lnd-space-4);
}

.cookie-category-label {
  display: flex;
  align-items: center;
  gap: var(--lnd-space-3);
  color: var(--lnd-color-text);
  font-size: 0.875rem;
  cursor: pointer;
}

.cookie-category-label input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  accent-color: var(--lnd-color-primary);
}

.cookie-category-label input[type="checkbox"]:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.cookie-always-active {
  margin-left: auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--lnd-color-text-subtle);
  font-size: 0.75rem;
  font-weight: 600;
}

.cookie-tech-toggle,
.cookie-settings-close,
.cookie-settings-trigger {
  border: 0;
  background: transparent;
  color: var(--lnd-color-text-muted);
}

.cookie-tech-toggle {
  display: flex;
  align-items: center;
  gap: var(--lnd-space-1);
  margin-bottom: var(--lnd-space-3);
  padding: 0;
  font-size: 0.75rem;
}

.cookie-tech-toggle:hover,
.cookie-settings-close:hover,
.cookie-settings-trigger:hover {
  color: var(--lnd-color-heading);
}

.cookie-table-wrap {
  overflow-x: auto;
  margin-bottom: var(--lnd-space-4);
}

.cookie-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--lnd-color-text-muted);
  font-size: 0.75rem;
}

.cookie-table th,
.cookie-table td {
  padding: var(--lnd-space-2) var(--lnd-space-3);
  border-bottom: 0.0625rem solid var(--lnd-border-default);
  text-align: left;
  vertical-align: top;
}

.cookie-table th {
  color: var(--lnd-color-text-subtle);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.accordion-toggle:hover td {
  color: var(--lnd-color-heading);
}

.accordion-toggle[aria-expanded="true"] .toggle-icon {
  transform: rotate(45deg);
}

.accordion-content {
  display: none;
}

.accordion-content.is-open {
  display: table-row;
}

.accordion-body {
  padding: var(--lnd-space-3);
  border-radius: var(--lnd-radius-control);
  background: var(--lnd-color-surface);
}

.cookie-detail-list {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--lnd-space-1) var(--lnd-space-4);
  font-size: 0.75rem;
}

.cookie-detail-list dt {
  color: var(--lnd-color-text-subtle);
  font-weight: 600;
  white-space: nowrap;
}

.cookie-detail-list dd {
  margin: 0;
  color: var(--lnd-color-text-muted);
}

#cookie-settings-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--lnd-space-4);
  background: rgba(2, 4, 7, 0.72);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--lnd-duration-fast) var(--lnd-ease-standard);
}

#cookie-settings-overlay.is-open,
#cookie-settings-overlay:target {
  opacity: 1;
  pointer-events: auto;
}

.cookie-settings-panel {
  width: 100%;
  max-width: 35rem;
  max-height: 90vh;
  overflow-y: auto;
  padding: var(--lnd-space-6);
  border: 0.0625rem solid var(--lnd-border-strong);
  border-radius: var(--lnd-radius-card);
  background: var(--lnd-color-surface-elevated);
  box-shadow: 0 2rem 5rem rgba(2, 4, 7, 0.5), var(--lnd-shadow-featured);
}

.cookie-settings-header,
.cookie-settings-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.cookie-settings-header {
  margin-bottom: var(--lnd-space-4);
}

.cookie-settings-close {
  display: flex;
  padding: var(--lnd-space-1);
  border-radius: var(--lnd-radius-control);
}

.cookie-settings-footer {
  justify-content: flex-end;
  gap: var(--lnd-space-3);
  margin-top: var(--lnd-space-5);
  padding-top: var(--lnd-space-4);
  border-top: 0.0625rem solid var(--lnd-border-default);
}

.cookie-settings-footer .btn-ghost,
.cookie-settings-footer .btn-primary {
  min-height: 2.25rem;
  padding: var(--lnd-space-2) var(--lnd-space-4);
  border: 0.0625rem solid var(--lnd-border-default);
  border-radius: var(--lnd-radius-pill);
  font-size: 0.75rem;
  font-weight: 600;
}

.cookie-settings-footer .btn-ghost {
  background: transparent;
  color: var(--lnd-color-text-muted);
}

.cookie-settings-footer .btn-primary {
  background: var(--lnd-color-primary);
  color: var(--lnd-color-on-primary);
}

.cookie-settings-trigger {
  display: inline-flex;
  align-items: center;
  gap: var(--lnd-space-2);
  padding: 0;
  font-size: 0.75rem;
  transition: color var(--lnd-duration-fast) var(--lnd-ease-standard);
}

@media (max-width: 40rem) {
  #cookie-banner {
    right: 1rem;
    bottom: 1rem;
    left: 1rem;
    width: auto;
  }

  .cookie-buttons .btn-cookie {
    flex: 1 1 100%;
  }

  .cookie-detail-list {
    grid-template-columns: 1fr;
  }
}