import styled from "styled-components";
import { popoverClasses } from "../../../Popover";
import { addFocus } from "../../../../mixins";
import { classes, innerTokens, tokens } from "../../Calendar.tokens";
import { addActive, addSelected, flexCenter } from "../../mixins";
var inRange = function inRange() {
    return "\n    &:before {\n        content: '';\n        z-index: -1;\n        position: absolute;\n        width: 100%;\n        height: calc(100% - 0.125rem);\n        background: var(".concat(tokens.calendarRangeBackground, ");\n    }\n");
};
var sideInRange = function sideInRange() {
    return "\n    &:before {\n        content: '';\n        z-index: -1;\n        position: absolute;\n        width: 0.75rem;\n        height: calc(100% - 0.125rem);\n        background: var(".concat(tokens.calendarRangeBackground, ");\n    }\n");
};
export var StyledItem = styled.div.withConfig({
    displayName: "DateStructureItem.styles__StyledItem",
    componentId: "sc-2dcb7de8-0"
})([
    "border-radius:calc(var(",
    ") - 0.125rem);",
    ";&.",
    "{",
    ";}&.",
    "{",
    ";}&.",
    "{&:before{left:",
    ";}}&.",
    "{&:before{right:",
    ";}}"
], innerTokens.dateStructureBorderRadius, String(flexCenter), String(classes.inRange), inRange(), String(classes.sideInRange), sideInRange(), String(classes.sideLeft), function(param) {
    var offset = param.offset;
    return "".concat(offset, "px");
}, String(classes.sideRight), function(param) {
    var offset = param.offset;
    return "".concat(offset, "px");
});
var disabledItem = function disabledItem() {
    return "\n    cursor: not-allowed;\n    opacity: var(".concat(tokens.calendarDisabledOpacity, ");\n");
};
var disabledCurrentItem = function disabledCurrentItem() {
    return "\n    ".concat(disabledItem(), ";\n");
};
export var StyledItemRoot = styled.div.withConfig({
    displayName: "DateStructureItem.styles__StyledItemRoot",
    componentId: "sc-2dcb7de8-1"
})([
    "font-family:var(",
    ");font-size:var(",
    ");font-style:var(",
    ");font-weight:var(",
    ");letter-spacing:var(",
    ");line-height:var(",
    ");position:relative;box-sizing:border-box;border-radius:var(",
    ");",
    ";color:",
    ";&.",
    "{",
    ";",
    ";&.",
    "{",
    ";}}&.",
    ":not(.",
    "){",
    ";}&.",
    "{color:var(",
    ");}&.",
    "{color:",
    ";",
    ";}&.",
    "{color:",
    ";",
    ";}&.",
    "{& > .",
    ":before{width:calc(100% + 2px);height:100%;}& > .",
    ":before{width:100%;right:-1px;left:unset;}& > .",
    ":before{width:100%;left:-1px;right:unset;}}& .",
    ".",
    "{z-index:-1;width:100%;}"
], innerTokens.dateStructureFontFamily, innerTokens.dateStructureFontSize, innerTokens.dateStructureFontStyle, innerTokens.dateStructureFontWeight, innerTokens.dateStructureFontLetterSpacing, innerTokens.dateStructureFontLineHeight, innerTokens.dateStructureBorderRadius, String(flexCenter), function(param) {
    var isDayInCurrentMonth = param.isDayInCurrentMonth;
    return isDayInCurrentMonth ? "var(".concat(tokens.calendarContentPrimaryColor, ")") : "var(".concat(tokens.calendarContentSecondaryColor, ")");
}, String(classes.selectableItem), addSelected({
    minWidth: 'calc(100% - 0.125rem)',
    minHeight: 'calc(100% - 0.125rem)',
    selectedFontWeight: "var(".concat(innerTokens.dateStructureSelectedFontWeight, ")"),
    selectedBackground: "var(".concat(tokens.calendarSelectedItemBackground, ")"),
    selectedColor: "var(".concat(tokens.calendarSelectedItemColor, ")"),
    selectableBackgroundHover: "var(".concat(tokens.calendarSelectableItemBackgroundHover, ")"),
    currentBorderColor: "var(".concat(tokens.calendarCurrentItemBorderColor, ")"),
    currentBorderWidth: "var(".concat(tokens.calendarCurrentItemBorderWidth, ")"),
    activeBackground: "var(".concat(tokens.calendarActiveItemBackground, ")"),
    activeColor: "var(".concat(tokens.calendarActiveItemColor, ")")
}), addFocus({
    outlineSize: '0.063rem',
    outlineOffset: '-0.125rem',
    outlineColor: "var(".concat(tokens.calendarOutlineFocusColor, ")"),
    outlineRadius: "calc(var(".concat(innerTokens.dateStructureBorderRadius, ") + 0.125rem)")
}), classes.currentItem, addFocus({
    outlineSize: '0.063rem',
    outlineOffset: '-0.1875rem',
    outlineColor: "var(".concat(tokens.calendarOutlineFocusColor, ")"),
    outlineRadius: "calc(var(".concat(innerTokens.dateStructureBorderRadius, ") + 0.125rem)")
}), classes.dayInCurrentMonth, classes.disabled, addActive({
    activeBackground: "var(".concat(tokens.calendarActiveItemBackground, ")"),
    activeColor: "var(".concat(tokens.calendarActiveItemColor, ")"),
    activeFontWeight: "var(".concat(innerTokens.dateStructureSelectedFontWeight, ")")
}), classes.dayOfWeek, tokens.calendarDayOfWeekColor, classes.disabled, function(param) {
    var isDayInCurrentMonth = param.isDayInCurrentMonth;
    return isDayInCurrentMonth ? "var(".concat(tokens.calendarContentPrimaryDisabledColor, ")") : "var(".concat(tokens.calendarContentSecondaryDisabledColor, ")");
}, disabledItem(), classes.disabledCurrent, function(param) {
    var isDayInCurrentMonth = param.isDayInCurrentMonth;
    return isDayInCurrentMonth ? "var(".concat(tokens.calendarContentPrimaryDisabledColor, ")") : "var(".concat(tokens.calendarContentSecondaryDisabledColor, ")");
}, disabledCurrentItem(), classes.currentItem, classes.inRange, classes.sideRight, classes.sideLeft, popoverClasses.wrapper, popoverClasses.targetAsRef);
export var StyledEvents = styled.div.withConfig({
    displayName: "DateStructureItem.styles__StyledEvents",
    componentId: "sc-2dcb7de8-2"
})([
    "display:flex;position:absolute;bottom:var(",
    ",0.25rem);"
], tokens.calendarEventItemBottom);
export var StyledEvent = styled.div.withConfig({
    displayName: "DateStructureItem.styles__StyledEvent",
    componentId: "sc-2dcb7de8-3"
})([
    "margin:0 0.063rem;width:0.188rem;height:0.188rem;border-radius:50%;background-color:",
    ";"
], function(param) {
    var _param_color = param.color, color = _param_color === void 0 ? 'var(--plasma-colors-accent, var(--surface-accent))' : _param_color;
    return color;
});
