/*
  FNB skin-driven theme tokens.
  Source values aligned to assets/skins/FNB/fnb_light.css and fnb_dark.css.
  This file intentionally defines tokens only (no utility class overrides).
*/

:root:not([data-skin]):not([data-theme]),
:root:not([data-skin])[data-theme="light"],
:root[data-skin="fnb"]:not([data-theme]),
:root[data-skin="fnb"][data-theme="light"],
html[data-skin="fnb"][data-theme="light"],
body[data-skin="fnb"][data-theme="light"] {
  --background: #FFFFFF;
  --foreground: #FFFFFF;
  --paper: #FFFFFF;
  --paper-rgb: 255, 255, 255;
  --ink: #000000;
  --ink-rgb: 0, 0, 0;
  --glass: rgba(255, 255, 255, 0);
  --universal: #949494;
  --page: #F6F6F6;
  --icon-container: #D3DCDC;
  --highlight: #FA791F;
  --error: #BA1D1B;
  --success: #1C6B32;

  --action-super-light: #FFE7D7;
  --action-ultra-light: #FBC9A5;
  --action-extra-light: #F8AF79;
  --action-light: #F6944C;
  --action-base: #FA791F;
  --action-dark: #C36119;
  --action-extra-dark: #924913;
  --action-ultra-dark: #62300C;

  --primary-super-light: #B0D8D8;
  --primary-ultra-light: #85CCCC;
  --primary-extra-light: #5FC1C1;
  --primary-light: #33ADAD;
  --primary-base: #009999;
  --primary-dark: #007A7A;
  --primary-extra-dark: #005C5C;
  --primary-ultra-dark: #193435;

  --ghost-super-light: #E9E9E9;
  --ghost-ultra-light: #BEC3C3;
  --ghost-extra-light: #A9AFB0;
  --ghost-light: #8C9495;
  --ghost-base: #6F797B;
  --ghost-dark: #40484A;
  --ghost-extra-dark: #383D3E;
  --ghost-ultra-dark: #202124;

  /* Backwards compatibility alias used by existing components */
  --base: var(--action-base);

  /* Radius tokens */
  --radius-none: 0px;
  --radius-sm: 2px;
  --radius: 4px;
  --radius-5: 5px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-10: 10px;
  --radius-xl: 12px;
  --radius-14: 14px;
  --radius-15: 15px;
  --radius-2xl: 16px;
  --radius-18: 18px;
  --radius-20: 20px;
  --radius-3xl: 24px;
  --radius-25: 25px;
  --radius-26: 26px;
  --radius-full: 9999px;
  --radius-template: 12px;
  --radius-component: 12px;
  --radius-button: 20px;
}

:root:not([data-skin])[data-theme="dark"],
:root[data-skin="fnb"][data-theme="dark"],
html[data-skin="fnb"][data-theme="dark"],
body[data-skin="fnb"][data-theme="dark"] {
  --background: #121212;
  --foreground: #121212;
  --paper: #1E1E1E;
  --paper-rgb: 33, 33, 33;
  --ink: #FFFFFF;
  --ink-rgb: 255, 255, 255;
  --glass: rgba(255, 255, 255, 0);
  --universal: #949494;
  --page: #121212;
  --icon-container: #D3DCDC;
  --highlight: #F4791F;
  --error: #BA1D1B;
  --success: #82D395;

  --action-super-light: #FFE7D7;
  --action-ultra-light: #FBC9A5;
  --action-extra-light: #F8AF79;
  --action-light: #F6944C;
  --action-base: #FA791F;
  --action-dark: #C36119;
  --action-extra-dark: #924913;
  --action-ultra-dark: #62300C;

  --primary-super-light: #B0D8D8;
  --primary-ultra-light: #85CCCC;
  --primary-extra-light: #5FC1C1;
  --primary-light: #33ADAD;
  --primary-base: #009999;
  --primary-dark: #007A7A;
  --primary-extra-dark: #005C5C;
  --primary-ultra-dark: #193435;

  --ghost-super-light: #E9E9E9;
  --ghost-ultra-light: #BEC3C3;
  --ghost-extra-light: #A9AFB0;
  --ghost-light: #8C9495;
  --ghost-base: #6F797B;
  --ghost-dark: #40484A;
  --ghost-extra-dark: #383D3E;
  --ghost-ultra-dark: #202124;

  --base: var(--action-base);

  /* Radius tokens */
  --radius-none: 0px;
  --radius-sm: 2px;
  --radius: 4px;
  --radius-5: 5px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-10: 10px;
  --radius-xl: 12px;
  --radius-14: 14px;
  --radius-15: 15px;
  --radius-2xl: 16px;
  --radius-18: 18px;
  --radius-20: 20px;
  --radius-3xl: 24px;
  --radius-25: 25px;
  --radius-26: 26px;
  --radius-full: 9999px;
  --radius-template: 12px;
  --radius-component: 12px;
  --radius-button: 20px;
}
