@import '../light/button-group';
////
/// @group schemas
/// @access private
/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
////


/// Generates the base dark button-group schema.
/// @type {Map}
/// @prop {Color} item-background [#222] - The background color for button group items .
$_base-dark-button-group: (
    item-background: #222,

    item-border-color: (
        igx-color: ('grays', 400),
        hexrgba: (#222)
    ),

    item-selected-border-color: (
        igx-color: ('grays', 500),
        hexrgba: (#222)
    ),

    item-disabled-border: (
        igx-color: ('grays', 400),
        hexrgba: (#222)
    ),
);

/// Generates a dark button-group schema based on a mix of $_light-button-group and $_base-dark-button-group
/// @type {Map}
/// @requires {function} extend
/// @requires $_light-button-group
/// @requires $_base-dark-button-group
/// @see $default-palette
$_dark-button-group: extend($_light-button-group, $_base-dark-button-group);

/// Generates a dark fluent button-group schema based on a mix of $_fluent-button-group and $_base-dark-button-group
/// @type {Map}
///
/// @prop {map} item-border-color [igx-color: ('grays', 100), hexrgba: #000] - The border color for button group items.
/// @prop {map} item-selected-border-color [igx-color: ('grays', 100), hexrgba: #000] - The border color for button group selected items.
/// @prop {map} item-disabled-border: [igx-color: ('grays', 100), hexrgba: #000] - The border color for button group disabled items.
/// @prop {map} item-text-color [igx-color: ('grays', 900)] - The text color for button group items.
/// @prop {map} item-hover-text-color [igx-color: ('primary', 200)] - The text color for button group items on hover.
/// @prop {Color} item-hover-background [#222] - The background color for button group items on hover.
/// @prop {map} item-selected-background [igx-color: ('grays', 100)] - The background color for button group selected items.
/// @prop {map} item-selected-hover-background [igx-color: ('grays', 100)] - The background color for button group selected items on hover.
/// @prop {map} item-selected-hover-background [igx-color: ('primary', 200)] - The text color for button group selected items.
/// @prop {Color} item-hover-background [#222] - The background color for button group disabled items.
///
/// @requires {function} extend
/// @requires $_fluent-button-group
/// @requires $_base-dark-button-group
$_dark-fluent-button-group: extend(
    $_fluent-button-group,
    $_base-dark-button-group,
    (
        item-border-color: (
            igx-color: ('grays', 100),
            hexrgba: #000
        ),

        item-selected-border-color: (
            igx-color: ('grays', 100),
            hexrgba: #000
        ),

        item-disabled-border: (
            igx-color: ('grays', 100),
            hexrgba: #000
        ),

        item-text-color: (
            igx-color: ('grays', 900)
        ),

        item-hover-text-color: (
            igx-color: ('primary', 200)
        ),

        item-hover-background: #222,

        item-selected-background: (
            igx-color: ('grays', 100)
        ),

        item-selected-hover-background: (
            igx-color: ('grays', 100)
        ),

        item-selected-text-color: (
            igx-color: ('primary', 200)
        ),

        disabled-background-color: #222,
    )
);