/* FULL MODERN REDESIGN */
*{margin:0;padding:0;box-sizing:border-box}
:root{
--primary:#0f766e;
--secondary:#1d4ed8;
--gold:#f59e0b;
--dark:#0f172a;
--light:#f8fafc;
--card:#ffffffcc;
}
body{
    margin:0;
    min-height:100vh;
    display:flex;
    flex-direction:column;
}
/* ОСНОВНОЙ КОНТЕНТ */
.wrapper,
.layout{
    flex:1;
}

body::before,body::after{
content:'';
position:fixed;
top:0;
width:140px;
height:100vh;
background-size:cover;
background-position:center;
opacity:.18;
z-index:-1;
}
body::before{left:0;background-image:url('../img/left.jpg'); width: 28%;}
body::after{right:0;background-image:url('../img/right.jpg'); width: 28%;}
header{
min-height:330px;
background:linear-gradient(rgba(15,23,42,.72),rgba(15,23,42,.72)),url('../img/header-modern.png') center/cover no-repeat;
display:flex;
align-items:center;
padding:25px 40px;
border-bottom:4px solid var(--gold);
box-shadow:0 15px 40px rgba(0,0,0,.15);
position:relative;
}
/* круг кнопка */
.social_icon{
    width:46px;
    margin: 3px;
    height:46px;
    border-radius:50%;
    background:rgba(255,255,255,.18);
    backdrop-filter:blur(8px);
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.25s;
    border:1px solid rgba(255,255,255,.25);
}

.social_icon:hover{
    transform:translateY(-3px) scale(1.06);
    background:rgba(255,255,255,.28);
}

/* картинки */
.social_icon img{
width: auto;
    height: 60px;
    object-fit:contain;
}

/* телефон */
@media(max-width:900px){

    .header_social{
        position:static;
        justify-content:center;
        margin-top:14px;
        padding:0;
        width:100%;
    }

    .social_icon{
        width:42px;
        height:42px;
    }

    .social_icon img{
        width:20px;
        height:20px;
    }
}
header .container{position:relative; width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px}
.header_text{display:flex;align-items:center;gap:22px;color:#fff}
.header_text img{width:120px;height:120px;border-radius:24px;object-fit:cover;border:4px solid rgba(255,255,255,.35)}
.header_titles{max-width:760px}
.title-main{font-size:34px;font-weight:800;line-height:1.2}
.title-sub{font-size:15px;opacity:.95;margin-top:10px}
.layout{display:flex;gap:24px;padding:30px 150px 40px}
.sidebar{
width:290px;
background:rgba(255,255,255,.8);
backdrop-filter:blur(16px);
border-radius:24px;
padding:18px;
box-shadow:0 20px 40px rgba(15,23,42,.08);
}
.menu{list-style:none;
    padding:0;
    margin:0;}
.menu li{
    margin-bottom:8px;
}
.menu a{
display:flex;
    align-items:center;
    gap:10px;
    padding:14px 16px;
    border-radius:14px;
    text-decoration:none;
    color:#0f172a;
    font-weight:600;
    transition:.25s;
    position:relative;
}
.menu a:hover{
    background:#f1f5f9;
}

/* active */
.menu a.active{
    background:linear-gradient(90deg,#0f766e,#1d4ed8);
    color:#fff;
}

/* dropdown parent */
.has-children > a{
    justify-content:space-between;
}

/* arrow closed */
.has-children > a::after{
    content:"▸";
    font-size:15px;
    color:#64748b;
    transition:.25s ease;
}

/* arrow open */
.has-children.open > a::after{
    content:"▾";
    color:#2563eb;
    transform:translateY(1px);
}

/* active parent */
.has-children.open > a{
    background:#eef4ff;
    color:#1d4ed8;
}

/* submenu */
.submenu{
    list-style:none;
    padding:6px 0 0 18px;
    margin:0;
    display:none;
    border-left:2px solid #dbeafe;
}

/* show submenu */
.has-children.open > .submenu{
    display:block;
}

/* submenu links */
.submenu a{
    padding:11px 14px;
    font-size:14px;
    color:#334155;
    border-radius:10px;
    margin-bottom:6px;
}

/* submenu hover */
.submenu a:hover{
    background:#f8fafc;
    color:#1d4ed8;
}
main{
flex:1;
background:rgba(255,255,255,.82);
backdrop-filter:blur(14px);
border-radius:28px;
padding:32px;
box-shadow:0 20px 45px rgba(15,23,42,.08);
}
main h2{font-size:28px;margin-bottom:18px;color:var(--secondary)}
main p{font-size:16px;line-height:1.7;color:#334155}
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:25px}
.stat-card{background:#fff;padding:22px;border-radius:22px;box-shadow:0 10px 25px rgba(0,0,0,.06)}
table{width:100%;border-collapse:separate;border-spacing:0 10px;margin-top:20px}
th{background:#dbeafe;padding:14px;text-align:left}
td{background:#fff;padding:14px}
th:first-child,td:first-child{border-radius:12px 0 0 12px}
th:last-child,td:last-child{border-radius:0 12px 12px 0}
button,.auth-btn{
background:linear-gradient(90deg,var(--primary),var(--secondary));
color:#fff;border:none;padding:12px 18px;border-radius:14px;font-weight:700;cursor:pointer}
button:hover,.auth-btn:hover{filter:brightness(1.06)}
/* FOOTER */
footer{
    margin-top:auto;
    padding:18px;
    background:var(--dark);
    color:#fff;
    text-align:center;
}
.auth-modal{max-width:430px;background:#fff;padding:28px;border-radius:24px;box-shadow:0 25px 50px rgba(0,0,0,.18)}
.auth-group input{width:100%;padding:12px 14px;border:1px solid #cbd5e1;border-radius:12px}
@media(max-width:1200px){.layout{padding:25px}.sidebar{width:250px}body::before,body::after{display:none}}
@media(max-width:900px){.layout{flex-direction:column}.sidebar{width:100%}.title-main{font-size:26px}header{padding:20px}}
/* =========================
   MOBILE ADAPTIVE
========================= */
@media (max-width: 900px){

/* боковые картинки убрать */
body::before,
body::after{
    display:none;
}

/* header */
header{
    min-height:auto;
    padding:18px 14px;
}

header .container{
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:14px;
}

.header_text{
    flex-direction:column;
    gap:12px;
}

.header_text img{
    width:88px;
    height:88px;
    border-radius:18px;
}

.header_titles{
    max-width:100%;
}

.title-main{
    font-size:20px;
    line-height:1.35;
}

.title-sub{
    font-size:13px;
}

/* layout */
.layout{
    flex-direction:column;
    gap:16px;
    padding:14px;
}

/* sidebar */
.sidebar{
    width:100%;
    padding:14px;
    border-radius:20px;
}

/* menu */
.menu a{
    padding:13px 14px;
    font-size:15px;
    border-radius:12px;
}

/* submenu */
.submenu{
    padding-left:14px;
}

/* content */
main{
    padding:18px;
    border-radius:22px;
}

main h2{
    font-size:22px;
}

main p{
    font-size:15px;
    line-height:1.6;
}

/* cards */
.card-grid{
    grid-template-columns:1fr;
    gap:14px;
}

.stat-card{
    padding:18px;
    border-radius:18px;
}

/* table scroll */
table{
    display:block;
    overflow-x:auto;
    white-space:nowrap;
}

/* buttons */
button,
.auth-btn{
    width:100%;
    padding:13px;
}

/* modal */
.auth-modal{
    width:100%;
    max-width:100%;
    margin:14px;
    padding:20px;
    border-radius:20px;
}

/* footer */
footer{
    padding:14px;
    font-size:14px;
}

}

/* EXTRA SMALL PHONE */
@media (max-width: 480px){

.title-main{
    font-size:17px;
}

.title-sub{
    font-size:12px;
}

.header_text img{
    width:74px;
    height:74px;
}

.menu a{
    font-size:14px;
}

main h2{
    font-size:19px;
}

main{
    padding:15px;
}

}