import styled from "@emotion/styled";
import { component, mergeConfig } from "../../../../engines";
import { addFocus } from "../../../../mixins";
import { classes, tokens } from "../../Calendar.tokens";
import { iconButtonConfig, iconButtonTokens } from "../../../IconButton";
import { flexCenter } from "../../mixins";
import { IconDisclosureDownFill } from "../../../_Icon";
const mergedIconButtonConfig = mergeConfig(iconButtonConfig);
const IconButton = component(mergedIconButtonConfig);
export const StyledCalendarHeader = /*#__PURE__*/ styled("div", {
    target: "efld0qd0",
    label: "StyledCalendarHeader"
})("display:flex;justify-content:space-between;align-items:center;padding:var(", tokens.calendarHeaderWrapperPadding, ");");
export const StyledHeader = /*#__PURE__*/ styled("button", {
    target: "efld0qd1",
    label: "StyledHeader"
})("border:none;background-color:transparent;padding:0;outline:none;font-family:var(", tokens.calendarHeaderFontFamily, ");font-size:var(", tokens.calendarHeaderFontSize, ");font-style:var(", tokens.calendarHeaderFontStyle, ");font-weight:var(", tokens.calendarHeaderFontWeightBold, ");letter-spacing:var(", tokens.calendarHeaderFontLetterSpacing, ");line-height:var(", tokens.calendarHeaderFontLineHeight, ");padding:var(", tokens.calendarHeaderPadding, ");color:var(", tokens.calendarContentPrimaryColor, ");cursor:pointer;display:flex;gap:var(", tokens.calendarHeaderDateGap, ");justify-content:space-between;align-items:center;&:hover,&:active{color:var(", tokens.calendarContentSecondaryColor, ");}", addFocus({
    outlineSize: '0.063rem',
    outlineOffset: '0.125rem',
    outlineColor: `var(${tokens.calendarOutlineFocusColor})`,
    outlineRadius: '0.563rem'
}), ";");
export const StyledHeaderDate = /*#__PURE__*/ styled("span", {
    target: "efld0qd2",
    label: "StyledHeaderDate"
})(flexCenter, ";pointer-events:none;");
export const StyledArrows = /*#__PURE__*/ styled("div", {
    target: "efld0qd3",
    label: "StyledArrows"
})("display:flex;gap:var(", tokens.calendarHeaderArrowGap, ");padding:var(", tokens.calendarHeaderArrowPadding, ");");
// NOTE: переопределение токенов IconButton
export const StyledArrow = /*#__PURE__*/ styled(IconButton, {
    target: "efld0qd4",
    label: "StyledArrow"
})(iconButtonTokens.iconButtonColor, ":var(", tokens.iconButtonColor, ");", iconButtonTokens.iconButtonBackgroundColor, ":var(", tokens.iconButtonBackgroundColor, ");", iconButtonTokens.iconButtonColorHover, ":var(", tokens.iconButtonColorHover, ");", iconButtonTokens.iconButtonBackgroundColorHover, ":var(", tokens.iconButtonBackgroundColorHover, ");", iconButtonTokens.iconButtonColorActive, ":var(", tokens.iconButtonColorActive, ");", iconButtonTokens.iconButtonBackgroundColorActive, ":var(", tokens.iconButtonBackgroundColorActive, ");", iconButtonTokens.iconButtonHeight, ":var(", tokens.iconButtonHeight, ");", iconButtonTokens.iconButtonWidth, ":var(", tokens.iconButtonWidth, ");", iconButtonTokens.iconButtonPadding, ":var(", tokens.iconButtonPadding, ");", iconButtonTokens.iconButtonRadius, ":var(", tokens.iconButtonRadius, ");", iconButtonTokens.iconButtonFocusColor, ":var(", tokens.iconButtonFocusColor, ");&.", classes.disabledPrevButton, "{cursor:not-allowed;opacity:0.4;&:hover,&:active{color:var(", tokens.iconButtonColor, ");}}");
export const StyledNavigation = /*#__PURE__*/ styled("div", {
    target: "efld0qd5",
    label: "StyledNavigation"
})("width:100%;", flexCenter, ";");
export const StyledDoubleHeaderWrapper = /*#__PURE__*/ styled("div", {
    target: "efld0qd6",
    label: "StyledDoubleHeaderWrapper"
})("width:100%;display:grid;align-items:center;grid-template-columns:var(", tokens.iconButtonWidth, ") 1fr var(", tokens.iconButtonWidth, ");grid-template-areas:'a b c';", StyledArrow, "{grid-area:a;}&.", classes.doubleHeaderLastDateWrapper, " ", StyledArrow, "{grid-area:c;}");
export const StyledHeaderDouble = /*#__PURE__*/ styled("button", {
    target: "efld0qd7",
    label: "StyledHeaderDouble"
})("border:none;background-color:transparent;padding:0;outline:none;font-family:var(", tokens.calendarHeaderFontFamily, ");font-size:var(", tokens.calendarHeaderFontSize, ");font-style:var(", tokens.calendarHeaderFontStyle, ");font-weight:var(", tokens.calendarHeaderFontWeightBold, ");letter-spacing:var(", tokens.calendarHeaderFontLetterSpacing, ");line-height:var(", tokens.calendarHeaderFontLineHeight, ");color:var(", tokens.calendarContentPrimaryColor, ");grid-area:b;justify-self:center;cursor:pointer;display:flex;gap:var(", tokens.calendarHeaderDateGap, ");justify-content:space-between;align-items:center;margin:0;height:fit-content;", String(flexCenter), ";", addFocus({
    outlineSize: '0.063rem',
    outlineOffset: '0.125rem',
    outlineColor: `var(${tokens.calendarOutlineFocusColor})`,
    outlineRadius: '0.563rem'
}), ";");
export const StyledHeaderArrow = /*#__PURE__*/ styled(IconDisclosureDownFill, {
    target: "efld0qd8",
    label: "StyledHeaderArrow"
})("color:var(", tokens.calendarHeaderArrowColor, ");");
