.dth-cookie-root,
.dth-cookie-root *,
.dth-cookie-floating-button,
.dth-cookie-floating-button * {
   box-sizing: border-box;
   font-family: 'Prompt', sans-serif;
}

.dth-cookie-banner {
   position: fixed;
   z-index: 99998;
   width: min(420px, calc(100vw - 32px));
   padding: 20px;
   color: var(--dth-cookie-text-color, #1f2933);
   background: var(--dth-cookie-background-color, #fff);
   border-radius: var(--dth-cookie-border-radius, 8px);
   box-shadow: 0 12px 32px rgba(15, 23, 42, 0.22);
   font-size: var(--dth-cookie-font-size, 14px);
   line-height: 1.5;
   animation: dth-cookie-fade-in-up 180ms ease-out both;
}

.dth-cookie-banner--bottom-right {
   right: 16px;
   bottom: 16px;
}

.dth-cookie-banner--bottom-left {
   bottom: 16px;
   left: 16px;
}

.dth-cookie-banner--center-modal {
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   animation-name: dth-cookie-fade-in-center;
}

.dth-cookie-banner--bottom-bar {
   right: 0;
   bottom: 0;
   left: 0;
   width: 100%;
   max-width: none;
   border-radius: var(--dth-cookie-border-radius, 8px) var(--dth-cookie-border-radius, 8px) 0 0;
}

.dth-cookie-banner__logo {
   max-width: 120px;
   max-height: 48px;
   margin-bottom: 12px;
}

.dth-cookie-banner .dth-cookie-banner__title,
.dth-cookie-modal .dth-cookie-modal__title {
   margin: 0 0 8px;
   font-size: 18px;
   font-weight: 700;
   line-height: 1.3;
}

.dth-cookie-banner .dth-cookie-banner__message,
.dth-cookie-modal .dth-cookie-modal__message {
   margin: 0 0 16px;
}

.dth-cookie-banner__actions,
.dth-cookie-modal__actions {
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
}

.dth-cookie-button {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   padding: 8px 16px;
   color: #fff;
   font: inherit;
   font-weight: 600;
   line-height: 1.2;
   text-decoration: none;
   cursor: pointer;
   background: var(--dth-cookie-secondary-button-color, #4b5563);
   border: 0;
   border-radius: 6px;
   transition: box-shadow 0.16s ease, transform 0.16s ease, opacity 0.16s ease;
}

.dth-cookie-button:hover,
.dth-cookie-button:focus {
   box-shadow: 0 4px 14px rgba(15, 23, 42, 0.24);
}

.dth-cookie-button:focus {
   outline: 3px solid rgba(37, 99, 235, 0.35);
   outline-offset: 2px;
}

.dth-cookie-button--accept,
.dth-cookie-button--save {
   background: var(--dth-cookie-primary-button-color, #2563eb);
}

.dth-cookie-button--reject,
.dth-cookie-button--settings,
.dth-cookie-button--close,
.dth-cookie-button--shortcode {
   background: var(--dth-cookie-secondary-button-color, #4b5563);
}

.dth-cookie-modal {
   position: fixed;
   inset: 0;
   z-index: 99999;
   display: none;
}

.dth-cookie-modal.is-open {
   display: block;
}

.dth-cookie-modal__overlay {
   position: absolute;
   inset: 0;
   background: rgba(15, 23, 42, 0.55);
   animation: dth-cookie-fade-in 140ms ease-out both;
}

.dth-cookie-modal__content {
   position: relative;
   width: min(640px, calc(100vw - 32px));
   max-height: calc(100vh - 48px);
   padding: 24px;
   margin: 24px auto;
   overflow: auto;
   color: var(--dth-cookie-text-color, #1f2933);
   background: var(--dth-cookie-background-color, #fff);
   border-radius: var(--dth-cookie-border-radius, 8px);
   box-shadow: 0 20px 48px rgba(15, 23, 42, 0.32);
   font-size: var(--dth-cookie-font-size, 14px);
   line-height: 1.5;
   animation: dth-cookie-fade-in-up 180ms ease-out both;
}

.dth-cookie-modal__close {
   position: absolute;
   top: 12px;
   right: 12px;
   width: 36px;
   height: 36px;
   padding: 0;
   color: var(--dth-cookie-text-color, #1f2933);
   background: transparent;
   border: 0;
   border-radius: 50%;
   cursor: pointer;
}

.dth-cookie-modal__close:focus {
   outline: 3px solid rgba(37, 99, 235, 0.35);
}

.dth-cookie-categories {
   display: grid;
   gap: 12px;
   margin: 16px 0;
}

.dth-cookie-category {
   display: grid;
   grid-template-columns: 1fr auto;
   gap: 12px;
   padding: 14px;
   border: 1px solid rgba(75, 85, 99, 0.24);
   border-radius: 8px;
}

.dth-cookie-modal .dth-cookie-category__title {
   margin: 0 0 4px;
   font-size: 15px;
   font-weight: 700;
   line-height: 1.35;
}

.dth-cookie-modal .dth-cookie-category__description {
   margin: 0;
   font-size: var(--dth-cookie-font-size, 14px);
   line-height: 1.5;
   color: #4b5563;
}

.dth-cookie-category__toggle {
   position: relative;
   display: inline-flex;
   align-items: center;
   width: 48px;
   height: 28px;
}

.dth-cookie-category__toggle input {
   position: absolute;
   opacity: 0;
}

.dth-cookie-category__switch {
   width: 48px;
   height: 28px;
   background: #9ca3af;
   border-radius: 999px;
   transition: background 0.16s ease;
}

.dth-cookie-category__switch::after {
   display: block;
   width: 22px;
   height: 22px;
   margin: 3px;
   content: "";
   background: #fff;
   border-radius: 50%;
   transition: transform 0.16s ease;
}

.dth-cookie-category__toggle input:checked + .dth-cookie-category__switch {
   background: var(--dth-cookie-primary-button-color, #2563eb);
}

.dth-cookie-category__toggle input:checked + .dth-cookie-category__switch::after {
   transform: translateX(20px);
}

.dth-cookie-floating-button {
   position: fixed;
   right: 16px;
   bottom: 16px;
   z-index: 99997;
   display: none;
   padding: 8px 14px;
   color: #fff;
   cursor: pointer;
   background: var(--dth-cookie-secondary-button-color, #4b5563);
   border: 0;
   border-radius: 999px;
   box-shadow: 0 8px 24px rgba(15, 23, 42, 0.22);
}

.dth-cookie-floating-button.is-visible {
   display: inline-flex;
   animation: dth-cookie-fade-in-up 180ms ease-out both;
}

.dth-cookie-script-slot {
   display: contents;
}

@keyframes dth-cookie-fade-in {
   from {
      opacity: 0;
   }

   to {
      opacity: 1;
   }
}

@keyframes dth-cookie-fade-in-up {
   from {
      opacity: 0;
      transform: translateY(8px);
   }

   to {
      opacity: 1;
      transform: translateY(0);
   }
}

@keyframes dth-cookie-fade-in-center {
   from {
      opacity: 0;
      transform: translate(-50%, calc(-50% + 8px));
   }

   to {
      opacity: 1;
      transform: translate(-50%, -50%);
   }
}

@media (prefers-reduced-motion: reduce) {
   .dth-cookie-banner,
   .dth-cookie-modal__overlay,
   .dth-cookie-modal__content,
   .dth-cookie-floating-button.is-visible {
      animation: none;
   }
}

@media (max-width: 600px) {
   .dth-cookie-banner {
      right: 8px;
      bottom: 8px;
      left: 8px;
      width: auto;
   }

   .dth-cookie-banner__actions,
   .dth-cookie-modal__actions {
      flex-direction: column;
   }

   .dth-cookie-button {
      width: 100%;
   }
}