/**
 * DTEC Delivery Design Tokens
 *
 * Aubergine + lime palette — GP global color variables as primary source.
 * All variables prefixed --dtec-* to avoid collisions with the theme.
 */

:root {
  /* --- Raw palette fallbacks (for contexts where GP globals aren't available) --- */
  --dtec-aubergine-100: #E9E0E4;
  --dtec-aubergine-500: #8F385D;
  --dtec-aubergine-600: #6C2C47;

  --dtec-lime-500: #A0BA18;
  --dtec-lime-600: #8FA516;

  --dtec-off-white-100: #F1EFF5;
  --dtec-text-muted-75: rgba(46, 40, 38, 0.75);

  --dtec-neutral-50:  #fafafa;
  --dtec-neutral-100: #f5f5f5;
  --dtec-neutral-200: #e5e5e5;
  --dtec-neutral-300: #d4d4d4;
  --dtec-neutral-400: #a3a3a3;
  --dtec-neutral-500: #737373;
  --dtec-neutral-600: #525252;
  --dtec-neutral-700: #404040;
  --dtec-neutral-800: #262626;
  --dtec-neutral-900: #171717;

  --dtec-white: #ffffff;
  --dtec-black: #0a0a0a;

  --dtec-error:        #ef4444;
  --dtec-error-light:  #fef2f2;
  --dtec-error-border: #fecaca;
  --dtec-warning:      #f59e0b;
  --dtec-success:      #22c55e;
  --dtec-info:         #3b82f6;

  /* --- Semantic aliases — GP globals as primary, raw fallbacks as backup --- */
  --dtec-primary:       var(--global-color-aubergine-gleam-500, var(--dtec-aubergine-500));
  --dtec-primary-dark:  var(--global-color-aubergine-gleam-600, var(--dtec-aubergine-600));
  --dtec-primary-light: var(--global-color-aubergine-gleam-100, var(--dtec-aubergine-100));
  --dtec-primary-ring:  rgba(143, 56, 93, 0.2);

  --dtec-cta:           var(--global-color-lime-500, var(--dtec-lime-500));
  --dtec-cta-hover:     var(--global-color-lime-600, var(--dtec-lime-600));

  --dtec-text:          var(--global-color-dark, #2E2826);
  --dtec-text-muted:    var(--global-color-medium-gray, var(--dtec-neutral-500));
  --medium-gray---paragraph: rgba(46, 40, 38, 0.75);
  --dtec-bg:            var(--global-color-white, var(--dtec-white));
  --dtec-bg-subtle:     var(--global-color-seashell, #FFF3F0);
  --dtec-bg-section:    var(--global-color-cream, #FDF8F4);
  --dtec-border:        var(--global-color-aubergine-gleam-100, var(--dtec-aubergine-100));

  /* --- Typography --- */
  --dtec-font-family: var(--font-body, var(--font-nunito, 'Nunito', sans-serif));
  --dtec-font-mono:   ui-monospace, 'Cascadia Code', 'Fira Code', monospace;

  --dtec-leading-tight:   1.25;
  --dtec-leading-normal:  1.5;
  --dtec-leading-relaxed: 1.625;

  --dtec-font-normal:    400;
  --dtec-font-medium:    500;
  --dtec-font-semibold:  600;
  --dtec-font-bold:      700;
  --dtec-font-extrabold: 800;

  /* --- Border radius --- */
  --dtec-radius-sm:   0.25rem;  /* 4px */
  --dtec-radius-md:   0.5rem;   /* 8px */
  --dtec-radius-lg:   0.75rem;  /* 12px */
  --dtec-radius-xl:   1rem;     /* 16px */
  --dtec-radius-full: 9999px;
  --dtec-radius-2xl:  1.5rem;    /* 24px */
  --dtec-radius-3xl:  1.875rem;  /* 30px */

  --dtec-border-200:  rgba(46, 40, 38, 0.15);
  --dtec-shadow-card: 0 0 40px rgba(161, 161, 161, 0.25);

  /* --- Shadows --- */
  --dtec-shadow-sm:  0 1px 2px rgba(0, 0, 0, 0.05);
  --dtec-shadow-md:  0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  --dtec-shadow-lg:  0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04);
  --dtec-shadow-xl:  0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05);

  /* --- Transitions --- */
  --dtec-duration-fast:   150ms;
  --dtec-duration-normal: 250ms;
  --dtec-duration-slow:   400ms;
  --dtec-ease-default:    cubic-bezier(0.4, 0, 0.2, 1);
  --dtec-ease-in:         cubic-bezier(0.4, 0, 1, 1);
  --dtec-ease-out:        cubic-bezier(0, 0, 0.2, 1);

  /* --- Z-index scale --- */
  --dtec-z-dropdown:  100;
  --dtec-z-sticky:    200;
  --dtec-z-modal:     300;
  --dtec-z-toast:     400;

  /* --- Layout --- */
  --dtec-max-width-sm:      640px;
  --dtec-max-width-md:      768px;
  --dtec-max-width-lg:      1024px;
  --dtec-max-width-xl:      1700px;
  --dtec-max-width-content: 960px;
}

/* Reviews badge — used by [dtec_reviews] shortcode */
.dtec-reviews-badge {
  --dtec-reviews-text-color: var(--dark-gray, #2E2826);
  --dtec-reviews-star-color: #FFAE00;
  display: inline-flex;
  align-items: center;
  gap: var(--space-3xs, 6px);
}
.dtec-reviews-badge__stars {
  display: inline-flex;
  gap: 3px;
  align-items: center;
  color: var(--dtec-reviews-star-color);
}
.dtec-reviews-badge__stars svg {
  display: block;
  flex-shrink: 0;
}
.dtec-reviews-badge__text {
  font-weight: 700;
  font-size: var(--text-m, 16px);
  color: var(--dtec-reviews-text-color);
  white-space: nowrap;
}
.dtec-reviews-badge--light {
  --dtec-reviews-text-color: var(--white, #FFF);
  --dtec-reviews-star-color: #FFE26E;
  filter: drop-shadow(0 2px 0 rgba(0, 0, 0, 0.25));
}

/* Charities list — used by [dtec_charities] shortcode */
.dtec-charities {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-top: 20px;
}
.dtec-charities__item {
  display: flex;
  align-items: center;
  gap: 20px;
}
.dtec-charities__logo {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.dtec-charities__logo--placeholder {
  display: block;
  background: var(--aubergine-gleam-100, #E9E0E4);
}
.dtec-charities__text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.dtec-charities__name {
  font-size: 16px;
  font-weight: 600;
  color: var(--dark-gray, #2E2826);
  margin: 0;
}
.dtec-charities__desc {
  font-size: 14px;
  line-height: 1.6;
  color: rgba(46, 40, 38, 0.75);
  margin: 0;
}

/* Delivery pages use Instrument Sans instead of theme default (Nunito) */
body.dtec-delivery {
  --heading-1-family: var(--font-heading, var(--font-instrument-sans-variable, "instrument-sans-variable", sans-serif));
  --heading-2-family: var(--font-heading, var(--font-instrument-sans-variable, "instrument-sans-variable", sans-serif));
  --heading-3-family: var(--font-heading, var(--font-instrument-sans-variable, "instrument-sans-variable", sans-serif));
  --heading-4-family: var(--font-heading, var(--font-instrument-sans-variable, "instrument-sans-variable", sans-serif));
  --heading-5-family: var(--font-heading, var(--font-instrument-sans-variable, "instrument-sans-variable", sans-serif));
  --heading-6-family: var(--font-heading, var(--font-instrument-sans-variable, "instrument-sans-variable", sans-serif));
  --body-family: var(--font-heading, var(--font-instrument-sans-variable, "instrument-sans-variable", sans-serif));
  --small-family: var(--font-heading, var(--font-instrument-sans-variable, "instrument-sans-variable", sans-serif));
  --dtec-font-family: var(--font-heading, var(--font-instrument-sans-variable, "instrument-sans-variable", sans-serif));
}