'use client';

import { tokens } from '@fluentui/react-theme';
import { ACTIVEDESCENDANT_FOCUSVISIBLE_ATTRIBUTE } from '@fluentui/react-aria';
import { __styles, mergeClasses, shorthands } from '@griffel/react';
export const optionClassNames = {
  root: 'fui-Option',
  checkIcon: 'fui-Option__checkIcon'
};
/**
 * Styles for the root slot
 */
const useStyles = /*#__PURE__*/__styles({
  root: {
    Bt984gj: "f122n59",
    Beyfa6y: 0,
    Bbmb7ep: 0,
    Btl43ni: 0,
    B7oj6ja: 0,
    Dimara: "ft85np5",
    sj55zd: "f19n0e5",
    i8kkvl: "f1ufnopg",
    Bceei9c: "f1k6fduh",
    mc9l5x: "f22iagw",
    Bahqtrf: "fk6fouc",
    Be2twd7: "fkhj508",
    Bg96gwp: "f1i3iumi",
    Byoj8tv: 0,
    uwmqm3: 0,
    z189sj: 0,
    z8tnut: 0,
    B0ocmuz: "fm5eomj",
    qhf8xq: "f10pi13n",
    Jwef8y: "f1knas48",
    Bi91k9c: "feu1g3u",
    zqbkvg: "fo79ri9",
    h82x05: ["f1osiabc", "f1e8le25"],
    cqj998: "f1yusjty",
    j3hlsh: ["f1e8le25", "f1osiabc"],
    ecr2s2: "fb40n2d",
    lj723h: "f1g4hkjv",
    Btxx2vb: "f1lnr2zp",
    sltcwy: ["f1ogfk9z", "f1g7j8ec"],
    dnwvvm: "fiuf46r",
    Blyvkvs: ["f1g7j8ec", "f1ogfk9z"]
  },
  active: {
    Bowz1zl: "f11vrvdw",
    oxogb1: "f17hxjb7",
    Ix2sn8: "f1dha69c",
    q7v32p: "f1lm7500",
    B7cbj04: 0,
    Bewtojm: 0,
    b50fsz: 0,
    B1wzb3v: 0,
    Bqwk70n: 0,
    B37u8z8: 0,
    avt0cx: 0,
    f0sref: 0,
    B9fkznv: 0,
    Be3o27t: 0,
    Bertapg: 0,
    B53xpsf: 0,
    Bsv72rj: 0,
    B39dzdd: 0,
    Btq9bd3: 0,
    Bqfxd14: 0,
    atup0s: "fo7xqb",
    Fffuxt: 0,
    Bttcd12: 0,
    Beitzug: 0,
    Bqougee: 0,
    B86i8pi: "f1kurthe",
    Bhijsxg: "fwq15dy",
    kktds4: "f1pb3wry",
    Bmau3bo: ["ftjv2f4", "f1flhb1f"],
    npektv: ["f1flhb1f", "ftjv2f4"]
  },
  disabled: {
    sj55zd: "f1s2aq7o",
    Jwef8y: "f9ql6rf",
    Bi91k9c: "fvgxktp",
    zqbkvg: "f185j3qj",
    h82x05: ["f1dligi3", "f1vydzie"],
    cqj998: "fjw1di3",
    j3hlsh: ["f1vydzie", "f1dligi3"],
    ecr2s2: "fgj9um3",
    lj723h: "f19wldhg",
    Btxx2vb: "f1ss0kt2",
    sltcwy: ["f1t6oli3", "fjy9ci8"],
    dnwvvm: "fresaxk",
    Blyvkvs: ["fjy9ci8", "f1t6oli3"],
    B7iucu3: "f1cyfu5x"
  },
  selected: {},
  checkIcon: {
    Bnnss6s: "fi64zpg",
    Be2twd7: "fod5ikn",
    Frg6f3: ["f18b9hdq", "fn6qj8t"],
    t21cq0: ["f1xk557c", "f1h9en5y"],
    Bcdw1i0: "fd7fpy0",
    Bo70h7d: "fvc9v3g"
  },
  selectedCheck: {
    Bcdw1i0: "f1022m68"
  },
  multiselectCheck: {
    Bgfg5da: 0,
    B9xav0g: 0,
    oivjwe: 0,
    Bn0qgzm: 0,
    B4g9neb: 0,
    zhjwy3: 0,
    wvpqe5: 0,
    ibv6hh: 0,
    u1mtju: 0,
    h3c5rm: 0,
    vrafjx: 0,
    Bekrc4i: 0,
    i8vvqc: 0,
    g2u3we: 0,
    icvyot: 0,
    B4j52fo: 0,
    irswps: "f1l3cf7o",
    Beyfa6y: 0,
    Bbmb7ep: 0,
    Btl43ni: 0,
    B7oj6ja: 0,
    Dimara: "fq9zq91",
    B7ck84d: "f1ewtqcl",
    mc9l5x: "f22iagw",
    Bt984gj: "f122n59",
    Brf1p80: "f4d9j23",
    Bkfmm31: "f1w9h62z",
    Be2twd7: "f1ugzwwg",
    Bqenvij: "fd461yt",
    a9b677: "fjw5fx7",
    Bcdw1i0: "f1022m68"
  },
  selectedMultiselectCheck: {
    De3pzq: "ftywsgz",
    sj55zd: "fqpbvvt",
    g2u3we: "f3xi7mh",
    h3c5rm: ["ftovhe4", "f1wczvin"],
    B9xav0g: "f68vbr6",
    zhjwy3: ["f1wczvin", "ftovhe4"]
  },
  checkDisabled: {
    sj55zd: "f1s2aq7o",
    B7iucu3: "f1cyfu5x"
  },
  multiselectCheckDisabled: {
    g2u3we: "f1r1t4y1",
    h3c5rm: ["fmj8ijw", "figx54m"],
    B9xav0g: "f360ss8",
    zhjwy3: ["figx54m", "fmj8ijw"]
  }
}, {
  d: [".f122n59{align-items:center;}", [".ft85np5{border-radius:var(--borderRadiusMedium);}", {
    p: -1
  }], ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1ufnopg{column-gap:var(--spacingHorizontalXS);}", ".f1k6fduh{cursor:pointer;}", ".f22iagw{display:flex;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", [".fm5eomj{padding:var(--spacingVerticalSNudge) var(--spacingHorizontalS);}", {
    p: -1
  }], ".f10pi13n{position:relative;}", ".f11vrvdw[data-activedescendant-focusvisible]::after{content:\"\";}", ".f17hxjb7[data-activedescendant-focusvisible]::after{position:absolute;}", ".f1dha69c[data-activedescendant-focusvisible]::after{pointer-events:none;}", ".f1lm7500[data-activedescendant-focusvisible]::after{z-index:1;}", [".fo7xqb[data-activedescendant-focusvisible]::after{border:2px solid var(--colorStrokeFocus2);}", {
    p: -2
  }], [".f1kurthe[data-activedescendant-focusvisible]::after{border-radius:var(--borderRadiusMedium);}", {
    p: -1
  }], ".fwq15dy[data-activedescendant-focusvisible]::after{top:-2px;}", ".f1pb3wry[data-activedescendant-focusvisible]::after{bottom:-2px;}", ".ftjv2f4[data-activedescendant-focusvisible]::after{left:-2px;}", ".f1flhb1f[data-activedescendant-focusvisible]::after{right:-2px;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".fi64zpg{flex-shrink:0;}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".f18b9hdq{margin-left:calc(var(--spacingHorizontalXXS) * -1);}", ".fn6qj8t{margin-right:calc(var(--spacingHorizontalXXS) * -1);}", ".f1xk557c{margin-right:var(--spacingHorizontalXXS);}", ".f1h9en5y{margin-left:var(--spacingHorizontalXXS);}", ".fd7fpy0{visibility:hidden;}", ".fvc9v3g svg{display:block;}", ".f1022m68{visibility:visible;}", [".f1l3cf7o{border:var(--strokeWidthThin) solid var(--colorNeutralStrokeAccessible);}", {
    p: -2
  }], [".fq9zq91{border-radius:var(--borderRadiusSmall);}", {
    p: -1
  }], ".f1ewtqcl{box-sizing:border-box;}", ".f4d9j23{justify-content:center;}", ".f1w9h62z{fill:currentColor;}", ".f1ugzwwg{font-size:12px;}", ".fd461yt{height:16px;}", ".fjw5fx7{width:16px;}", ".ftywsgz{background-color:var(--colorCompoundBrandBackground);}", ".fqpbvvt{color:var(--colorNeutralForegroundInverted);}", ".f3xi7mh{border-top-color:var(--colorCompoundBrandBackground);}", ".ftovhe4{border-right-color:var(--colorCompoundBrandBackground);}", ".f1wczvin{border-left-color:var(--colorCompoundBrandBackground);}", ".f68vbr6{border-bottom-color:var(--colorCompoundBrandBackground);}", ".f1r1t4y1{border-top-color:var(--colorNeutralForegroundDisabled);}", ".fmj8ijw{border-right-color:var(--colorNeutralForegroundDisabled);}", ".figx54m{border-left-color:var(--colorNeutralForegroundDisabled);}", ".f360ss8{border-bottom-color:var(--colorNeutralForegroundDisabled);}"],
  h: [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".feu1g3u:hover{color:var(--colorNeutralForeground1Hover);}", ".fo79ri9:hover .fui-Option__checkIcon{border-top-color:var(--colorNeutralForeground1Hover);}", ".f1osiabc:hover .fui-Option__checkIcon{border-right-color:var(--colorNeutralForeground1Hover);}", ".f1e8le25:hover .fui-Option__checkIcon{border-left-color:var(--colorNeutralForeground1Hover);}", ".f1yusjty:hover .fui-Option__checkIcon{border-bottom-color:var(--colorNeutralForeground1Hover);}", ".f9ql6rf:hover{background-color:var(--colorTransparentBackground);}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}", ".f185j3qj:hover .fui-Option__checkIcon{border-top-color:var(--colorNeutralForegroundDisabled);}", ".f1dligi3:hover .fui-Option__checkIcon{border-right-color:var(--colorNeutralForegroundDisabled);}", ".f1vydzie:hover .fui-Option__checkIcon{border-left-color:var(--colorNeutralForegroundDisabled);}", ".fjw1di3:hover .fui-Option__checkIcon{border-bottom-color:var(--colorNeutralForegroundDisabled);}"],
  a: [".fb40n2d:active{background-color:var(--colorNeutralBackground1Pressed);}", ".f1g4hkjv:active{color:var(--colorNeutralForeground1Pressed);}", ".f1lnr2zp:active .fui-Option__checkIcon{border-top-color:var(--colorNeutralForeground1Hover);}", ".f1ogfk9z:active .fui-Option__checkIcon{border-right-color:var(--colorNeutralForeground1Hover);}", ".f1g7j8ec:active .fui-Option__checkIcon{border-left-color:var(--colorNeutralForeground1Hover);}", ".fiuf46r:active .fui-Option__checkIcon{border-bottom-color:var(--colorNeutralForeground1Hover);}", ".fgj9um3:active{background-color:var(--colorTransparentBackground);}", ".f19wldhg:active{color:var(--colorNeutralForegroundDisabled);}", ".f1ss0kt2:active .fui-Option__checkIcon{border-top-color:var(--colorNeutralForegroundDisabled);}", ".f1t6oli3:active .fui-Option__checkIcon{border-right-color:var(--colorNeutralForegroundDisabled);}", ".fjy9ci8:active .fui-Option__checkIcon{border-left-color:var(--colorNeutralForegroundDisabled);}", ".fresaxk:active .fui-Option__checkIcon{border-bottom-color:var(--colorNeutralForegroundDisabled);}"],
  m: [["@media (forced-colors: active){.f1cyfu5x{color:GrayText;}}", {
    m: "(forced-colors: active)"
  }]]
});
/**
 * Apply styling to the Option slots based on the state
 */
export const useOptionStyles_unstable = state => {
  'use no memo';

  const {
    disabled,
    multiselect,
    selected
  } = state;
  const styles = useStyles();
  state.root.className = mergeClasses(optionClassNames.root, styles.root, styles.active, disabled && styles.disabled, selected && styles.selected, state.root.className);
  if (state.checkIcon) {
    state.checkIcon.className = mergeClasses(optionClassNames.checkIcon, styles.checkIcon, multiselect && styles.multiselectCheck, selected && styles.selectedCheck, selected && multiselect && styles.selectedMultiselectCheck, disabled && styles.checkDisabled, disabled && multiselect && styles.multiselectCheckDisabled, state.checkIcon.className);
  }
  return state;
};