// ============================================================================
// Components | Summary
// ============================================================================

@use "../../../dev" as *;
@use "../../../variables" as *;

@use "../../head_layout" as *;

@use "../../soul_type" as *;

/// Base styles for the `<details>` element
/// @group Summary
@mixin summary--details {
    display: block;
}

/// Base styles for the `<summary>` element
/// @group Summary
@mixin summary--base {
    display: flex;
    outline: none;
    list-style: none;
    cursor: pointer;
}

/// Hides browser default disclosure arrows
/// @group Summary
@mixin summary--hide-default-icon {
    details > summary::marker,
    summary::marker,
    details summary::-webkit-details-marker,
    details > summary::-webkit-details-marker {
        display: none;
    }
}

/// Combined mixin for summary + details
/// @group Summary
@mixin summary--widget {
    @include summary--details;
    @include summary--base;
    @include summary--hide-default-icon;
}