/* Sweet Shop After Hours — World Tokens
   A confectionery dreamscape: warm caramel, dark chocolate, rose cream, gold foil.
   Tokens live on html[data-world="sweet-shop-after-hours"] so they scope cleanly. */

@media screen {
  /* ── Dark mode (after hours) ── */
  html[data-world="sweet-shop-after-hours"][data-mode="dark"] {
    /* Core surfaces */
    --world-background: #1a1410 !important;           /* dark chocolate */
    --world-deep: #2d2018 !important;                 /* deep cocoa */
    --world-surface: #3d2d22 !important;              /* milk chocolate */
    --world-elevated: #4a382a !important;             /* lighter chocolate */

    /* Text hierarchy */
    --world-text: #fdf6ee !important;                 /* warm cream */
    --world-secondary: #d4b89c !important;            /* caramel */
    --world-muted: #a68a72 !important;                /* toasted almond */
    --world-faint: #856d58 !important;                /* cinnamon dust */

    /* Accents — the sweet spots */
    --world-accent: #e8c56d !important;               /* gold foil */
    --world-accent-hover: #f0d494 !important;         /* bright gold */
    --world-accent-secondary: #d47a8a !important;     /* rose cream */
    --world-accent-tertiary: #c9a86c !important;      /* antique gold */

    /* Borders & highlights */
    --world-border: #5d4432 !important;               /* chocolate edge */
    --world-border-soft: #4a3628 !important;          /* soft chocolate */
    --world-border-strong: #8b6f52 !important;        /* caramel highlight */
    --world-highlight: #fff8e7 !important;            /* sugar sparkle */
    --world-highlight-soft: #f5e6c8 !important;       /* warm glaze */

    /* Semantic */
    --world-danger: #c45a5a !important;               /* strawberry jam */
    --world-success: #6a9c6e !important;              /* mint leaf */
    --world-warning: #e8a84a !important;              /* caramel drizzle */
    --world-info: #7aa3c8 !important;                 /* blueberry glaze */

    /* Inks (text on accent) */
    --world-accent-ink: #2d1a0a !important;           /* dark chocolate on gold */
    --world-accent-secondary-ink: #3d1a1f !important; /* dark on rose */
    --world-on-accent: #1a1410 !important;            /* universal */

    /* Status accents */
    --world-status-accent: #e8c56d !important;
    --world-status-accent-secondary: #d47a8a !important;

    /* Geometry */
    --world-radius: 18px 18px 22px 22px !important;
    --world-control: 12px 12px 16px 12px !important;
    --world-icon: 50% !important;
    --world-header: 20px 5px 0 0 !important;

    /* Glass/surface system */
    --surface-card-opacity: 88% !important;
    --surface-panel-opacity: 92% !important;
    --surface-dense-opacity: 96% !important;
    --surface-elevated-opacity: 98% !important;
    --surface-modal-opacity: 99% !important;
    --surface-blur: 12px !important;
    --surface-border-opacity: 35% !important;
    --surface-shadow-opacity: 22% !important;

    /* Shadow colors */
    --world-shadow: color-mix(in srgb, var(--world-deep) 90%, transparent) !important;
    --world-shadow-strong: color-mix(in srgb, var(--world-deep) 95%, transparent) !important;
    --world-shadow-colored: color-mix(in srgb, var(--world-accent-secondary) 15%, var(--world-deep) 85%) !important;
    --world-glow: color-mix(in srgb, var(--world-accent) 40%, transparent) !important;
    --world-glow-rose: color-mix(in srgb, var(--world-accent-secondary) 35%, transparent) !important;
  }

  /* ── Light mode (daytime sweet shop) ── */
  html[data-world="sweet-shop-after-hours"][data-mode="light"] {
    --world-background: #fef8f0;           /* warm vanilla */
    --world-deep: #f5e6d3;                 /* pale caramel */
    --world-surface: #fffdf8;              /* whipped cream */
    --world-elevated: #faf5ec;             /* buttercream */

    --world-text: #2d2018;                 /* dark chocolate */
    --world-secondary: #5d4432;            /* milk chocolate */
    --world-muted: #8b6f52 !important;                /* caramel */
    --world-faint: #a68a72 !important;                /* toasted almond */

    --world-accent: #b8860b;               /* deep gold */
    --world-accent-hover: #daa520 !important;         /* goldenrod */
    --world-accent-secondary: #c45a7a;     /* rose cream */
    --world-accent-tertiary: #a67c3d !important;      /* antique gold */

    --world-border: #d4b89c;               /* caramel border */
    --world-border-soft: #e8d4c0 !important;          /* soft caramel */
    --world-border-strong: #b8860b !important;        /* gold accent */
    --world-highlight: #fffef5;            /* sugar highlight */
    --world-highlight-soft: #fef9f0 !important;       /* glaze */

    --world-danger: #b84a4a;               /* strawberry */
    --world-success: #4a7c5e;              /* mint */
    --world-warning: #c8882a !important;              /* caramel */
    --world-info: #5a83a8 !important;                 /* blueberry */

    --world-accent-ink: #fef8f0;
    --world-accent-secondary-ink: #fef8f0 !important;
    --world-on-accent: #fef8f0;

    --world-status-accent: #b8860b;
    --world-status-accent-secondary: #c45a7a;

    --world-radius: 18px 18px 22px 22px !important;
    --world-control: 12px 12px 16px 12px !important;
    --world-icon: 50% !important;
    --world-header: 20px 5px 0 0 !important;

    --surface-card-opacity: 82% !important;
    --surface-panel-opacity: 86% !important;
    --surface-dense-opacity: 92% !important;
    --surface-elevated-opacity: 96% !important;
    --surface-modal-opacity: 98% !important;
    --surface-blur: 10px !important;
    --surface-border-opacity: 28% !important;
    --surface-shadow-opacity: 14% !important;

    --world-shadow: color-mix(in srgb, #1a1410 18%, transparent) !important;
    --world-shadow-strong: color-mix(in srgb, #1a1410 28%, transparent) !important;
    --world-shadow-colored: color-mix(in srgb, var(--world-accent-secondary) 12%, #1a1410 20%) !important;
    --world-glow: color-mix(in srgb, var(--world-accent) 25%, transparent) !important;
    --world-glow-rose: color-mix(in srgb, var(--world-accent-secondary) 22%, transparent) !important;
  }
}

/* ── World Preview (theme selector card) ── */
@media screen {
  .world-preview[data-world="sweet-shop-after-hours"] .world-portal-art {
    background:
      radial-gradient(ellipse at 50% 40%, color-mix(in srgb, var(--world-accent) 35%, transparent), transparent 45%),
      radial-gradient(ellipse at 30% 70%, color-mix(in srgb, var(--world-accent-secondary) 28%, transparent), transparent 35%),
      var(--world-accent-secondary) !important;
    opacity: 1 !important;
    filter: none !important;
  }

  .world-preview[data-world="sweet-shop-after-hours"] .world-sample-card {
    border-width: 2px !important;
    border-color: color-mix(in srgb, var(--world-border) 75%, var(--world-highlight)) !important;
    border-radius: 18px 18px 22px 22px !important;
    box-shadow:
      0 16px 30px -18px var(--world-shadow),
      0 4px 0 color-mix(in srgb, var(--world-accent-secondary) 35%, var(--world-border)),
      inset 0 1px 0 var(--world-highlight),
      0 0 24px -8px var(--world-glow) !important;
  }

  .world-preview[data-world="sweet-shop-after-hours"] .world-sample-heading {
    background: linear-gradient(105deg,
      color-mix(in srgb, var(--world-accent-secondary) 18%, var(--world-elevated)),
      color-mix(in srgb, var(--world-highlight) 30%, var(--world-elevated)) 48%,
      color-mix(in srgb, var(--world-accent) 15%, var(--world-elevated))) !important;
    border-bottom-color: color-mix(in srgb, var(--world-accent) 38%, var(--world-border)) !important;
  }
}