/* Inside the `dreamdesk` cascade layer, so any unlayered app CSS overrides it
   regardless of specificity. Apps with global resets should layer them first:
   @layer reset, dreamdesk; */
@layer dreamdesk {

/* PastelCore CSS */

html[data-theme="pastelcore"] {
  /* Pastel Colors */
  --pastel-pink: #fde2e4;
  --pastel-purple: #c8b6ff;
  --pastel-grey: #dbd7e4ed;
  --pastel-yellow: #fff1e6;
  --pastel-jade: #bee1e6;
  --pastel-red: #ffa6c1;
  --pastel-orange: #fec5bb;
  --pastelcore-cyan: #a7fcfb;
  --pastelcore-red: #ff9ea6;
  --pastelcore-blue: #a1e4ff;
  --pastelcore-purple: #c0b6fa;
  --pc-rose-pompadour: #fb6f92ff;
  
  --app-color: #fff5fa; /* Rose Mist */
  --line-color: rgb(61, 45, 51);

  --pasteclore-cyan-shadow: #b3cecd;
  --pastelcore-pink-shadow: rgba(103, 71, 73, 0.41);
    
  --pastelcore-red-bg: #ff9ea6b5;
    
  --pastelcore-pink-highlight: #fff9f9;
    
  --pc-pink-mint-gradient: linear-gradient(
      90deg,
      #fed9e0ff 0%,
      #f7c8d4ff 25%,
      #aef1f0ff 50%,
      #b4f9efff 75%,
      #3ff10b 100%
    );
    
  --pc-pink-tiffany-blue: linear-gradient(
      90deg,
      #fed9e0ff,
      #f7c8d4ff,
      #aef1f0ff,
      #b4f9efff
    );

  /* Semantic Color System - PastelCore Theme Mapping */
  --color-primary: var(--pc-rose-pompadour);
  --color-secondary: var(--pastelcore-cyan);
  --color-accent: var(--pastelcore-blue);
  --color-tertiary: var(--pastelcore-purple);
  --color-background: var(--app-color);
  --color-surface: var(--pastel-pink);
  --color-text: var(--black);
  --color-text-muted: var(--grey);
  --color-border: var(--line-color);
  
  /* Interactive States */
  --color-hover: var(--pastelcore-blue);
  --color-active: var(--pastelcore-cyan);
  --dd-list-selected-fg: #000;
  --color-disabled: var(--pastel-orange);
  --color-error: var(--pastelcore-red);
  --color-success: var(--pastel-jade);
  --color-warning: var(--pastel-yellow);
  
  /* UI Component Colors */
  --color-button-primary: var(--pastelcore-blue);
  --color-button-secondary: var(--pastelcore-red);
  --color-button-ghost: var(--pastelcore-red);
  --color-button-help: var(--pastel-yellow);
  --color-button-disable: var(--pastel-orange);
  
  --color-window-header: var(--pastelcore-cyan);
  --color-window-body: var(--pastel-pink);
  --color-window-border: var(--border);
  /* Resize grip color matches pastelcore border tone */
  --resize-stripe-color: var(--line-color);
  
  --color-input-background: var(--app-color);
  --color-input-border: var(--pastelcore-pink-shadow);
  --color-input-focus: var(--pastelcore-pink-highlight);
  
  --color-toast-alert: var(--pastelcore-red-bg);
  --color-toast-notification: var(--pastelcore-cyan);
  --color-toast-warning: var(--pastel-yellow);
  
  --color-progress-track: var(--pastel-grey);
  --color-progress-bar: var(--pastelcore-cyan);
  --color-progress-segment: var(--pastelcore-cyan);
  --color-progress-gradient: var(--pc-pink-tiffany-blue);
  
  --color-toggle-background: var(--pastelcore-cyan);
  --color-toggle-knob: var(--pastelcore-cyan);
  --color-toggle-active: var(--pastelcore-blue);
  
  /* Visual Depth Tokens */
  --window-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
  --window-header-shadow: inset -2px 2px 1px #f9f7ff, inset 2px -2px 1px var(--pasteclore-cyan-shadow);
  --dd-browser-sep-shadow: inset 0 1px 0 #f9f7ff, inset 0 -1px 0 #c0bfbf;
  --window-controls-button-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #d9c4cc;
  --toast-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #db989f, var(--shadow);
  --progress-track-shadow: inset -2px 2px 1px #f9f7ff, inset 2px -2px 1px var(--pasteclore-cyan-shadow);
  --progress-bar-shadow: inset -2px 5px 1px #ffffff, inset 2px -4px 1px #d1b5c0;
  --input-shadow: -2px -2px 0 var(--pastelcore-pink-shadow), 2px 2px 0 var(--pastelcore-pink-highlight);
  
  /* Scroll styles */
  --scroll-track-bg: #fffefe;
  --scroll-thumb-bg: var(--pastelcore-cyan);
  --scroll-thumb-shadow-light: #ffffff;
  --scroll-thumb-shadow-dark: var(--pasteclore-cyan-shadow);
  --scroll-button-bg: #ccc;
  --scroll-button-shadow-light: #ffffff;
  --scroll-button-shadow-dark: #a2a2a2;
  --scroll-arrow-color: #1c1c1c;
  
  /* Iridescent (thin-film) surface: the toggle, iridescent buttons and tags */
  --dd-iridescent: linear-gradient(
    to top right,
    #e2e2ffff 0%,
    #e4fbffff 25%,
    #ffefffff 50%,
    #fcfcffff 75%,
    #e5e5ffff 100%
  );
  --dd-iridescent-size: 260% 260%;
  --dd-iridescent-animation: shimmer 5s infinite linear;
  --dd-iridescent-shadow: inset -2px 2px 0.55px #ffffff, inset 2px -2px 0.55px #c5c6d1;

  --toggle-knob-gradient: var(--dd-iridescent);

  /* Control button icons */
  --btn-minimize-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'><line x1='7' y1='30' x2='27' y2='30' style='stroke:rgb(61,45,51);stroke-width:7' /></svg>");
  --btn-fullscreen-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='50'><rect width='30' height='30' x='10' y='10' style='fill:rgb(254,227,227);stroke-width:3;stroke:rgb(61,45,51)' /><line x1='9' y1='14' x2='41' y2='14' style='stroke:rgb(61,45,51);stroke-width:7' /></svg>");
  --btn-close-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='40px' height='40px' viewBox='0 0 40 40'><path d='M10,10 L30,30 M30,10 L10,30' stroke='rgb(61,45,51)' stroke-width='5' stroke-linecap='butt'/></svg>");

  /* Switch visuals */
  --toggle-slider-animation: var(--dd-iridescent-animation);
  --toggle-knob-animation: var(--dd-iridescent-animation);

  /* Buttons and toasts depth */
  --window-controls-button-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #d9c4cc;
  --toast-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #db989f, var(--shadow);

  /* tighter header/progress shadows */
  --window-header-shadow: inset -2px 2px 1px #f9f7ff, inset 2px -2px 1px var(--pasteclore-cyan-shadow);
  --dd-browser-sep-shadow: inset 0 1px 0 #f9f7ff, inset 0 -1px 0 #c0bfbf;
  --progress-track-shadow: inset -2px 2px 1px #f9f7ff, inset 2px -2px 1px var(--pasteclore-cyan-shadow);
  --progress-bar-shadow: inset -2px 5px 1px #ffffff, inset 2px -4px 1px #d1b5c0;

  /* button shadows by type */
  --button-shadow-primary: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #a4bfc3;
  --button-shadow-ghost: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #db989f;
  --button-shadow-help: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #f3d6a0;

  /* toast shadows by type (tight) */
  --toast-alert-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #db989f;
  --toast-notification-shadow: inset -2px 2px 1px #f9f7ff, inset 2px -2px 1px var(--pasteclore-cyan-shadow);
  --toast-warning-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #bebbb1;
  --progress-segment-shadow: inset -1px 1px 1px #fffcfc, inset 1px -1px 1px #b198a2;

  /* switch shadows */
  --toggle-slider-shadow: inset -2px 2px 0.6px rgba(104,52,52,0.16), inset 2px -2px 0.6px rgba(255,255,255,0.66);
  --toggle-knob-shadow: var(--dd-iridescent-shadow);
  --toggle-slider-bg-size: var(--dd-iridescent-size);
  --toggle-knob-bg-size: 260% 260%;

  --color-window-control-bg: #ffffff;

  /* global soft shadow tokens */
  --shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  --window-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
  --color-terminal-bg: #111111;
  --color-terminal-fg: #ffd6d6;
}

@keyframes shimmer {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 100%; }
}


body {
  background: var(--app-color);
}

/* Windows styles */
.pc-win {
  width: var(--window-width, auto);
  border: var(--border);
  background-color: var(--app-color);
  background-color: var(--pastel-pink);
  box-shadow: var(--shadow);
}

.pc-win-header {
  background: var(--pastelcore-cyan);
  color: var(--black);
  border-bottom: var(--border);
  box-shadow: inset -2px 2px 1px #f9f7ff,
    inset 2px -2px 1px var(--pasteclore-cyan-shadow);
}

.pc-win-controls button {
  background-color: var(--app-color);
  box-shadow: var(--shadow);
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #d9c4cc;
}

.pc-win-body,
html[data-theme="pastelcore"] .win-body {
  background-color: var(--color-input-background, #fff5fa);
}

/* Button styles */
.pc-btn--minimize {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'><line x1='7' y1='30' x2='27' y2='30' style='stroke:rgb(61,45,51);stroke-width:7' /></svg>");
}

.pc-btn--fullscreen {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='50'><rect width='30' height='30' x='10' y='10' style='fill:rgb(254,227,227);stroke-width:3;stroke:rgb(61,45,51)' /><line x1='9' y1='14' x2='41' y2='14' style='stroke:rgb(61,45,51);stroke-width:7' /></svg>");
}

.pc-btn--close {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='40px' height='40px' viewBox='0 0 40 40'><path d='M10,10 L30,30 M30,10 L10,30' stroke='rgb(61,45,51)' stroke-width='5' stroke-linecap='butt'/></svg>");
}

.pc-btn--primary {
  background-color: var(--pastelcore-blue);
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #a4bfc3;
}

.pc-btn--ghost {
  background-color: var(--pastelcore-red);
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #db989f;
}

.pc-btn--help {
  background-color: var(--pastel-yellow);
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #f3d6a0;
}

.pc-btn--disable {
  background-color: var(--pastel-orange);
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #f4b8a3;
}

.btn:hover:not(:disabled):not(.btn--disable) {
  box-shadow: var(--dd-hover-shadow);
}
.btn:active:not(:disabled):not(.btn--disable) {
  box-shadow: var(--dd-active-shadow);
}
html[data-theme="pastelcore"] .dd-startmenu-btn {
  --window-controls-button-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px var(--pasteclore-cyan-shadow, #b3cecd);
  --dd-active-shadow-dark: var(--pasteclore-cyan-shadow, #b3cecd);
}

.pc-btn--basic {
  background-color: rgb(255 181 183 / 40%);
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #d0bdc5;
}

.pc-terminal-win {
  background-color: var(--black);
  color: var(--pastel-orange);
}

.pc-terminal-win-body {
  background-color: var(--black);

}

/* Input styles */
.dreamdesk-input {
  box-shadow: -2px -2px 0 var(--pastelcore-pink-shadow),
    2px 2px 0 var(--pastelcore-pink-highlight);
}

/* Toast styles */
.pc-toast-alert {
  background-color: var(--pastelcore-red-bg);
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #db989f,
    var(--shadow);
}

.pc-toast-notification {
  background-color: var(--pastelcore-cyan);
  box-shadow: inset -2px 2px 1px #f9f7ff,
    inset 2px -2px 1px var(--pasteclore-cyan-shadow), var(--shadow);
}

.pc-toast-warning {
  background-color: var(--pastel-yellow);
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #bebbb1,
    var(--shadow);
}

.pc-progress-bar {
  background-color: var(--pastelcore-cyan);
  box-shadow: inset -2px 5px 1px #ffffff, inset 2px -4px 1px #d1b5c0;
  filter: hue-rotate(0deg);
}

.pc-progress-bar--gradient {
  background: var(--pc-pink-tiffany-blue);
  transition: width 0.5s ease, filter 0.5s linear;
  box-shadow: inset -2px 5px 1px #ffffff, inset 2px -4px 1px #d1b5c0;
}

.pc-progress-track--blocky {
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #b198a2;
}

.pc-progress-track  {
  background-color: var(--pastel-grey);
  border: var(--border);
  box-shadow: inset -2px 2px 1px #f9f7ff,
    inset 2px -2px 1px var(--pasteclore-cyan-shadow);

}

.pc-progress-segment {
  background-color: transparent;
  background-repeat: no-repeat;
  box-shadow: inset -1px 1px 1px #fffcfc, inset 1px -1px 1px #b198a2;
}

.pc-toggle .slider {
  animation: shimmer 5s infinite linear;
  background-color: var(--pastelcore-cyan);
  box-shadow: inset -2px 2px 0.7px rgba(104, 52, 52, 0.15),
    inset -2px -2px 0.7px rgba(255, 255, 255, 0.6),
    inset 2px -2px 0.7px rgba(0, 0, 0, 0.15),
    inset 2px 2px 0.7px rgba(0, 0, 0, 0.15);

}

.pc-toggle .knob {
  background: linear-gradient(
    to top right,
    #e2e2ffff 0%,
    #e4fbffff 25%,
    #ffefffff 50%,
    #fcfcffff 75%,
    #e5e5ffff 100%
  );
  background-size: 300% 300%;
  animation: shimmer 5s infinite linear;
  box-shadow: inset -2px 2px 0.5px #ffffff, inset 2px -2px 0.5px #c5c6d1;
  transition: transform 0.2s ease-in-out;

}

.pc-toggle input:checked + .slider .knob {
  transform: translateX(2.25rem);
}

.pc-toggle input:checked + .slider { background: var(--color-toggle-active); }

.pc-toggle input:checked + .slider .knob { box-shadow: var(--toggle-knob-shadow); }


.pc-iridescent {
  font-size: 3rem;
  font-weight: bold;
  color: white;
  position: relative;
  display: inline-block;
  background: linear-gradient(
    to top right,
    #e2e2ffff 0%,
    #e4fbffff 25%,
    #ffefffff 50%,
    #fcfcffff 75%,
    #e5e5ffff 125%
  );
  background-size: 300% 300%;
  animation: shimmer 5s infinite linear;
}

/* @keyframes shimmer is defined near the top of this file */



/* scrollbar styles */

.pc-scroll::-webkit-scrollbar-track,
html[data-theme="pastelcore"] *::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.pc-scroll::-webkit-scrollbar,
html[data-theme="pastelcore"] *::-webkit-scrollbar {
  width: 1.4rem;
  height: 1.4rem;
  background: #ccc;
}

.pc-scroll::-webkit-scrollbar-thumb,
html[data-theme="pastelcore"] *::-webkit-scrollbar-thumb {
  background: var(--pastelcore-cyan);
  background-size: 300% 300%;
  box-shadow: inset -2px 2px 1px #ffffff,
    inset 2px -2px 1px var(--pasteclore-cyan-shadow);
}

.pc-scroll::-webkit-scrollbar-thumb:hover,
html[data-theme="pastelcore"] *::-webkit-scrollbar-thumb:hover {
  box-shadow: inset -2px 2px 1px #ffffff,
    inset 2px -2px 1px var(--pastel-pink-shadow);
}

.pc-scroll::-webkit-scrollbar-button,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button {
  background-color: #ccc;
  background-position: center;
  background-repeat: no-repeat;
  border: none;
  box-shadow: inset -2px 2px 1px #ffffff, inset 2px -2px 1px #a2a2a2;
}

.pc-scroll::-webkit-scrollbar-button:vertical,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:vertical {
  border-left: var(--border);
}

.pc-scroll::-webkit-scrollbar-button:vertical:decrement,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:vertical:decrement {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24"><path fill="%231C1C1C" d="M12 8l6 6H6z"/></svg>');
  background-position: center;
  background-repeat: no-repeat;
}

.pc-scroll::-webkit-scrollbar-button:vertical:increment,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:vertical:increment {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24"><path fill="%231C1C1C" d="M12 16l-6-6h12z"/></svg>');
  background-position: center;
  background-repeat: no-repeat;
}

.pc-scroll::-webkit-scrollbar-button:vertical:increment:start,
.pc-scroll::-webkit-scrollbar-button:vertical:decrement:end,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:vertical:increment:start,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:vertical:decrement:end {
  display: none;
  border: none;
}

.pc-scroll::-webkit-scrollbar:vertical,
html[data-theme="pastelcore"] *::-webkit-scrollbar:vertical {
  border-right: none;
}

.pc-scroll::-webkit-scrollbar-track:vertical,
html[data-theme="pastelcore"] *::-webkit-scrollbar-track:vertical {
  border-right: none;
}

.pc-scroll::-webkit-scrollbar-thumb:vertical,
html[data-theme="pastelcore"] *::-webkit-scrollbar-thumb:vertical {
  border-right: none;
}

.pc-scroll::-webkit-scrollbar-button:horizontal,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:horizontal {
  border-top: var(--border);
  box-shadow: inset 0 2px 1px #ffffff, inset 0 -2px 1px #a2a2a2;
}

.pc-scroll::-webkit-scrollbar-button:horizontal:decrement,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:horizontal:decrement {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24"><path fill="%231C1C1C" d="M16 12l-6-6v12z"/></svg>');
  background-position: center;
  background-repeat: no-repeat;
}

.pc-scroll::-webkit-scrollbar-button:horizontal:increment,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:horizontal:increment {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24"><path fill="%231C1C1C" d="M8 12l6 6V6z"/></svg>');
  background-position: center;
  background-repeat: no-repeat;
}

.pc-scroll::-webkit-scrollbar-button:horizontal:increment:start,
.pc-scroll::-webkit-scrollbar-button:horizontal:decrement:end,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:horizontal:increment:start,
html[data-theme="pastelcore"] *::-webkit-scrollbar-button:horizontal:decrement:end {
  display: none;
  border: none;
}

.pc-scroll::-webkit-scrollbar:horizontal,
html[data-theme="pastelcore"] *::-webkit-scrollbar:horizontal {
  border-bottom: none;
}

.pc-scroll::-webkit-scrollbar-track:horizontal,
html[data-theme="pastelcore"] *::-webkit-scrollbar-track:horizontal {
  border-bottom: none;
}

.pc-scroll::-webkit-scrollbar-thumb:horizontal,
html[data-theme="pastelcore"] *::-webkit-scrollbar-thumb:horizontal {
  border-bottom: none;
}

/* Firefox support */
@-moz-document url-prefix() {
  .pc-scroll {
    scrollbar-width: thin;
    scrollbar-color: var(--pastel-pink) #f1f1f1 !important;
  }
}

} /* @layer dreamdesk */