/* IDX Plugin Design System Variables */
/* Generated automatically - do not edit manually */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");

:root:root {
  --idxp-color-primary: #2563EB;
  --idxp-color-primary-rgb: 37, 99, 235;
  --idxp-color-primary-hover: #1D4ED8;
  --idxp-color-primary-hover-rgb: 29, 78, 216;
  --idxp-color-text-primary: #111827;
  --idxp-color-text-primary-rgb: 17, 24, 39;
  --idxp-color-text-secondary: #6B7280;
  --idxp-color-text-secondary-rgb: 107, 114, 128;
  --idxp-color-bg-page: #FAFAFA;
  --idxp-color-bg-page-rgb: 250, 250, 250;
  --idxp-color-bg-elements: #FFFFFF;
  --idxp-color-bg-elements-rgb: 255, 255, 255;
  --idxp-color-input-background: #FFFFFF;
  --idxp-color-input-background-rgb: 255, 255, 255;
  --idxp-color-border-color: #E5E7EB;
  --idxp-color-border-color-rgb: 229, 231, 235;
  --idxp-color-header-bg: #F3F4F6;
  --idxp-color-header-bg-rgb: 243, 244, 246;
  --idxp-color-header-title: #111827;
  --idxp-color-header-title-rgb: 17, 24, 39;
  --idxp-color-header-subtitle: #6B7280;
  --idxp-color-header-subtitle-rgb: 107, 114, 128;
  --idxp-color-header-tab-active: #2563EB;
  --idxp-color-header-tab-active-rgb: 37, 99, 235;
  --idxp-color-header-tab-inactive: #6B7280;
  --idxp-color-header-tab-inactive-rgb: 107, 114, 128;
  --idxp-color-header-tab-underline: #2563EB;
  --idxp-color-header-tab-underline-rgb: 37, 99, 235;
  --idxp-spacing-small: 8px;
  --idxp-spacing-medium: 16px;
  --idxp-spacing-large: 32px;
  --idxp-spacing-x-large: 48px;
  --idxp-font-family-body: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --idxp-font-family-heading: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --idxp-typography-heading-large-font-size: 49px;
  --idxp-typography-heading-large-font-weight: 700;
  --idxp-typography-heading-large-line-height: 1.1;
  --idxp-typography-heading-large-letter-spacing: -1px;
  --idxp-typography-heading-medium-font-size: 31px;
  --idxp-typography-heading-medium-font-weight: 600;
  --idxp-typography-heading-medium-line-height: 1.2;
  --idxp-typography-heading-medium-letter-spacing: -0.3px;
  --idxp-typography-heading-small-font-size: 20px;
  --idxp-typography-heading-small-font-weight: 600;
  --idxp-typography-heading-small-line-height: 1.3;
  --idxp-typography-heading-small-letter-spacing: 0px;
  --idxp-typography-text-font-size: 16px;
  --idxp-typography-text-font-weight: 400;
  --idxp-typography-text-line-height: 1.5;
  --idxp-typography-text-letter-spacing: 0px;
  --idxp-typography-text-small-font-size: 14px;
  --idxp-typography-text-small-font-weight: 400;
  --idxp-typography-text-small-line-height: 1.5;
  --idxp-typography-text-small-letter-spacing: 0px;
  --idxp-typography-label-font-size: 12px;
  --idxp-typography-label-font-weight: 500;
  --idxp-typography-label-line-height: 1.3;
  --idxp-typography-label-letter-spacing: 0px;
  --idxp-typography-label-text-transform: uppercase;
  --idxp-typography-button-font-size: 14px;
  --idxp-typography-button-font-weight: 500;
  --idxp-typography-button-line-height: 1.5;
  --idxp-typography-button-letter-spacing: 0.3px;
  --idxp-line-height-tight: 1.2;
  --idxp-line-height-normal: 1.5;
  --idxp-line-height-relaxed: 1.6;
  --idxp-line-height-loose: 1.7;
  --idxp-border-radius: 6px;
  --idxp-border-radius-sm: 4px;
  --idxp-border-radius-full: 9999px;
  --idxp-element-borders: 1;
  --idxp-card-hover: 1;
  --idxp-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1);
  --idxp-shadow-sm: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
  --idxp-shadow-md: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
  --idxp-shadow-lg: 0px 8px 24px 0px rgba(0, 0, 0, 0.12);
  --idxp-transition-duration: 200ms;
  --idxp-transition-timing: ease-in-out;
  --idxp-transition: all 200ms ease-in-out;
  --idxp-container-max-width: 1230px;
  --idxp-container-max-width-tablet: 798px;
  --idxp-container-max-width-mobile: 530px;
  --idxp-content-max-width: 800px;
  --idxp-container-padding-desktop: 15px;
  --idxp-container-padding-mobile: 15px;
  --idxp-grid-gap-sm: 8px;
  --idxp-grid-gap-md: 16px;
  --idxp-grid-gap-lg: 24px;
  --idxp-grid-gap-xl: 32px;
  --idxp-form-control-height: 44px;
  --idxp-button-padding-x: 24px;
  --idxp-input-padding-x: 16px;
  --idxp-z-index-dropdown: 1000;
  --idxp-z-index-sticky: 1020;
  --idxp-z-index-fixed: 1030;
  --idxp-z-index-modal-backdrop: 1040;
  --idxp-z-index-modal: 1050;
  --idxp-z-index-popover: 1060;
  --idxp-z-index-tooltip: 1070;
}

/* Layout override for tablet (768px to 1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
  :root:root {
    --idxp-container-max-width: 798px;
  }
}

/* Layout override for mobile (below 768px) */
@media (max-width: 767px) {
  :root:root {
    --idxp-container-max-width: 530px;
  }
}

/* Responsive overrides for mobile (max-width: 767px) */
@media (max-width: 767px) {
  :root:root {
    --idxp-spacing-large: 24px;
    --idxp-spacing-x-large: 36px;
  }
}

/* Responsive overrides for mobile (max-width: 768px) */
@media (max-width: 768px) {
  :root:root {
    --idxp-typography-heading-large-font-size: 39px;
    --idxp-typography-heading-large-font-weight: 700;
    --idxp-typography-heading-large-line-height: 1.15;
    --idxp-typography-heading-large-letter-spacing: -0.6px;
    --idxp-typography-heading-medium-font-size: 28px;
    --idxp-typography-heading-medium-font-weight: 600;
    --idxp-typography-heading-medium-line-height: 1.25;
    --idxp-typography-heading-medium-letter-spacing: -0.2px;
  }
}