/*
 * Copyright (c) 2026, Salesforce, Inc.,
 * All rights reserved.
 * For full license text, see the LICENSE.txt file
 */

@layer theme {
  .slds-modal {
    /* Shared chrome */
    --slds-c-modal-color-background: var(--slds-g-color-surface-container-1);
    --slds-c-modal-radius-border: var(--slds-g-radius-border-2);
    --slds-c-modal-shadow: var(--slds-g-shadow-4);

    /* Dividers */
    --slds-c-modal-header-sizing-border: var(--slds-g-sizing-border-2);
    --slds-c-modal-header-color-border: var(--slds-g-color-border-1);
    --slds-c-modal-footer-sizing-border: var(--slds-g-sizing-border-2);
    --slds-c-modal-footer-color-border: var(--slds-g-color-border-1);

    /* Header typography */
    --slds-c-modal-header-font-weight: var(--slds-g-font-weight-4);
    --slds-c-modal-header-font-size: var(--slds-g-font-scale-2);
    --slds-c-modal-header-font-line-height: var(--slds-g-font-line-height-2);
    --slds-c-modal-header-font-align: center;

    /* Header surface */
    --slds-c-modal-header-color-background: var(--slds-g-color-surface-container-1);
    --slds-c-modal-header-color-foreground: var(--slds-g-color-on-surface-3);
    --slds-c-modal-header-spacing-block: var(--slds-g-spacing-4);
    --slds-c-modal-header-spacing-inline: var(--slds-g-spacing-4);

    /* Content surface */
    --slds-c-modal-content-color-background: var(--slds-g-color-surface-container-1);
    --slds-c-modal-content-color-foreground: var(--slds-g-color-on-surface-3);

    /* Footer surface */
    --slds-c-modal-footer-color-background: var(--slds-g-color-surface-container-2);
    --slds-c-modal-footer-color-foreground: var(--slds-g-color-on-surface-3);
    --slds-c-modal-footer-spacing-block: var(--slds-g-spacing-3);
    --slds-c-modal-footer-spacing-inline: var(--slds-g-spacing-4);
    --slds-c-modal-footer-button-spacing-gap: var(--slds-g-spacing-2);
    --slds-c-modal-footer-font-align: right;

    /* Close button */
    --slds-c-modal-close-size: var(--slds-g-sizing-9);
    --slds-c-modal-close-color-background: var(--slds-g-color-surface-container-1);
    --slds-c-modal-close-color-background-hover: var(--slds-g-color-surface-container-2);
    --slds-c-modal-close-color-border: var(--slds-g-color-border-2);
    --slds-c-modal-close-sizing-border: var(--slds-g-sizing-border-1);
    --slds-c-modal-close-sizing-outline: var(--slds-g-sizing-border-2);
    --slds-c-modal-close-shadow-focus: var(--slds-g-shadow-inset-inverse-focus-1);
  }

  .slds-modal .slds-modal__header .slds-modal__close {
    inset-block-start: calc(var(--slds-g-spacing-6) * -1.25);
    inset-inline-end: 0;
  }

  .slds-modal .slds-modal__close {
    inset-block-end: var(--slds-g-spacing-2);
  }

  .slds-modal.slds-modal_full .slds-modal__header .slds-modal__close {
    inset-inline-end: var(--slds-g-spacing-4);
  }

  /* Backdrop is its own component namespace (shared across multiple
     components) and is a sibling of `.slds-modal`. The hook lives on
     the backdrop's own root and routes through the shared backdrop
     token so the computed paint matches the standard `modal.css`. */
  .slds-backdrop {
    --slds-c-backdrop-color-background: var(--slds-s-backdrop-color-background);
  }

  /* Empty-header context: zero the header's spacing + divider so an
     empty header collapses cleanly. */
  .slds-modal .slds-modal__header_empty {
    --slds-c-modal-header-spacing-block-start: 0;
    --slds-c-modal-header-spacing-block-end: 0;
    --slds-c-modal-header-spacing-inline-start: 0;
    --slds-c-modal-header-spacing-inline-end: 0;
    --slds-c-modal-header-sizing-border: 0;
  }

  .slds-modal .slds-modal__container {
    padding-block-start: var(--slds-g-spacing-8);
    padding-block-end: var(--slds-g-spacing-12);
    padding-inline-start: 0;
    padding-inline-end: 0;
  }

  @media (max-width: 47.9375em) {
    .slds-modal .slds-modal__container {
      margin-inline: var(--slds-g-spacing-6);
    }
  }

  .slds-modal.slds-modal_full {
    --slds-c-modal-radius-border: 0;
  }

  .slds-modal.slds-modal_full .slds-modal__container {
    padding-block-start: var(--slds-g-spacing-4);
    padding-block-end: 0;
    padding-inline-start: 0;
    padding-inline-end: 0;
  }
}