// /**
// * Copyright © Magento, Inc. All rights reserved.
// * See COPYING.txt for license details.
// */

//
// Messages
// _____________________________________________

.lib-message(@_message-type: info) {
@_message-background: "message-@{_message-type}__background";
@_message-border-color: "message-@{_message-type}__border-color";
@_message-color: "message-@{_message-type}__color";
@_message-link-color: "message-@{_message-type}-link__color";
@_message-link-color-hover: "message-@{_message-type}-link__color-hover";
@_message-link-color-active: "message-@{_message-type}-link__color-active";
@_message-icon-top: "message-@{_message-type}-icon__top";
@_message-icon-right: "message-@{_message-type}-icon__right";
@_message-icon-bottom: "message-@{_message-type}-icon__bottom";
@_message-icon-left: "message-@{_message-type}-icon__left";
._lib-message();
._lib-message-style(
@_message-color: @@_message-color,
@_message-background: @@_message-background,
@_message-link-color: @@_message-link-color,
@_message-link-color-hover: @@_message-link-color-hover,
@_message-link-color-active: @@_message-link-color-active,
@_message-border-color: @@_message-border-color
);
}

._lib-message(
@_message-padding: @message__padding,
@_message-margin: @message__margin,
@_message-border-radius: @message__border-radius
) {
.lib-css(border-radius, @_message-border-radius);
.lib-css(margin, @_message-margin);
.lib-css(padding, @_message-padding);
display: block;
.lib-typography(
@_color: @message__color,
@_font-size: @message__font-size,
@_font-family: @message__font-family,
@_font-weight: @message__font-weight,
@_font-style: @message__font-style,
@_line-height: @message__line-height
);
._lib-message-border(@message__border-width, @message__border-style);
}

._lib-message-style(
@_message-background: @message-info__background,
@_message-color: @message-info__color,
@_message-link-color: @message-info-link__color,
@_message-link-color-hover: @message-info-link__color-hover,
@_message-link-color-active: @message-info-link__color-active,
@_message-border-color: @message-info__border-color
) {
.lib-css(background, @_message-background);
.lib-css(border-color, @_message-border-color);
.lib-css(color, @_message-color);

a {
.lib-css(color, @_message-link-color);

&:hover {
.lib-css(color, @_message-link-color-hover);
}

&:active {
.lib-css(color, @_message-link-color-active);
}
}
}

._lib-message-border(
@_message-border-width: @message__border-width,
@_message-border-style: @message__border-style
) when not (@_message-border-width = 0)
and not (@_message-border-width = false)
and not (@_message-border-style = false) {
.lib-css(border, @_message-border-width @_message-border-style);
}

// Messages with lateral icon
.lib-message-icon-lateral(@_message-type: info, @_message-position: right) {
.lib-message(@_message-type);
@_message-icon-position: @_message-position;
@_message-icon: "message-@{_message-type}-icon";
@_message-icon-color: "message-@{_message-type}-icon__color-lateral";
@_message-icon-background: "message-@{_message-type}-icon__background";
@_message-icon-top: "message-@{_message-type}-icon__top";
@_message-icon-right: "message-@{_message-type}-icon__right";
@_message-icon-bottom: "message-@{_message-type}-icon__bottom";
@_message-icon-left: "message-@{_message-type}-icon__left";
._lib-message-icon-lateral(
@_message-icon-position,
@@_message-icon,
@@_message-icon-color,
@@_message-icon-background,
@@_message-icon-top,
@@_message-icon-left,
@@_message-icon-bottom,
@@_message-icon-right
);
}

// Messages with inner icon
.lib-message-icon-inner(@_message-type: info) {
.lib-message(@_message-type);
@_message-icon: "message-@{_message-type}-icon";
@_message-icon-color: "message-@{_message-type}-icon__color-inner";
@_message-icon-background: "message-@{_message-type}-icon__background";
@_message-icon-top: "message-@{_message-type}-icon__top";
@_message-icon-right: "message-@{_message-type}-icon__right";
@_message-icon-bottom: "message-@{_message-type}-icon__bottom";
@_message-icon-left: "message-@{_message-type}-icon__left";
._lib-message-icon-inner(
@@_message-icon,
@@_message-icon-color,
@@_message-icon-background,
@@_message-icon-top,
@@_message-icon-left,
@@_message-icon-bottom,
@@_message-icon-right
);
}

// Private mixins
._lib-message-icon-lateral(
@_message-icon-position,
@_message-icon,
@_message-icon-color,
@_message-icon-background,
@_message-icon-top,
@_message-icon-left,
@_message-icon-bottom,
@_message-icon-right
) {
position: relative;

&:before {
.lib-css(background, @_message-icon-background);
.lib-css(width, @message-icon__lateral-width);
content: '';
display: block;
height: 100%;
padding: 0;
position: absolute;
text-align: center;
top: 0;
}

> *:first-child {
&:before {
.lib-css(margin-top, -@message-icon__lateral-arrow-size);
content: '';
overflow: hidden;
position: absolute;
top: 50%;
}
}

> *:first-child {
&:after {
._lib-icon-font(
@_icon-font-content: @_message-icon,
@_icon-font: @icon-font,
@_icon-font-size: @message-icon__font-size,
@_icon-font-line-height: @message-icon__font-line-height,
@_icon-font-color: @_message-icon-color,
@_icon-font-margin: -@message-icon__font-size/2 0 0,
@_icon-font-vertical-align: @icon-font__vertical-align
);
.lib-css(bottom, @_message-icon-bottom);
.lib-css(left, @_message-icon-left);
.lib-css(right, @_message-icon-right);
.lib-css(top, @_message-icon-top);
.lib-css(width, @message-icon__lateral-width);
position: absolute;
text-align: center;
}
}

._lib-message-icon-lateral-position(
@_message-icon-position,
@_message-icon-background
);
}

._lib-message-icon-lateral-position(
@_message-icon-position,
@_message-icon-background
) when (@_message-icon-position = right) {
.lib-css(padding-right, @message-icon__lateral-width + @indent__s);

&:before {
right: 0;

._lib-message-icon-lateral-border-radius(@_message-icon-position);
}

> *:first-child {
&:before {
.lib-arrow(left, @message-icon__lateral-arrow-size, @_message-icon-background);
.lib-css(right, @message-icon__lateral-width);
}
}

> *:first-child {
&:after {
right: 0;
}
}
}

._lib-message-icon-lateral-position(
@_message-icon-position,
@_message-icon-background
) when (@_message-icon-position = left) {
.lib-css(padding-left, @message-icon__lateral-width + @indent__s);

&:before {
left: 0;
._lib-message-icon-lateral-border-radius(@_message-icon-position);
}

> *:first-child:before {
.lib-arrow(right, @message-icon__lateral-arrow-size, @_message-icon-background);
.lib-css(left, @message-icon__lateral-width);
}

> *:first-child:after {
left: 0;
}
}

._lib-message-icon-lateral-border-radius(
@_message-icon-position
) when (@_message-icon-position = left) and not (@message__border-radius = false) and not (@message__border-width = false) {
.lib-css(border-radius, (@message__border-radius - @message__border-width) 0 0 (@message__border-radius - @message__border-width));
}

._lib-message-icon-lateral-border-radius(
@_message-icon-position
) when (@_message-icon-position = right) and not (@message__border-radius = false) and not (@message__border-width = false) {
.lib-css(border-radius, 0 (@message__border-radius - @message__border-width) (@message__border-radius - @message__border-width) 0);
}

._lib-message-icon-inner(
@_message-icon,
@_message-icon-color,
@_message-icon-background,
@_message-icon-top,
@_message-icon-left,
@_message-icon-bottom,
@_message-icon-right
) {
.lib-css(padding-left, @message-icon__inner-padding-left);
position: relative;

> *:first-child:before {
._lib-icon-font(
@_icon-font-content: @_message-icon,
@_icon-font: @icon-font,
@_icon-font-size: @message-icon__font-size,
@_icon-font-line-height: @message-icon__font-line-height,
@_icon-font-color: @_message-icon-color,
@_icon-font-margin: -@message-icon__font-size/2 0 0,
@_icon-font-vertical-align: @icon-font__vertical-align
);
.lib-css(bottom, @_message-icon-bottom);
.lib-css(left, @_message-icon-left);
.lib-css(right, @_message-icon-right);
.lib-css(top, @_message-icon-top);
.lib-css(width, @message-icon__inner-padding-left);
position: absolute;
text-align: center;
}
}