Your IP : 216.73.216.97
// /**
// * Copyright © Magento, Inc. All rights reserved.
// * See COPYING.txt for license details.
// */
//
// List default styles reset
// ---------------------------------------------
@_column-number: 1;
& when (@media-common = true) {
.abs-reset-list {
.lib-list-reset-styles();
> li {
margin: 0;
}
}
}
//
// Primary button
// ---------------------------------------------
& when (@media-common = true) {
.action-primary {
.lib-button-primary();
.lib-css(border-radius, @button__border-radius);
}
}
//
// Secondary button
// ---------------------------------------------
& when (@media-common = true) {
.abs-revert-to-action-secondary {
&:extend(.abs-revert-secondary-color all);
.lib-css(border-radius, @button__border-radius);
&:not(:focus) {
.lib-css(box-shadow, @button__shadow);
}
&:active {
.lib-css(box-shadow, @button__shadow-active);
}
}
}
//
// Link as a button
// ---------------------------------------------
& when (@media-common = true) {
.abs-action-link-button {
.lib-button();
.lib-link-as-button();
.lib-css(border-radius, @button__border-radius);
}
}
//
// Button as a link
// ---------------------------------------------
& when (@media-common = true) {
.abs-action-button-as-link {
.lib-button-as-link(@_margin: false);
.lib-css(font-weight, @font-weight__regular);
border-radius: 0;
&:active,
&:not(:focus) {
box-shadow: none;
}
}
}
//
// Button revert secondary color
// ---------------------------------------------
& when (@media-common = true) {
.abs-revert-secondary-color {
.lib-button-revert-secondary-color();
}
}
//
// Button revert secondary size
// ---------------------------------------------
& when (@media-common = true) {
.abs-revert-secondary-size {
.lib-button-revert-secondary-size();
}
}
//
// Large button
// ---------------------------------------------
& when (@media-common = true) {
.abs-button-l {
.lib-button-l();
}
}
//
// Product options list
// ---------------------------------------------
@abs-product-options-list: {
dt {
clear: left;
float: left;
margin: 0 @indent__s @indent__xs 0;
&:after {
content: ': ';
}
}
dd {
display: inline-block;
float: left;
margin: 0 0 @indent__xs;
word-break: break-all;
}
};
& when (@media-common = true) {
.abs-product-options-list {
@abs-product-options-list();
}
}
//
// Desktop
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-product-options-list-desktop {
@abs-product-options-list();
}
}
//
// Button reset width, floats, margins
// ---------------------------------------------
& when (@media-common = true) {
.abs-button-responsive {
.lib-button-responsive();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-button-desktop {
width: auto;
}
}
//
// Blocks in 2 columns
// ---------------------------------------------
@abs-blocks-2columns: {
width: 48%;
&:nth-child(1) {
clear: left;
float: left;
}
&:nth-child(2) {
float: right;
& + * {
clear: both;
}
}
};
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-blocks-2columns {
@abs-blocks-2columns();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.abs-blocks-2columns-s {
@abs-blocks-2columns();
}
}
//
// Reset image alignment in container
// ---------------------------------------------
& when (@media-common = true) {
.abs-reset-image-wrapper {
height: auto;
padding: 0 !important;
.product-image-photo {
position: static;
}
}
}
//
// Adaptive images
// ---------------------------------------------
& when (@media-common = true) {
.abs-adaptive-images {
display: block;
height: auto;
max-width: 100%;
}
.abs-adaptive-images-centered {
display: block;
height: auto;
margin: 0 auto;
max-width: 100%;
}
}
//
// Title for login blocks
// ---------------------------------------------
& when (@media-common = true) {
.abs-login-block-title {
.lib-css(border-bottom, 1px solid @secondary__color);
.lib-font-size(18);
margin-bottom: 15px;
padding-bottom: 12px;
strong {
font-weight: 500;
}
}
}
//
// Simple Dropdown
// ---------------------------------------------
& when (@media-common = true) {
.abs-dropdown-simple {
.lib-dropdown(
@_dropdown-list-item-padding: 5px 5px 5px 23px,
@_dropdown-list-min-width: 200px,
@_icon-font-margin: 0 0 0 5px,
@_icon-font-vertical-align: middle
);
ul.items {
padding: 6px 0;
}
}
}
//
// Input quantity
// ---------------------------------------------
& when (@media-common = true) {
.abs-input-qty {
text-align: center;
width: 54px;
}
}
//
// Margin for blocks & widgets
// ---------------------------------------------
& when (@media-common = true) {
.abs-margin-for-blocks-and-widgets {
margin-bottom: @indent__xl;
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-margin-for-blocks-and-widgets-desktop {
margin-bottom: @indent__xl + @indent__s;
}
}
//
// Remove button for blocks
// ---------------------------------------------
& when (@media-common = true) {
.abs-remove-button-for-blocks {
.lib-icon-font(
@icon-remove,
@_icon-font-size: 12px,
@_icon-font-line-height: 15px,
@_icon-font-text-hide: true,
@_icon-font-color: @color-gray46,
@_icon-font-color-hover: @color-gray-darken4,
@_icon-font-color-active: @color-gray60
);
}
}
//
// Product link
// ---------------------------------------------
& when (@media-common = true) {
.abs-product-link {
font-weight: @font-weight__regular;
> a {
.lib-link(
@_link-color: @product-name-link__color,
@_link-text-decoration: @product-name-link__text-decoration,
@_link-color-visited: @product-name-link__color__visited,
@_link-text-decoration-visited: @product-name-link__text-decoration__visited,
@_link-color-hover: @product-name-link__color__hover,
@_link-text-decoration-hover: @product-name-link__text-decoration__hover,
@_link-color-active: @product-name-link__color__active,
@_link-text-decoration-active: @product-name-link__text-decoration__active
);
}
}
}
//
// Link
// ---------------------------------------------
& when (@media-common = true) {
.abs-like-link {
.lib-link();
cursor: pointer;
}
}
//
// Reset left margin
// ---------------------------------------------
@abs-reset-left-margin: {
margin-left: 0;
};
& when (@media-common = true) {
.abs-reset-left-margin {
@abs-reset-left-margin();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-reset-left-margin-desktop {
@abs-reset-left-margin();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.abs-reset-left-margin-desktop-s {
@abs-reset-left-margin();
}
}
//
// Action with icon remove with text
// ---------------------------------------------
& when (@media-common = true) {
.abs-action-remove {
&:extend(.abs-action-button-as-link all);
line-height: normal;
margin-left: 73%;
position: absolute;
top: 34px;
width: auto;
}
}
//
// Action with icon remove with text for desktop
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-action-remove-desktop {
margin-left: 90%;
}
}
//
// Add Recipient
// ---------------------------------------------
& when (@media-common = true) {
.abs-add-fields {
.fieldset {
.field {
.control {
width: 70%;
}
}
.actions-toolbar {
&:extend(.abs-add-clearfix all);
> .secondary {
.action {
&.add {
margin-top: @indent__l;
}
}
float: left;
}
}
.fields {
.actions-toolbar {
margin: 0;
}
}
}
.additional {
margin-top: 55px;
position: relative;
}
.action {
&.remove {
&:extend(.abs-action-remove all);
}
}
.message {
&.notice {
margin: @indent__l 0 0;
}
}
}
}
//
// Add Recipient for desktop
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-add-fields-desktop {
.fieldset {
.field {
.control {
width: auto;
}
}
.additional {
.action {
&.remove {
&:extend(.abs-action-remove-desktop all);
}
}
}
}
}
}
//
// Margin for forms
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-margin-for-forms-desktop {
.lib-css(margin-left, @form-field-type-label-inline__width);
}
}
//
// Visibility hidden / show visibility hidden
// ---------------------------------------------
@abs-hidden: {
.lib-visibility-hidden();
};
& when (@media-common = true) {
.abs-hidden {
@abs-hidden();
}
}
//
// Visually hidden / show visually hidden
// ---------------------------------------------
@abs-visually-hidden: {
.lib-visually-hidden();
};
& when (@media-common = true) {
.abs-visually-hidden {
@abs-visually-hidden();
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-visually-hidden-mobile {
@abs-visually-hidden();
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
.abs-visually-hidden-mobile-m {
@abs-visually-hidden();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.abs-visually-hidden-desktop-s {
@abs-visually-hidden();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-visually-hidden-desktop {
@abs-visually-hidden();
}
}
//
// Visually hidden reset
// ---------------------------------------------
& when (@media-common = true) {
.abs-visually-hidden-reset {
.lib-visually-hidden-reset();
}
}
//
// Clearfix
// ---------------------------------------------
@abs-add-clearfix: {
.lib-clearfix();
};
& when (@media-common = true) {
.abs-add-clearfix {
@abs-add-clearfix();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-add-clearfix-desktop {
@abs-add-clearfix();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.abs-add-clearfix-desktop-s {
@abs-add-clearfix();
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-add-clearfix-mobile {
@abs-add-clearfix();
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
.abs-add-clearfix-mobile-m {
@abs-add-clearfix();
}
}
//
// Box-sizing
// ---------------------------------------------
@abs-add-box-sizing: {
box-sizing: border-box;
};
& when (@media-common = true) {
.abs-add-box-sizing {
@abs-add-box-sizing();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-add-box-sizing-desktop {
@abs-add-box-sizing();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.abs-add-box-sizing-desktop-s {
@abs-add-box-sizing();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-add-box-sizing-desktop-m {
@abs-add-box-sizing();
}
}
//
// Revert field type
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-revert-field-type-desktop {
.fieldset {
> .field,
.fields > .field {
.lib-form-field-type-revert(@_type: block);
&:not(:first-child):last-of-type {
margin-bottom: 0;
}
}
}
}
}
//
// Settings icons
// ---------------------------------------------
& when (@media-common = true) {
.abs-navigation-icon {
.lib-icon-font(
@_icon-font-content: @icon-down,
@_icon-font-size: 34px,
@_icon-font-line-height: 1.2,
@_icon-font-position: after,
@_icon-font-display: block
);
&:after {
position: absolute;
right: 5px;
top: 0;
}
}
}
//
// Split button
// ---------------------------------------------
& when (@media-common = true) {
.abs-split-button {
.lib-dropdown-split(
@_options-selector : ~'.items',
@_dropdown-split-button-border-radius-fix: true
);
vertical-align: middle;
}
}
//
// Field 2 column
// ---------------------------------------------
@abs-form-field-column-2: {
.fieldset {
.field {
.lib-form-field-column(@_column: true);
&:nth-last-child(1),
&:nth-last-child(2) {
margin-bottom: 0;
}
.field {
padding: 0;
width: 100%;
}
}
}
};
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-form-field-column-2 {
@abs-form-field-column-2();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.abs-form-field-column-2-s {
@abs-form-field-column-2();
}
}
//
// Field 1 column
// ---------------------------------------------
@abs-form-field-revert-column-1: {
.lib-form-field-column-number(@_column-number);
};
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-form-field-revert-column-1 {
@abs-form-field-revert-column-1();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.abs-form-field-revert-column-1-s {
@abs-form-field-revert-column-1();
}
}
//
// Checkout shipping methods title
// ---------------------------------------------
& when (@media-common = true) {
.abs-methods-shipping-title {
.lib-css(font-weight, @font-weight__semibold);
.lib-font-size(16);
margin-bottom: 15px;
}
}
//
// Checkout order review
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-checkout-order-review {
tbody > tr {
&:extend(.abs-add-clearfix-mobile all);
&:not(:last-child) {
.lib-css(border-bottom, @border-width__base solid @border-color__base);
}
> td.col {
&.item {
&:before {
display: none;
}
}
&.qty,
&.price,
&.subtotal {
box-sizing: border-box;
float: left;
text-align: center;
white-space: nowrap;
width: 33%;
&[data-th]:before {
content: attr(data-th) ':';
display: block;
font-weight: @font-weight__bold;
padding-bottom: @indent__s;
}
}
&:last-child {
border: 0;
}
}
}
.product-item-name {
margin: 0;
}
}
}
//
// Add to Actions
// ---------------------------------------------
& when (@media-common = true) {
.abs-actions-addto {
.lib-css(color, @addto-color);
display: inline-block;
font-weight: @font-weight__semibold;
letter-spacing: .05em;
text-transform: uppercase;
.lib-icon-font(
@_icon-font-content: '',
@_icon-font-size: 16px,
@_icon-font-line-height: 16px,
@_icon-font-margin: -2px 5px 0 0,
@_icon-font-vertical-align: middle
);
&:hover {
.lib-css(color, @addto-hover-color);
text-decoration: none;
}
&:before {
width: 18px;
}
}
}
//
// Box-tocart block
// ---------------------------------------------
& when (@media-common = true) {
.abs-box-tocart {
margin: 0 0 @indent__l;
}
}
//
// General pages forms
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-forms-general-desktop {
max-width: 500px;
.legend {
.lib-visually-hidden();
}
.legend + br {
display: none;
}
}
}
//
// Revert side paddings
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-revert-side-paddings {
padding-left: 0;
padding-right: 0;
}
}
//
// Abstract toggle title block
// ---------------------------------------------
@abs-toggling-title: {
.lib-css(border-top, @border-width__base solid @border-color__base);
cursor: pointer;
margin-bottom: 0;
position: relative;
&:after {
position: absolute;
right: @indent__base;
top: @indent__s;
}
};
& when (@media-common = true) {
.abs-toggling-title {
@abs-toggling-title();
.lib-css(padding, @indent__s @indent__xl @indent__s @mobile-cart-padding);
.lib-icon-font(
@icon-down,
@_icon-font-size: 12px,
@_icon-font-line-height: 12px,
@_icon-font-text-hide: true,
@_icon-font-margin: 3px 0 0,
@_icon-font-position: after,
@_icon-font-display: block
);
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
.abs-toggling-title-mobile {
@abs-toggling-title();
.lib-css(border-bottom, @border-width__base solid @border-color__base);
.lib-css(padding, @indent__s @indent__xl @indent__s @layout__width-xs-indent);
.lib-icon-font(
@icon-down,
@_icon-font-size: 12px,
@_icon-font-text-hide: false,
@_icon-font-margin: 3px 0 0 0,
@_icon-font-position: after,
@_icon-font-display: block
);
&.active {
.lib-icon-font-symbol(
@_icon-font-content: @icon-up,
@_icon-font-position: after
);
}
}
}
//
// Cart discount block
// ---------------------------------------------
& when (@media-common = true) {
.abs-cart-block {
margin: 0;
> .title {
&:extend(.abs-toggling-title all);
&:after {
color: @color-gray52;
}
}
.content {
display: none;
.lib-css(padding, 5px @mobile-cart-padding 23px);
position: relative;
}
&.active {
> .title {
.lib-icon-font-symbol(
@_icon-font-content: @icon-up,
@_icon-font-position: after
);
}
.content {
display: block;
}
}
}
.abs-cart-block-content {
margin: 0;
}
}
//
// Checkout order review price
// ---------------------------------------------
& when (@media-common = true) {
.abs-checkout-cart-price {
.lib-css(color, @primary__color__lighter);
.lib-font-size(16);
font-weight: @font-weight__bold;
}
}
//
// Checkout order product name
// ---------------------------------------------
& when (@media-common = true) {
.abs-checkout-product-name {
.lib-font-size(18);
font-weight: @font-weight__light;
margin: 0;
}
}
//
// Mobile checkout order product name
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-product-items-summary {
tbody {
.col {
padding: @indent__s 0 0;
&:last-child {
padding-bottom: @indent__s
}
}
}
tfoot {
.mark {
padding-bottom: @indent__xs;
text-align: left;
}
.amount {
padding-top: 0;
text-align: left;
}
.grand.totals {
.lib-font-size(16);
.mark {
padding-bottom: 0;
padding-top: @indent__xs;
}
.amount {
padding-bottom: @indent__s;
padding-top: 0;
strong {
border-top: none;
}
}
}
}
}
}
//
// Account pages: title
// ---------------------------------------------
& when (@media-common = true) {
.abs-account-title {
> strong,
> span {
.lib-font-size(22);
.lib-css(font-weight, @font-weight__light);
}
.lib-css(border-bottom, 1px solid @account-title-border-color);
.lib-css(margin-bottom, @indent__m);
.lib-css(padding-bottom, @indent__s);
}
}
//
// Account pages: block font size
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-account-block-font-size {
.lib-font-size(16);
}
}
//
// Account pages: block line-height
// ---------------------------------------------
& when (@media-common = true) {
.abs-account-block-line-height {
line-height: 24px;
}
}
//
// Account pages: margin for table
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-account-table-margin-mobile {
.lib-css(margin-top, -@indent__base);
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-account-table-margin-desktop {
.lib-css(margin-top, -@indent__m);
}
}
//
// Account pages: table col actions
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-col-no-prefix {
&:before {
.lib-visually-hidden();
}
}
}
//
// Account pages: order table summary
// ---------------------------------------------
& when (@media-common = true) {
.abs-account-summary {
td {
.lib-css(background, @sidebar__background-color);
}
}
}
//
// Action print with icon
// ---------------------------------------------
@abs-action-print: {
.lib-icon-font(
@icon-print,
@_icon-font-size: 16px,
@_icon-font-line-height: 16px,
@_icon-font-margin: 0 4px 0 0,
@_icon-font-position: before
);
&:hover {
text-decoration: underline;
}
};
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-action-print {
@abs-action-print();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.abs-action-print-s {
@abs-action-print();
}
}
//
// Excl/Incl tax
// ---------------------------------------------
& when (@media-common = true) {
.abs-incl-excl-tax {
.price-including-tax,
.price-excluding-tax {
.lib-css(color, @cart-price-color);
.lib-font-size(18);
display: block;
line-height: 1;
white-space: nowrap;
.price {
font-weight: @font-weight__bold;
}
}
}
.abs-adjustment-incl-excl-tax {
.price-including-tax,
.price-excluding-tax {
.lib-font-size(14);
display: inline-block;
}
.price-including-tax + .price-excluding-tax {
.lib-font-size(11);
display: inline-block;
&:before {
content: '('attr(data-label)': ';
}
&:after {
content: ')';
}
}
}
}
//
// Cart tax total
// ---------------------------------------------
& when (@media-common = true) {
.abs-tax-total {
cursor: pointer;
padding-right: @indent__s;
position: relative;
.lib-icon-font(
@icon-down,
@_icon-font-size: 8px,
@_icon-font-line-height: 8px,
@_icon-font-margin: 3px 0 0 0,
@_icon-font-position: after
);
&:after {
position: absolute;
right: -2px;
top: 4px;
}
}
.abs-tax-total-expanded {
.lib-icon-font-symbol(
@_icon-font-content: @icon-up,
@_icon-font-position: after
);
}
}
//
// Forms: margin-bottom for small forms
// ---------------------------------------------
& when (@media-common = true) {
.abs-forms-margin-small {
.lib-css(margin-bottom, @indent__base);
}
}
//
// Ratings: vertical alignment
// ---------------------------------------------
& when (@media-common = true) {
.abs-rating-summary {
.rating {
&-summary {
display: table-row;
}
&-label {
display: table-cell;
padding-bottom: @indent__xs;
padding-right: @indent__m;
padding-top: 1px;
vertical-align: top;
}
&-result {
display: table-cell;
vertical-align: top;
}
}
}
}
//
// Account pages: actions
// ---------------------------------------------
& when (@media-common = true) {
.abs-account-actions {
&:after {
.lib-css(border-left, 1px solid @primary__color__light);
content: '';
display: inline-block;
height: 12px;
margin: 0 @indent__s;
vertical-align: -1px;
}
&:last-child {
&:after {
display: none;
}
}
}
}
//
// Account blocks
// ---------------------------------------------
& when (@media-common = true) {
.abs-account-blocks {
.block-title {
&:extend(.abs-account-title all);
> .action {
margin-left: 15px;
}
}
.box-title {
> span {
.lib-font-size(16);
}
display: inline-block;
margin: 0 0 @indent__s;
> .action {
font-weight: 400;
margin-left: @indent__s;
}
}
}
}
//
// Add colon
// ---------------------------------------------
& when (@media-common = true) {
.abs-colon {
&:after {
content: ': ';
}
}
}
//
// Icon - create add
// ---------------------------------------------
& when (@media-common = true) {
.abs-icon-add {
.lib-icon-font(
@_icon-font-content: @icon-expand,
@_icon-font-size: 10px,
@_icon-font-line-height: 10px,
@_icon-font-vertical-align: middle
);
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
.abs-icon-add-mobile {
.lib-icon-font(
@_icon-font-content: @icon-expand,
@_icon-font-size: 10px,
@_icon-font-line-height: 10px,
@_icon-font-vertical-align: middle,
@_icon-font-margin: 0 5px 0 0,
@_icon-font-display: block
);
}
}
//
// Dropdown items - create new
// ---------------------------------------------
& when (@media-common = true) {
.abs-dropdown-items-new {
.items .item:last-child {
&:hover {
.lib-css(background, @dropdown-list-item__hover);
}
}
.action.new {
&:extend(.abs-icon-add all);
&:before {
margin-left: -17px;
margin-right: @indent__xs;
}
}
}
}
//
// Abstract no display
// ---------------------------------------------
@abs-no-display: {
display: none;
};
& when (@media-common = true) {
.abs-no-display {
@abs-no-display();
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-no-display-s {
@abs-no-display();
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-no-display-desktop {
@abs-no-display();
}
}
//
// Status
// ---------------------------------------------
& when (@media-common = true) {
.abs-status {
.lib-css(border, 2px solid @border-color__base);
border-radius: 3px;
display: inline-block;
margin: 3px 0 0;
padding: 2px @indent__s;
text-transform: uppercase;
vertical-align: top;
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-status-desktop {
margin-top: 6px;
padding: @indent__xs @indent__s;
}
}
//
// Page title - orders pages
// ---------------------------------------------
& when (@media-common = true) {
.abs-title-orders {
.page-main {
.page-title-wrapper {
.page-title {
margin-right: 25px;
}
.order-date {
font-size: 16px;
margin-bottom: @indent__s;
.label {
display: none;
}
}
}
}
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-title-orders-mobile {
.page-main {
.page-title-wrapper {
.page-title {
display: block;
}
.order-status {
@order-status-indent: ceil(@h1__margin-bottom/2);
margin: -@order-status-indent 0 @indent__s;
}
}
}
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-title-orders-desktop {
.page-main {
.page-title-wrapper {
.order-date {
@order-date-indent: ceil(@h1__margin-bottom/1.5);
margin: -@order-date-indent 0 18px;
}
}
}
}
}
//
// Table striped
// ---------------------------------------------
& when (@media-common = true) {
.abs-table-striped {
.lib-table-striped(
@_stripped-highlight: even
);
.lib-table-bordered(
@_table_type: light
);
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-table-striped-mobile {
> tbody > tr > td:last-child {
border: 0;
}
}
}
//
// Table bordered desktop
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-table-bordered-desktop {
.lib-table-bordered(
@_table_type: light,
@_table_border-width: 1px
);
}
}
//
// Pager toolbar for non-catalog pages desktop
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-pager-toolbar {
position: relative;
.toolbar-amount,
.limiter {
position: relative;
z-index: 1;
}
.limiter {
display: inline-block;
float: right;
}
.toolbar-amount {
.lib-css(line-height, @pager__line-height);
padding: 0;
}
.pages {
position: absolute;
width: 100%;
z-index: 0;
}
}
}
//
// Items counter in blocks
// ---------------------------------------------
& when (@media-common = true) {
.abs-block-items-counter {
.lib-css(color, @block-items__counter__color);
.lib-font-size(12px);
vertical-align: middle;
white-space: nowrap;
&:before {
content: '(';
}
&:after {
content: ')';
}
}
}
//
// Sidebar and widget blocks title
// ---------------------------------------------
& when (@media-common = true) {
.abs-block-widget-title {
margin: 0 0 @indent__base;
strong {
font-size: @font-size__l;
font-weight: @font-weight__light;
vertical-align: middle;
}
}
}
//
// Shopping cart items
// ---------------------------------------------
& when (@media-common = true) {
.abs-shopping-cart-items {
margin-bottom: @indent__base;
.actions.main {
.continue {
display: none;
}
.clear {
.lib-button-as-link(
@_margin: 0 @indent__base 0 0
);
font-weight: @font-weight__regular;
}
}
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-shopping-cart-items-desktop {
.lib-layout-column(2, 1, @layout-column-checkout__width-main);
&:extend(.abs-add-box-sizing-desktop all);
padding-right: 4%;
position: relative;
}
}
//
// Remove top border
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-no-border-top {
border-top: 0;
}
}
//
// Remove bottom border
// ---------------------------------------------
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-no-border-bottom {
border-bottom: 0;
}
}
//
// Form Field Date
// ---------------------------------------------
& when (@media-common = true) {
.abs-field-date {
.control {
position: relative;
&:extend(.abs-add-box-sizing all);
}
input {
&:extend(.abs-field-date-input);
}
}
}
//
// Form Field Date Input
// ---------------------------------------------
& when (@media-common = true) {
.abs-field-date-input {
.lib-css(margin-right, @indent__s);
width: calc(~'100% -' @icon-calendar__font-size + @indent__s);
}
}
//
// Form Field Tooltip
// ---------------------------------------------
& when (@media-common = true) {
.abs-field-tooltip {
&:extend(.abs-add-box-sizing all);
position: relative;
input {
.lib-css(margin-right, @indent__s);
width: calc(~'100% -' @checkout-tooltip-icon__font-size + @indent__s + @indent__xs);
}
}
}
//
// Checkout Tooltip Content (position: top)
// ---------------------------------------------
@abs-checkout-tooltip-content-position-top: {
.lib-css(right, @checkout-tooltip-content-mobile__right);
.lib-css(top, @checkout-tooltip-content-mobile__top);
left: auto;
&:before,
&:after {
.lib-arrow(
@_position: top,
@_size: @checkout-tooltip-icon-arrow__font-size,
@_color: @checkout-tooltip-content__background-color
);
.lib-css(margin-top, @checkout-tooltip-icon-arrow__left);
.lib-css(right, @indent__s);
left: auto;
top: 0;
}
&:before {
.lib-css(border-bottom-color, @checkout-tooltip-content__active__border-color);
}
&:after {
.lib-css(border-bottom-color, @checkout-tooltip-content__background-color);
top: 1px;
}
};
& when (@media-common = true) {
.abs-checkout-tooltip-content-position-top {
@abs-checkout-tooltip-content-position-top();
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
.abs-checkout-tooltip-content-position-top-mobile {
@abs-checkout-tooltip-content-position-top();
}
}
//
// Checkout title
// ---------------------------------------------
& when (@media-common = true) {
.abs-checkout-title {
.lib-css(padding-bottom, @checkout-step-title__padding);
.lib-typography(
@_font-size: @checkout-step-title__font-size,
@_font-weight: @checkout-step-title__font-weight,
@_font-family: false,
@_font-style: false,
@_line-height: false
);
}
}
//
// Mini Cart and checkout sidebar totals
// ---------------------------------------------
& when (@media-common = true) {
.abs-sidebar-totals {
border-top: 1px solid @border-color__base;
padding-top: 10px;
tbody,
tfoot {
.mark {
border: 0;
font-weight: @font-weight__regular;
padding: 6px 0;
}
.amount {
border: 0;
font-weight: @font-weight__regular;
padding: 6px 0 6px 14px;
text-align: right;
white-space: nowrap;
}
}
.table-caption {
&:extend(.abs-no-display all);
}
.grand {
th,
td {
padding: 11px 0;
}
strong {
display: inline-block;
font-weight: @font-weight__semibold;
padding: 3px 0 0;
}
.mark {
.lib-font-size(18);
border-top: 1px solid @border-color__base;
padding-right: @indent__s;
}
.amount {
.lib-font-size(18);
border-top: 1px solid @border-color__base;
}
}
.msrp {
margin-bottom: @indent__s;
}
tbody tr:last-child td {
padding-bottom: 19px;
}
.totals-tax {
&-summary {
.mark,
.amount {
border-bottom: @border-width__base solid @border-color__base;
border-top: @border-width__base solid @border-color__base;
cursor: pointer;
}
.amount .price {
padding-right: @indent__base;
position: relative;
.lib-icon-font(
@icon-down,
@_icon-font-size: 12px,
@_icon-font-line-height: 12px,
@_icon-font-text-hide: true,
@_icon-font-position: after
);
&:after {
position: absolute;
right: 3px;
top: 3px;
}
}
&.expanded {
.mark,
.amount {
border-bottom: 0;
}
.amount .price {
.lib-icon-font-symbol(
@_icon-font-content: @icon-up,
@_icon-font-position: after
);
}
}
}
&-details {
border-bottom: @border-width__base solid @border-color__base;
display: none;
&.shown {
display: table-row;
}
}
}
.table-wrapper {
margin-bottom: 0;
}
}
}
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-sidebar-totals-mobile {
th {
&:extend(.abs-col-no-prefix all);
}
td {
&:extend(.abs-col-no-prefix all);
}
tbody tr:not(:last-child) {
td {
&:extend(.abs-no-border-bottom-top all);
}
}
.amount {
text-align: right;
}
}
}
//
// Shopping cart and payment discount codes block
// ---------------------------------------------
& when (@media-common = true) {
.abs-discount-block {
.block {
&:extend(.abs-cart-block all);
> .title {
strong {
color: @link__color;
font-weight: @font-weight__regular;
}
}
}
.actions-toolbar {
display: table-cell;
vertical-align: top;
width: 1%;
.action {
&.primary,
&.cancel {
&:extend(.abs-revert-to-action-secondary all);
border-bottom-left-radius: 0;
border-top-left-radius: 0;
margin: 0 0 0 -1px;
white-space: nowrap;
width: auto;
}
}
.secondary {
bottom: 5px;
left: @mobile-cart-padding;
position: absolute;
}
}
.action.check {
&:extend(.abs-action-button-as-link all);
font-weight: @font-weight__regular;
}
.fieldset {
display: table;
width: 100%;
> .field {
> .label {
display: none;
}
}
}
.field {
display: table-cell;
}
}
}
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.abs-discount-block-desktop {
.block {
&:extend(.abs-blocks-2columns all);
> .title {
border: 0;
padding: 0 0 @indent__s;
strong {
.lib-font-size(16);
}
}
.content {
.lib-css(padding, 0 0 @indent__base);
}
}
.actions-toolbar {
.secondary {
bottom: -30px;
left: 0;
position: absolute;
}
}
}
}