/* MY ACCOUNT PAGE */

.woocommerce-account{
background:#0b0b0b;
color:#fff;
padding:0px 0;
}

/* Layout */

.woocommerce-account .woocommerce{
max-width:1200px;
margin:auto;
display:grid;
grid-template-columns:260px 1fr;
gap:40px;
}

/* LEFT MENU */

.woocommerce-MyAccount-navigation{
background:#111;
border-radius:10px;
overflow:hidden;
}

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

.woocommerce-MyAccount-navigation li{
border-bottom:1px solid #222;
}

.woocommerce-MyAccount-navigation a{
display:block;
padding:14px 18px;
color:#ccc;
font-size:14px;
transition:.25s;
}

.woocommerce-MyAccount-navigation a:hover{
background:#e10600;
color:#fff;
}

.woocommerce-MyAccount-navigation .is-active a{
background:#e10600;
color:#fff;
}

/* RIGHT CONTENT */

.woocommerce-MyAccount-content{
background:#111;
border-radius:10px;
padding:30px;
}

/* Headings */

.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3{
color:#fff;
margin-bottom:15px;
font-size: 18px;
}

/* Paragraph */

.woocommerce-MyAccount-content p{
color:#bbb;
line-height:1.6;
}

/* Buttons */

.woocommerce-account button,
.woocommerce-account .button{
background:#e10600!important;
border:none!important;
color:#fff!important;
padding:10px 20px;
border-radius:5px;
}

.woocommerce-account button:hover{
opacity:.85;
}

/* Tables */

.woocommerce-account table{
border-collapse:collapse;
width:100%;
color:#ddd;
}

.woocommerce-account th,
.woocommerce-account td{
border:1px solid #222;
padding:12px;
}

/* Forms */

.woocommerce-account input{
background:#0b0b0b;
border:1px solid #333;
color:#fff;
padding:10px;
border-radius:4px;
}

/* Mobile */

@media(max-width:900px){

.woocommerce-account .woocommerce{
grid-template-columns:1fr;
}

}

/* EDIT ACCOUNT PAGE */

.woocommerce-account .woocommerce-MyAccount-content form{
max-width:700px;
margin:auto;
}

/* Field wrapper */

.woocommerce-account .form-row{
margin-bottom:18px;
}

/* Two column layout */

.woocommerce-account .form-row-first,
.woocommerce-account .form-row-last{
width:48%;
float:left;
}

.woocommerce-account .form-row-last{
float:right;
}

/* Clear */

.woocommerce-account .clear{
clear:both;
}

/* Labels */

.woocommerce-account label{
display:block;
margin-bottom:6px;
color:#ccc;
font-size:13px;
}

/* Inputs */

.woocommerce-account input{
width:100%;
background:#0b0b0b;
border:1px solid #333;
padding:12px;
color:#fff;
border-radius:5px;
}

/* Password section */

.woocommerce-account fieldset{
border:1px solid #222;
padding:20px;
margin-top:30px;
border-radius:8px;
}

.woocommerce-account fieldset legend{
padding:0 10px;
color:#fff;
}

/* Password strength */

.woocommerce-password-strength{
margin-top:10px;
padding:8px;
border-radius:4px;
background:#1a1a1a;
color:#fff;
}

/* Save button */

.woocommerce-account button[name="save_account_details"]{
margin-top:25px;
width:100%;
font-size:15px;
}

/* Mobile */

@media(max-width:700px){

.woocommerce-account .form-row-first,
.woocommerce-account .form-row-last{
width:100%;
float:none;
}

}

/* Password eye toggle */

.woocommerce-account .password-input{
position:relative;
}

.woocommerce-account .show-password-input{
position:absolute;
right:12px;
top:50%;
transform:translateY(-50%);
width:22px;
height:22px;
border:none;
background:transparent;
cursor:pointer;
opacity:.7;
}

/* Eye icon */

.woocommerce-account .show-password-input:before{
content:"👁";
font-size:18px;
position: absolute;
top: -3px;
right: 10px;
}

/* When password visible */

.woocommerce-account .show-password-input.display-password:before{
content:"🙈";
}

/* Hover */

.woocommerce-account .show-password-input:hover{
opacity:1;
}


/* ===============================
   MY ACCOUNT → EDIT ADDRESS
================================ */

.woocommerce-Addresses {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 30px;
}

/* Each address card */
.woocommerce-Address {
    background: #111;
    border: 1px solid #222;
    border-radius: 12px;
    padding: 25px;
    color: #fff;
    position: relative;
}

/* Title */
.woocommerce-Address-title h3 {
    font-size: 18px;
    margin-bottom: 10px;
    color: #fff;
}

/* Edit button */
.woocommerce-Address-title a {
    position: absolute;
    top: 20px;
    right: 20px;
    background: #e10600;
    color: #fff !important;
    padding: 6px 14px;
    border-radius: 6px;
    font-size: 12px;
    text-transform: uppercase;
    transition: .2s;
}

.woocommerce-Address-title a:hover {
    background: #ff1a1a;
}

/* Address text */
.woocommerce-Address address {
    font-style: normal;
    line-height: 1.7;
    color: #ccc;
    margin-top: 15px;
}

/* Empty address message */
.woocommerce-Address address em {
    color: #888;
}

/* Intro text */
.woocommerce-account .woocommerce-MyAccount-content > p:first-child {
    color: #aaa;
    margin-bottom: 25px;
}

/* Mobile */
@media(max-width: 768px) {

    .woocommerce-Addresses {
        grid-template-columns: 1fr;
    }

}