/*
 * AyarLine UI Kit Foundation
 * Source of truth: Ant Design System for Figma (Free version)
 * Figma community file: 822070817360747147
 *
 * Ant Design semantics are mapped to AyarLine brand tokens. The project keeps
 * its local Yekan Bakh font files and gold/paper/dark brand identity.
 */
:root {
  /* Seed / brand */
  --ant-color-primary: #efb21a;
  --ant-color-primary-hover: #f4c13d;
  --ant-color-primary-active: #d99b08;
  --ant-color-primary-bg: #fff8df;
  --ant-color-primary-bg-hover: #fff1bf;
  --ant-color-primary-border: #f2c75a;
  --ant-color-primary-border-hover: #e8aa0c;
  --ant-color-primary-text: #9b6800;
  --ant-color-primary-text-hover: #7f5400;
  --ant-color-primary-text-active: #654200;

  /* Neutral / surfaces */
  --ant-color-text: #202020;
  --ant-color-text-secondary: rgba(32, 32, 32, .72);
  --ant-color-text-tertiary: rgba(32, 32, 32, .48);
  --ant-color-text-quaternary: rgba(32, 32, 32, .28);
  --ant-color-text-light-solid: #ffffff;
  --ant-color-bg-base: #ffffff;
  --ant-color-bg-layout: #f7f5f0;
  --ant-color-bg-container: #ffffff;
  --ant-color-bg-elevated: #ffffff;
  --ant-color-bg-mask: rgba(20, 18, 17, .48);
  --ant-color-border: rgba(32, 32, 32, .15);
  --ant-color-border-secondary: rgba(32, 32, 32, .08);
  --ant-color-fill: rgba(32, 32, 32, .15);
  --ant-color-fill-secondary: rgba(32, 32, 32, .08);
  --ant-color-fill-tertiary: rgba(32, 32, 32, .04);
  --ant-color-fill-quaternary: rgba(32, 32, 32, .025);

  /* Feedback */
  --ant-color-success: #52c41a;
  --ant-color-warning: #faad14;
  --ant-color-error: #ff4d4f;
  --ant-color-info: #1677ff;

  /* Typography */
  --ant-font-family: "Yekan Bakh FaNum", "Yekan Bakh Fa", "Yekan Bakh Fa-En", Tahoma, Arial, sans-serif;
  --ant-font-size-sm: 12px;
  --ant-font-size: 14px;
  --ant-font-size-lg: 16px;
  --ant-font-size-xl: 20px;
  --ant-line-height: 1.5715;
  --ant-line-height-lg: 1.5;
  --ant-font-weight-strong: 600;

  /* Geometry */
  --ant-border-radius-xs: 2px;
  --ant-border-radius-sm: 4px;
  --ant-border-radius: 6px;
  --ant-border-radius-lg: 8px;
  --ant-border-radius-xl: 12px;
  --ant-control-height-sm: 24px;
  --ant-control-height: 32px;
  --ant-control-height-lg: 40px;
  --ant-line-width: 1px;
  --ant-line-type: solid;

  /* Spacing */
  --ant-size-xxs: 4px;
  --ant-size-xs: 8px;
  --ant-size-sm: 12px;
  --ant-size: 16px;
  --ant-size-md: 20px;
  --ant-size-lg: 24px;
  --ant-size-xl: 32px;
  --ant-size-xxl: 48px;

  /* Motion */
  --ant-motion-duration-fast: .1s;
  --ant-motion-duration-mid: .2s;
  --ant-motion-duration-slow: .3s;
  --ant-motion-ease-in-out: cubic-bezier(.645, .045, .355, 1);
  --ant-motion-ease-out: cubic-bezier(.215, .61, .355, 1);
  --ant-motion-ease-in: cubic-bezier(.55, .055, .675, .19);

  /* Elevation */
  --ant-box-shadow: 0 6px 16px 0 rgba(0, 0, 0, .08), 0 3px 6px -4px rgba(0, 0, 0, .12), 0 9px 28px 8px rgba(0, 0, 0, .05);
  --ant-box-shadow-secondary: 0 3px 6px -4px rgba(0, 0, 0, .12), 0 6px 16px 0 rgba(0, 0, 0, .08), 0 9px 28px 8px rgba(0, 0, 0, .05);
  --ant-box-shadow-tertiary: 0 1px 2px 0 rgba(0, 0, 0, .03), 0 1px 6px -1px rgba(0, 0, 0, .02), 0 2px 4px 0 rgba(0, 0, 0, .02);

  /* Project semantic aliases */
  --ayar-ui-primary: var(--ant-color-primary);
  --ayar-ui-paper: var(--ant-color-bg-layout);
  --ayar-ui-ink: var(--ant-color-text);
  --ayar-ui-surface: var(--ant-color-bg-container);
  --ayar-ui-border: var(--ant-color-border-secondary);
  --ayar-ui-radius: var(--ant-border-radius-lg);
  --ayar-ui-focus-ring: 0 0 0 3px rgba(239, 178, 26, .22);
}

/* Shared Ant-style state contract for current and future project components. */
.ayar-ui-control {
  box-sizing: border-box;
  font-family: var(--ant-font-family);
  transition: color var(--ant-motion-duration-mid) var(--ant-motion-ease-in-out),
              background-color var(--ant-motion-duration-mid) var(--ant-motion-ease-in-out),
              border-color var(--ant-motion-duration-mid) var(--ant-motion-ease-in-out),
              box-shadow var(--ant-motion-duration-mid) var(--ant-motion-ease-in-out),
              transform var(--ant-motion-duration-mid) var(--ant-motion-ease-in-out);
}

.ayar-ui-control:focus-visible {
  outline: none;
  box-shadow: var(--ayar-ui-focus-ring);
}

.ayar-ui-card {
  box-sizing: border-box;
  background: var(--ant-color-bg-container);
  border: var(--ant-line-width) var(--ant-line-type) var(--ant-color-border-secondary);
  border-radius: var(--ant-border-radius-lg);
  box-shadow: var(--ant-box-shadow-tertiary);
}

.ayar-ui-divider {
  border: 0;
  border-top: var(--ant-line-width) var(--ant-line-type) var(--ant-color-border-secondary);
}

@media (prefers-reduced-motion: reduce) {
  .ayar-ui-control {
    transition-duration: .01ms !important;
  }
}