/* ==========================================================
   MY ACCOUNT - CLEAN RED MINIMAL
========================================================== */

.woocommerce-account{
    background:#f4f1ec;
}


/* ==========================================================
   CONTAINER
========================================================== */

.woocommerce-account .container{
    max-width:1600px !important;
}


/* ==========================================================
   LAYOUT
========================================================== */

.woocommerce-account .woocommerce{
    display:flex;
    gap:40px;
    margin:60px auto;
    align-items:flex-start;
}

.woocommerce-info {
    display: flex;
    align-items: center;
    flex-direction: column;
}


/* ==========================================================
   SIDEBAR
========================================================== */

.woocommerce-MyAccount-navigation{
    width:280px;
    flex-shrink:0;
}

.woocommerce-MyAccount-navigation ul{
    margin:0;
    padding:0;
    list-style:none;
}

.woocommerce-MyAccount-navigation li{
    margin-bottom:8px;
}

.woocommerce-MyAccount-navigation a{
    display:block !important;

    padding:5px 18px !important;

    border:1px solid var(--main-color);

    background:transparent;

    color:var(--main-color) !important;

    text-decoration:none !important;

    font-weight:400;

    transition:.25s ease;
    font-size: 15px!important;
}

.woocommerce-MyAccount-navigation a:hover,
.woocommerce-MyAccount-navigation .is-active a{

    background:var(--main-color);

    color:#fff !important;
}


/* ==========================================================
   CONTENT
========================================================== */

.woocommerce-products-header .page-title{
    font-family: var(--font-primary);
    color: var(--main-color);
    font-size: 30px;
}
.woocommerce-MyAccount-content{
    flex:1;

    background:transparent !important;

    padding:0;

    border:none;

    box-shadow:none !important;
}
.woocommerce-MyAccount-content h2{
    display: none;
}


/* ==========================================================
   REMOVE WHITE BACKGROUNDS
========================================================== */

.woocommerce-account .woocommerce-address-fields{

    background:transparent !important;

    box-shadow:none !important;

    border-radius:0 !important;
}


/* ==========================================================
   LABELS
========================================================== */

.woocommerce form label{
    display:block !important;

    margin-bottom:8px;

    color:#111 !important;

    font-size:13px;

    font-weight:600;

    opacity:1 !important;

    visibility:visible !important;
}


/* ==========================================================
   REMOVE GOYA BORDER-BOTTOM STYLE
========================================================== */

.woocommerce-account .el-style-border-bottom input,
.woocommerce-account .el-style-border-bottom textarea,
.woocommerce-account .el-style-border-bottom select{

    border:1px solid var(--main-color) !important;

    padding-left:14px !important;

    padding-right:14px !important;
}


/* ==========================================================
   INPUTS
========================================================== */

.woocommerce-account input[type="text"],
.woocommerce-account input[type="email"],
.woocommerce-account input[type="password"],
.woocommerce-account input[type="tel"],
.woocommerce-account input[type="number"],
.woocommerce-account input[type="search"],
.woocommerce-account textarea,
.woocommerce-account select,
.woocommerce-account .input-text{

    width:100%;

    min-height:44px !important;

    padding:10px 14px !important;

    border:1px solid var(--main-color) !important;

    background:transparent !important;

    color:#111 !important;

    border-radius:0 !important;

    box-shadow:none !important;

    appearance:none;
}


/* ==========================================================
   INPUT FOCUS
========================================================== */

.woocommerce-account input:focus,
.woocommerce-account textarea:focus,
.woocommerce-account select:focus{

    border:1px solid #111 !important;

    outline:none !important;

    box-shadow:none !important;
}


/* ==========================================================
   BUTTONS
========================================================== */

.woocommerce-MyAccount-content .button{

    background:var(--main-color) !important;

    color:#fff !important;

    border:none !important;

    padding:14px 26px !important;

    text-transform:uppercase;

    font-size:13px;

    font-weight:700;

    transition:.25s ease;
}

.woocommerce-MyAccount-content .woocommerce-account button.button:hover,
.woocommerce-MyAccount-content .woocommerce-account .button:hover,
.woocommerce-MyAccount-content .woocommerce-account input.button:hover{

    background:#111 !important;

    color:#fff !important;
}


/* ==========================================================
   TABLES
========================================================== */

.woocommerce-account table.shop_table{
    border:none !important;
}

.woocommerce-account table.shop_table th{

    background:var(--main-color);

    color:#fff;

    font-weight:600;
}

.woocommerce-account table.shop_table td,
.woocommerce-account table.shop_table th{

    padding:18px;

    border-color:rgba(0,0,0,.08);
}


/* ==========================================================
   ADDRESS BOXES
========================================================== */

.account-invoice-box,
.woocommerce-Addresses address{

    border:1px solid var(--main-color);

    padding:30px;

    margin-top:30px;

    background:transparent !important;
}


/* ==========================================================
   DASHBOARD CARDS
========================================================== */

.dashboard-cards{
    display:flex;
    gap:20px;
    flex-wrap:wrap;
}

.dash-card{

    flex:1;

    min-width:240px;

    padding:30px;

    border:1px solid var(--main-color);

    transition:.25s ease;
}

.dash-card:hover{

    background:var(--main-color);

    color:#fff;
}

.dash-card span{

    display:block;

    margin-top:12px;

    font-size:28px;

    font-weight:700;
}



/* ==========================================================
   RESPONSIVE
========================================================== */

@media(max-width:992px){

    .woocommerce-MyAccount-content{
        width: 100%;
        margin-top: 0px;
    }
    .woocommerce-account .woocommerce{
        flex-direction:column;
        margin-top: 30px;
    }


    .woocommerce-MyAccount-navigation{
        width:100%;
        margin-top: 0px;
    }


        .woocommerce-MyAccount-navigation ul li {
            display: block;
        width: 100%;
    }

}