/* Ali API shared glass surfaces. The original homepage is a separate document
 * without #root, so this theme cannot change its brand, layout or assets.
 * Keep this file standalone to ship without unrelated application changes. */
body:has(> #root) {
  --ali-glass-surface: rgb(255 255 255 / 64%);
  --ali-glass-panel: rgb(255 255 255 / 80%);
  --ali-glass-control: rgb(255 255 255 / 54%);
  --ali-glass-hover: rgb(227 240 237 / 78%);
  --ali-glass-edge: rgb(92 122 122 / 20%);
  --ali-glass-solid: #f5f9f8;
  --ali-glass-blur: 14px;
  --ali-glass-shadow: 0 8px 28px rgb(28 61 61 / 6%);
  --table-row: transparent;
  --table-header: rgb(239 247 245 / 92%);
  background-color: #eef4f4;
  background-image:
    radial-gradient(ellipse at 7% 10%, rgb(161 217 206 / 55%), transparent 52%),
    radial-gradient(ellipse at 88% 74%, rgb(181 203 231 / 50%), transparent 58%);
  background-attachment: fixed;
}
.dark body:has(> #root),
body.dark:has(> #root) {
  --ali-glass-surface: rgb(26 39 40 / 68%);
  --ali-glass-panel: rgb(25 38 40 / 86%);
  --ali-glass-control: rgb(38 55 57 / 62%);
  --ali-glass-hover: rgb(51 77 76 / 82%);
  --ali-glass-edge: rgb(176 207 204 / 18%);
  --ali-glass-solid: #1c2a2b;
  --ali-glass-shadow: 0 8px 28px rgb(0 0 0 / 15%);
  --table-header: rgb(32 49 50 / 94%);
  background-color: #101c20;
  background-image:
    radial-gradient(ellipse at 7% 10%, rgb(33 88 77 / 56%), transparent 52%),
    radial-gradient(ellipse at 88% 74%, rgb(47 67 106 / 48%), transparent 58%);
}
body:has(> #root) :is(.bg-background, .bg-popover, .bg-sidebar) {
  background-color: var(--ali-glass-control);
}
/* Translucent surfaces need stronger secondary ink than opaque white cards. */
body:has(> #root):has(.customer-console) {
  --muted-foreground: #4e6068;
}
.dark body:has(> #root):has(.customer-console),
body.dark:has(> #root):has(.customer-console) {
  --muted-foreground: #b6c8c5;
}
body:has(> #root) .customer-console .text-primary {
  color: #08766d;
}
.dark body:has(> #root) .customer-console .text-primary,
body.dark:has(> #root) .customer-console .text-primary {
  color: #55dfce;
}
/* Structural wrappers stay clear; each surface owns one blur layer. */
body:has(> #root)
  :is(
    [data-slot='sidebar-wrapper'],
    [data-slot='sidebar-inset'],
    main.bg-background
  ) {
  background-color: transparent;
}
body:has(> #root)
  :is(
    .bg-card,
    [data-slot='card'],
    [data-slot='sidebar-inner'],
    [data-slot='sidebar'][data-collapsible='none'],
    header.bg-background,
    [data-slot='sidebar-wrapper'] > header,
    header.bg-card,
    .customer-console section.rounded-lg.border,
    .container > .mx-auto.flex.w-full.flex-col[class*='sm:w-']
  ) {
  background: var(--ali-glass-surface);
  border-color: var(--ali-glass-edge);
  -webkit-backdrop-filter: blur(var(--ali-glass-blur)) saturate(125%);
  backdrop-filter: blur(var(--ali-glass-blur)) saturate(125%);
  box-shadow: var(--ali-glass-shadow);
}
/* Existing authentication form, unchanged behavior and content. */
body:has(> #root) .container > .mx-auto.flex.w-full.flex-col[class*='sm:w-'] {
  border-radius: 16px;
  margin-block: 24px;
}
body:has(> #root)
  :is(
    [data-slot='card'],
    [data-slot='dialog-content'],
    [data-slot='sheet-content'],
    [data-slot='drawer-content']
  )
  [data-slot='card'] {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: none;
}
/* Portals live under body, including mobile navigation. */
body:has(> #root)
  :is(
    [data-slot='dialog-content'],
    [data-slot='alert-dialog-content'],
    [data-slot='sheet-content'],
    [data-slot='drawer-content'],
    [data-slot='popover-content'],
    [data-slot='dropdown-menu-content'],
    [data-slot='dropdown-menu-sub-content'],
    [data-slot='select-content'],
    [data-slot='combobox-content'],
    [data-slot='context-menu-content'],
    [data-slot='context-menu-sub-content'],
    [data-slot='hover-card-content'],
    [data-slot='menubar-content'],
    [data-slot='navigation-menu-content'],
    [data-sidebar='sidebar'][data-mobile='true']
  ) {
  background: var(--ali-glass-panel);
  border-color: var(--ali-glass-edge);
  -webkit-backdrop-filter: blur(var(--ali-glass-blur)) saturate(125%);
  backdrop-filter: blur(var(--ali-glass-blur)) saturate(125%);
  box-shadow: var(--ali-glass-shadow);
}
body:has(> #root)
  :is(
    [data-slot='dialog-overlay'],
    [data-slot='alert-dialog-overlay'],
    [data-slot='sheet-overlay'],
    [data-slot='drawer-overlay']
  ) {
  background: rgb(8 23 27 / 26%);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
/* Dense rows and controls use translucent paint, never blur per cell. */
body:has(> #root)
  :is(
    [data-slot='input'],
    [data-slot='textarea'],
    [data-slot='select-trigger'],
    [data-slot='combobox-input'],
    [data-slot='input-group'],
    [data-slot='tabs-list'],
    [data-slot='native-select'],
    [data-slot='command']
  ) {
  background-color: var(--ali-glass-control);
  border-color: var(--ali-glass-edge);
}
body:has(> #root)
  :is(
    [data-slot='table-container'],
    .rounded-lg.border:has(> [data-slot='table'])
  ) {
  background-color: var(--ali-glass-surface);
}
body:has(> #root) :is([data-slot='table-row'], [data-slot='table-cell']) {
  background-color: transparent;
}
body:has(> #root)
  [data-slot='table-row']:is(
    :hover,
    [data-state='selected'],
    :has([aria-expanded='true'])
  ) {
  background-color: var(--ali-glass-hover);
}
body:has(> #root)
  :is(
    [data-slot='table-header'],
    [data-slot='table-head'],
    [data-slot='table-cell'].sticky
  ) {
  background-color: var(--table-header);
}
body:has(> #root)
  :is(
    [data-slot='card-footer'],
    [data-slot='dialog-footer'],
    [data-slot='section-heading'],
    [data-slot='section-content'] > .bg-background,
    footer.bg-background
  ) {
  background-color: var(--ali-glass-control);
}
body:has(> #root)
  [data-sonner-toast][data-styled='true']:not([data-type='error']):not(
    [data-type='success']
  ):not([data-type='warning']) {
  background: var(--ali-glass-panel);
  border-color: var(--ali-glass-edge);
  -webkit-backdrop-filter: blur(var(--ali-glass-blur));
  backdrop-filter: blur(var(--ali-glass-blur));
}
@media (max-width: 767px) {
  body:has(> #root) {
    --ali-glass-blur: 8px;
    background-attachment: scroll;
  }
}
@supports not (
  (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))
) {
  body:has(> #root) {
    --ali-glass-surface: var(--ali-glass-solid);
    --ali-glass-panel: var(--ali-glass-solid);
    --ali-glass-control: var(--ali-glass-solid);
  }
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  body:has(> #root) {
    --ali-glass-surface: var(--ali-glass-solid);
    --ali-glass-panel: var(--ali-glass-solid);
    --ali-glass-control: var(--ali-glass-solid);
    --ali-glass-blur: 0px;
    background-image: none;
  }
}
@media (forced-colors: active) {
  body:has(> #root) {
    --ali-glass-surface: Canvas;
    --ali-glass-panel: Canvas;
    --ali-glass-control: Canvas;
    --ali-glass-edge: CanvasText;
    --ali-glass-blur: 0px;
    --ali-glass-shadow: none;
    --table-header: Canvas;
    background: Canvas;
  }
}