/*=====================================
ACCOUNT PAGE
=====================================*/

.account-page{

padding:60px 0;

background:#f5f6fa;

min-height:100vh;

}

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

.account-sidebar{

background:#fff;

border-radius:18px;

overflow:hidden;

box-shadow:0 10px 30px rgba(0,0,0,.06);

}

.profile-box{

padding:35px 20px;

text-align:center;

background:#15161D;

color:#fff;

}

.profile-box img{

width:100px;

height:100px;

border-radius:50%;

object-fit:cover;

border:4px solid #fff;

margin-bottom:15px;

}

.profile-box h4{

font-size:24px;

font-weight:700;

margin-bottom:5px;

}

.profile-box p{

margin:0;

font-size:15px;

opacity:.8;

}

.account-sidebar ul{

margin:0;

padding:0;

list-style:none;

}

.account-sidebar ul li{

border-bottom:1px solid #eee;

}

.account-sidebar ul li:last-child{

border:none;

}

.account-sidebar ul li a{

display:flex;

align-items:center;

gap:12px;

padding:18px 22px;

text-decoration:none;

color:#15161D;

font-weight:600;

transition:.3s;

}

.account-sidebar ul li a:hover{

background:#D10024;

color:#fff;

}

.account-sidebar ul li a i{

width:24px;

text-align:center;

}

/*=====================================
WELCOME
=====================================*/

.welcome-box{

background:#fff;

padding:30px;

border-radius:18px;

box-shadow:0 10px 30px rgba(0,0,0,.05);

margin-bottom:20px;

}

.welcome-box h2{

font-size:34px;

font-weight:700;

color:#15161D;

margin-bottom:8px;

}

.welcome-box p{

margin:0;

color:#666;

}

/*=====================================
DASHBOARD CARD
=====================================*/

.dashboard-card{

background:#fff;

border-radius:18px;

padding:30px;

text-align:center;

box-shadow:0 8px 25px rgba(0,0,0,.05);

transition:.3s;

height:100%;

}

.dashboard-card:hover{

transform:translateY(-6px);

}

.dashboard-card i{

font-size:38px;

color:#D10024;

margin-bottom:15px;

}

.dashboard-card h3{

font-size:34px;

font-weight:800;

margin-bottom:8px;

color:#15161D;

}

.dashboard-card p{

margin:0;

font-size:16px;

color:#666;

}

/*=====================================
RECENT ORDERS
=====================================*/

.recent-orders{

background:#fff;

padding:30px;

border-radius:18px;

box-shadow:0 10px 30px rgba(0,0,0,.05);

}

.recent-orders h3{

font-size:28px;

font-weight:700;

margin-bottom:25px;

}

.recent-orders table{

margin-bottom:0;

}

.recent-orders thead{

background:#15161D;

color:#fff;

}

.recent-orders td,

.recent-orders th{

vertical-align:middle;

padding:14px;

}

.recent-orders .btn{

padding:8px 18px;

font-size:14px;

}

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

@media(max-width:991px){

.account-sidebar{

margin-bottom:25px;

}

.dashboard-card{

margin-bottom:20px;

}

}

@media(max-width:576px){

.account-page{

padding:30px 0;

}

.profile-box{

padding:25px;

}

.profile-box img{

width:80px;

height:80px;

}

.welcome-box h2{

font-size:26px;

}

.dashboard-card{

padding:20px;

}

.dashboard-card h3{

font-size:28px;

}

.recent-orders{

padding:20px;

overflow-x:auto;

}

.recent-orders table{

min-width:650px;

}

}