/* Aman / Bootstrap 5 design tokens.
   This file is the first-party visual source of truth for the backoffice.
   Keep it framework-light: tokens only, no page-specific selectors. */

@font-face {
  font-family: 'KanitLight';
  font-display: block;
  src: local('KanitLight'),
    url('/assets/fonts/Kanit/Kanit-Light.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Kanit';
  font-display: block;
  src: url('/assets/fonts/Kanit/Kanit-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Kanit';
  font-display: block;
  src: url('/assets/fonts/Kanit/Kanit-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Kanit';
  font-display: block;
  src: url('/assets/fonts/Kanit/Kanit-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Kanit';
  font-display: block;
  src: url('/assets/fonts/Kanit/Kanit-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Kanit';
  font-display: block;
  src: url('/assets/fonts/Kanit/Kanit-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

:root {
  color-scheme: light;

  /* Core palette: the only hard-coded brand color decisions. */
  --color-ground: #F2EFE9;
  --color-paper: #FFFFFF;
  --color-ink: #111827;
  --color-green: #48614A;
  --color-red: #B52722;
  --color-gold: #8A7447;
  --color-blue: #315F86;
  --color-ink-rgb: 17, 24, 39;
  --color-green-rgb: 72, 97, 74;
  --color-red-rgb: 181, 39, 34;
  --color-gold-rgb: 138, 116, 71;
  --color-blue-rgb: 49, 95, 134;
  --color-ground-rgb: 242, 239, 233;
  --color-paper-rgb: 255, 255, 255;

  /* Semantic colors and derived tones. */
  --aman-bg: var(--color-ground);
  --aman-surface: var(--color-paper);
  --aman-surface-soft: color-mix(in srgb, var(--color-paper) 72%, var(--color-ground));
  --aman-surface-glass: color-mix(in srgb, var(--aman-surface) 72%, transparent);
  --aman-header: color-mix(in srgb, var(--color-paper) 52%, var(--color-ground));
  --aman-wash: color-mix(in srgb, var(--color-paper) 44%, var(--color-ground));
  --aman-hover: color-mix(in srgb, var(--color-paper) 58%, var(--color-ground));

  --aman-text: var(--color-ink);
  --aman-text-strong: var(--color-ink);
  --aman-muted: color-mix(in srgb, var(--color-ink) 62%, var(--color-ground));
  --aman-muted-soft: color-mix(in srgb, var(--color-ink) 43%, var(--color-ground));

  --aman-line: color-mix(in srgb, var(--color-ink) 10%, var(--color-ground));
  --aman-line-strong: color-mix(in srgb, var(--color-ink) 18%, var(--color-ground));
  --aman-line-soft: color-mix(in srgb, var(--aman-line) 65%, var(--aman-surface));
  --aman-table-line: var(--color-ink);
  --aman-table-border-width: 1px;
  --aman-action: var(--color-ink);
  --aman-action-hover: var(--color-ink);
  --aman-text-action-hover: var(--ml-link-hover, var(--aman-green-hover));
  --aman-text-action-muted: var(--aman-text-strong);

  --aman-green: var(--color-green);
  --aman-green-hover: color-mix(in srgb, var(--color-green) 86%, var(--color-ink));
  --aman-green-soft: color-mix(in srgb, var(--color-green) 15%, var(--color-paper));
  --aman-green-wash: color-mix(in srgb, var(--color-green) 8%, var(--color-paper));
  --aman-green-line: color-mix(in srgb, var(--color-green) 22%, var(--color-paper));
  --aman-table-pick-cell-hover: var(--aman-green-wash);
  --aman-table-pick-cell-selected-hover: var(--aman-green-line);

  --aman-danger: var(--color-red);
  --aman-danger-hover: var(--aman-danger);
  --aman-danger-soft: color-mix(in srgb, var(--aman-danger) 18%, var(--aman-surface));
  --aman-danger-wash: color-mix(in srgb, var(--aman-danger) 9%, var(--aman-surface));
  --aman-danger-line: color-mix(in srgb, var(--aman-danger) 35%, var(--aman-surface));

  --aman-success: var(--aman-green);
  --aman-success-soft: var(--aman-green-soft);
  --aman-info: color-mix(in srgb, var(--color-blue) 74%, var(--color-green));
  --aman-info-soft: color-mix(in srgb, var(--aman-info) 11%, var(--color-paper));
  --aman-blue: var(--color-blue);
  --aman-warning: var(--color-gold);
  --aman-warning-soft: color-mix(in srgb, var(--color-gold) 20%, var(--color-paper));
  --aman-calculated: var(--aman-surface-soft);
  --aman-disabled: color-mix(in srgb, var(--color-ink) 8%, var(--color-paper));
  --aman-disabled-text: color-mix(in srgb, var(--color-ink) 58%, var(--color-paper));
  --aman-focus: color-mix(in srgb, var(--color-ink) 12%, transparent);
  --status-account-open: oklch(from rgb(var(--bs-success-rgb)) calc(l * 1.04) calc(c * 1.7) 145);
  --status-account-closed: var(--aman-blue);
  --status-account-bad-debt: var(--aman-danger);
  --status-account-seized: oklch(from var(--aman-warning) calc(l * 1.02) calc(c * 2.05) 68);
  --status-account-court: var(--aman-danger);

  --aman-font-family: Kanit, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --aman-font-size: 15px;
  --aman-font-size-xs: 15px;
  --aman-font-size-sm: 15px;
  --aman-font-size-base: 15px;
  --aman-font-size-md: 15px;
  --aman-font-size-lg: 16px;
  --aman-font-size-xl: 18px;
  --aman-font-size-20: 20px;
  --aman-font-size-2xl: 22px;
  --aman-font-size-display: 24px;
  --aman-font-size-stat: 34px;
  --aman-font-size-meter: 38px;
  --aman-line-height: 1.3;
  --aman-font-weight-light: 300;
  --aman-font-weight-regular: 400;
  --aman-font-weight-medium: 500;
  --aman-font-weight-semibold: 600;
  --aman-font-weight-bold: 700;
  --aman-font-weight-heavy: 800;
  --aman-font-weight-black: 900;

  --aman-space-3xs: 2px;
  --aman-space-2xs: 4px;
  --aman-space-xs: 6px;
  --aman-space-sm: 8px;
  --aman-space-10: 10px;
  --aman-space-md: 12px;
  --aman-space-14: 14px;
  --aman-space-lg: 16px;
  --aman-space-18: 18px;
  --aman-space-xl: 24px;
  --aman-space-2xl: 32px;

  /* Backoffice UI rhythm: neutral aliases for shared spacing/sizing ownership. */
  --ui-space-3xs: var(--aman-space-3xs);
  --ui-space-2xs: var(--aman-space-2xs);
  --ui-space-xs: var(--aman-space-xs);
  --ui-space-sm: var(--aman-space-sm);
  --ui-space-md: var(--aman-space-md);
  --ui-space-14: var(--aman-space-14);
  --ui-space-lg: var(--aman-space-lg);
  --ui-space-xl: var(--aman-space-xl);
  --ui-space-2xl: var(--aman-space-2xl);

  --ui-font-xs: var(--aman-font-size-xs);
  --ui-font-sm: var(--aman-font-size-sm);
  --ui-font-md: var(--aman-font-size-md);
  --ui-font-lg: var(--aman-font-size-lg);
  --ui-font-xl: var(--aman-font-size-xl);
  --ui-line-tight: 1.25;
  --aman-line-tight: var(--ui-line-tight);
  --ui-line-normal: var(--aman-line-height);

  --aman-page-x: 24px;
  --aman-page-y: 16px;
  --aman-header-gap: 16px;
  --ui-page-x: var(--aman-page-x);
  --ui-page-y: var(--aman-page-y);
  --ui-page-gap: var(--aman-header-gap);
  --ui-page-bottom: 56px;
  --ui-page-header-gap: var(--ml-action-row-gap);
  --ui-lookup-max-width: 760px;
  --ui-lookup-page-bottom: 54px;
  --ui-lookup-mobile-page-x: var(--aman-space-md);
  --ui-lookup-mobile-page-top: var(--aman-space-14);
  --ui-lookup-mobile-page-bottom: var(--aman-space-xl);
  --ui-lookup-mobile-body-padding: var(--aman-space-lg);
  --ui-lookup-mobile-gap: var(--aman-space-10);

  --aman-form-card-padding: var(--aman-space-18);
  --aman-form-row-gap: var(--aman-space-md);
  --aman-form-section-gap: var(--aman-form-row-gap);
  --aman-form-field-gap: var(--aman-space-2xs);
  --aman-form-section-label-font-size: var(--aman-table-font-size);
  --aman-form-sub-label-font-size: var(--aman-font-size-base);
  --aman-form-label-font-size: var(--aman-form-sub-label-font-size);
  --aman-form-control-font-size: var(--aman-form-sub-label-font-size);
  --aman-form-link-font-size: var(--aman-form-sub-label-font-size);
  --aman-form-line-height: var(--aman-line-height);
  --aman-form-section-label-line-height: var(--aman-line-height);
  --aman-form-section-label-font-weight: var(--aman-font-weight-semibold);
  --aman-form-label-font-weight: var(--aman-font-weight-regular);
  --aman-form-control-font-weight: var(--aman-font-weight-regular);
  --aman-form-summary-value-font-weight: var(--aman-font-weight-regular);
  --aman-form-link-font-weight: var(--aman-font-weight-regular);
  --aman-form-action-font-weight: var(--aman-font-weight-semibold);
  --ml-action-row-gap: var(--aman-space-18);
  --aman-card-inner-padding: var(--aman-form-card-padding);
  --aman-card-section-gap: var(--aman-form-row-gap);
  --aman-card-field-gap: var(--aman-form-field-gap);
  --aman-card-stack-gap: var(--ml-action-row-gap);
  --ui-card-padding: var(--aman-card-inner-padding);
  --ui-card-radius: var(--aman-card-radius);
  --ui-card-gap: var(--aman-card-section-gap);
  --ui-section-gap: var(--aman-form-section-gap);
  --ui-form-row-gap: var(--aman-form-row-gap);
  --ui-form-column-gap: var(--ui-form-row-gap);
  --ui-form-grid-gap: var(--aman-space-sm);
  --ui-form-grid-column-gap: var(--ui-form-grid-gap);
  --ui-button-gap: var(--ui-form-column-gap);
  --ui-field-gap: var(--aman-form-field-gap);
  --ui-action-gap: var(--ml-action-row-gap);
  --ui-table-gap: var(--ml-action-row-gap);
  --ui-empty-gap: 0px;

  --aman-title-size: var(--aman-font-size-display);
  --aman-title-weight: var(--aman-font-weight-semibold);
  --aman-title-line: 1.25;
  --aman-title-gap: 16px;

  --aman-control-h: var(--aman-table-row-height);
  --aman-control-h-compact: 36px;
  --aman-control-h-dense: 34px;
  --aman-control-h-table: var(--aman-table-row-height);
  --aman-table-control-h: var(--aman-table-row-height);
  --aman-table-header-padding-y: 10px;
  --aman-table-header-padding-x: 8px;
  --aman-table-cell-field-gap: 4px;
  --aman-table-filter-padding-y: 0px;
  --aman-table-filter-padding-x: 0px;
  --aman-table-filter-field-padding-y: 0px;
  --aman-table-filter-field-padding-x: var(--aman-table-cell-field-gap);
  --aman-table-control-padding-x: var(--aman-input-padding-x);
  --aman-table-row-height: 41px;
  --aman-table-row-padding-y: 9px;
  --aman-table-row-padding-x: 8px;
  --ui-table-cell-y: var(--aman-table-row-padding-y);
  --ui-table-cell-x: var(--aman-table-row-padding-x);
  --ui-table-filter-cell-y: var(--aman-table-filter-padding-y);
  --ui-table-filter-cell-x: var(--aman-table-filter-padding-x);
  --ui-table-control-x: var(--aman-table-control-padding-x);
  --aman-table-font-size: 15px;
  --aman-table-filter-font-size: var(--aman-font-size-sm);
  --aman-table-line-height: var(--aman-line-height);
  --aman-table-header-font-weight: var(--aman-font-weight-semibold);
  --aman-table-body-font-weight: var(--aman-font-weight-regular);
  --aman-payment-history-table-font-size: var(--aman-font-size-lg);
  --aman-payment-history-info-font-size: 17px;
  --aman-payment-history-info-body-font-size: var(--aman-payment-history-table-font-size);
  --aman-payment-history-table-body-font-weight: var(--aman-font-weight-regular);
  --aman-table-sticky-z: 1600;
  --aman-modal-backdrop-z: 2300;
  --aman-modal-z: 2310;
  --aman-radius: 0;
  --aman-card-radius: var(--aman-radius);
  --aman-input-radius: var(--aman-radius);
  --aman-button-radius: var(--aman-radius);
  --ui-radius: var(--aman-radius);
  --ui-radius-sm: var(--aman-radius);
  --ui-radius-md: var(--aman-radius);
  --ui-radius-lg: var(--aman-radius);
  --ui-input-radius: var(--aman-input-radius);
  --ui-button-radius: var(--aman-button-radius);
  --aman-input-padding-x: var(--aman-space-14);
  --aman-button-padding-y: 0;
  --aman-button-padding-x: var(--aman-space-14);
  --aman-action-button-height: var(--aman-control-h);
  --aman-action-button-font-size: var(--aman-font-size-base);
  --aman-action-button-font-weight: var(--aman-font-weight-semibold);
  --aman-action-button-line-height: var(--aman-line-height);
  --aman-tab-label-font-size: var(--aman-font-size-lg);
  --aman-tab-label-line-height: var(--aman-line-height);
  --aman-tab-text-underline-thickness: 1px;
  --aman-tab-text-underline-offset: 0.12em;
  --aman-modal-padding: 36px;
  --aman-modal-pad-x: 32px;
  --aman-modal-pad-top: 30px;
  --aman-modal-pad-bottom: 30px;
  --aman-modal-header-gap: var(--aman-space-lg);
  --aman-modal-body-gap: var(--aman-space-lg);
  --aman-modal-footer-gap: var(--aman-space-lg);
  --ui-control-height: var(--aman-control-h);
  --ui-control-height-compact: var(--aman-control-h-compact);
  --ui-control-height-dense: var(--aman-control-h-dense);
  --ui-control-height-table: var(--aman-control-h-table);
  --ui-table-control-height: var(--aman-table-control-h);
  --ui-button-height: var(--ui-control-height);
  --ui-action-button-height: var(--ui-button-height);
  --ui-modal-padding: var(--aman-modal-padding);
  --aman-shadow: none;
  --aman-card-shadow: var(--aman-shadow);
  --aman-shadow-md: var(--aman-shadow);
  --aman-shadow-sticky: var(--aman-shadow);
  --aman-shadow-float: 0 12px 28px color-mix(in srgb, var(--color-ink) 12%, transparent);
  --aman-shadow-overlay: 0 20px 60px color-mix(in srgb, var(--color-ink) 18%, transparent);
  --aman-overlay: color-mix(in srgb, var(--color-ink) 28%, transparent);
  --aman-overlay-strong: color-mix(in srgb, var(--color-ink) 34%, transparent);

  /* Legacy aliases. These let older Blade/CSS move toward the new tokens
     without a risky all-at-once selector rewrite. */
  --bg: var(--aman-bg);
  --surface: var(--aman-surface);
  --text: var(--aman-text-strong);
  --ink: var(--aman-text);
  --muted: var(--aman-muted);
  --muted-2: var(--aman-muted-soft);
  --border: var(--aman-line);
  --line: var(--aman-line);
  --line-strong: var(--aman-line-strong);
  --action: var(--aman-action);
  --accent: var(--aman-green);
  --accent-bg: var(--aman-green-wash);
  --charcoal: var(--aman-action);
  --charcoal-hover: var(--aman-action-hover);
  --cta: var(--aman-action);
  --cta-hover: var(--aman-action-hover);
  --cta-text: var(--color-paper);
  --error: var(--aman-danger);
  --error-bg: var(--aman-danger-wash);
  --error-text: var(--aman-danger-hover);
  --status-aman-green: var(--aman-green);
  --status-aman-green-bg: var(--aman-green-soft);
  --ml-link-hover: var(--aman-green-hover);
  --ml-aman-green: var(--aman-green);
  --ml-aman-green-soft: var(--aman-green-wash);
  --ml-aman-green-line: var(--aman-green-line);
  --ml-aman-danger: var(--aman-danger);
  --ml-page-x: var(--aman-page-x);
  --ml-page-title-size: var(--aman-title-size);
  --ml-page-title-line: var(--aman-title-line);
  --ml-page-title-gap: var(--ml-action-row-gap);
  --ml-page-start-gap: var(--aman-header-gap);

  --bs-body-bg: var(--aman-bg);
  --bs-body-color: var(--aman-text);
  --bs-border-color: var(--aman-line);
  --bs-link-color: var(--aman-text);
  --bs-link-hover-color: var(--aman-green-hover);
  --bs-primary: var(--aman-action);
  --bs-primary-rgb: var(--color-ink-rgb);
  --bs-secondary: var(--aman-muted);
  --bs-secondary-rgb: var(--color-ink-rgb);
  --bs-success: var(--aman-green);
  --bs-success-rgb: var(--color-green-rgb);
  --bs-info: var(--aman-info);
  --bs-info-rgb: var(--color-blue-rgb);
  --bs-warning: var(--aman-warning);
  --bs-warning-rgb: var(--color-gold-rgb);
  --bs-danger: var(--aman-danger);
  --bs-danger-rgb: var(--color-red-rgb);
  --bs-light: var(--aman-wash);
  --bs-light-rgb: var(--color-ground-rgb);
  --bs-dark: var(--aman-action);
  --bs-dark-rgb: var(--color-ink-rgb);
}
