@import './styles/<!--partnerName--settings-->';
@import './styles/tools';

$c-product-care-and-print-area-content-title: $default-font-family !default;
$c-product-care-and-print-area-content-units-of-measurement-text-transform: uppercase !default;
$c-product-care-and-print-area__brand-title--padding-bottom: 14px !default;

%content-container-common {
    display: inline-block;
    vertical-align: top;
    width: 50%;
}
.c-product-care-and-print-area__print-area {
    @extend %content-container-common;
    padding-left: 10px;
}
.c-product-care-and-print-area__care-instructions {
    @extend %content-container-common;
    padding-right: 10px;
}

.c-product-care-and-print-area__brand-block {
    margin-bottom: 30px;
}
    .c-product-care-and-print-area__title {
        text-transform: uppercase;
        font-size: 20px;
        text-align: left;
        font-family: $c-product-care-and-print-area-content-title;
        font-weight: $font-weight-semi-bold;
        margin-bottom: 48px;
    }
        .c-product-care-and-print-area__brand-title {
            border-bottom: solid 1px transparentize(rgb(30, 30, 30),0.8);
            padding-bottom: $c-product-care-and-print-area__brand-title--padding-bottom;
            margin-bottom: 14px;
            font-weight: 500;
            color: $grey-super-dark;
        }
        .c-product-care-and-print-area__care-text {
            color: transparentize($black-color, 0.4);
        }

.c-product-care-and-print-area__controls {
    text-align: right;
}

.c-product-care-and-print-area__units-of-measure {
    list-style: none;
    padding: 0;
    margin: 0;
}
    .c-product-care-and-print-area__units-of-measure-item {
        border: $c-input-border;
        height: $c-input-height;
        background-color: $c-input-background-color;
        border-radius: 0;
        -webkit-appearance: none;
        box-shadow: none;
        max-width: 100%;
        $height: 48px;
        min-width: 78px;
        height: $height;
        display: inline-block;
        vertical-align: middle;
        text-align: center;
        text-transform: $c-product-care-and-print-area-content-units-of-measurement-text-transform;
        font-size: 16px;
        line-height: $height;
        cursor: pointer;
    }
        .c-product-care-and-print-area__units-of-measure-item--selected {
            border: solid 2px $accent-a;
            background-color: $white-color;
            color: $grey-super-dark;
        }

    .c-product-care-and-print-area__print-area-table {
        width: 100%;
    }