:root{
    --bg1:#05686f;
    --bg2:#04575d;
    --bg3:#03474d;
    --panel:linear-gradient(180deg, rgba(255,255,255,0.22), rgba(255,255,255,0.13));
    --field-bg:rgba(0,0,0,0.17);
    --field-bg-focus:rgba(0,0,0,0.22);
    --field-text:#ffffff;
    --field-placeholder:rgba(255,255,255,0.42);
    --accent:linear-gradient(180deg, #57dccb 0%, #48c7b7 100%);
    --shadow:0 18px 44px rgba(0,0,0,0.18);
    --panel-border:rgba(255,255,255,0.12);
}

/* =========================
   GLOBAL SAFE RULES
========================= */

html, body{
    min-height:100%;
}

body.mygp3-auth-page{
    overflow-x:hidden;
}

body.mygp3-auth-page,
body.mygp3-auth-page *{
    box-sizing:border-box;
    font-family:Arial, Helvetica, sans-serif;
}

/* =========================
   AUTH PAGES ONLY
========================= */

body.mygp3-auth-page.login-page{
    min-height:100vh;
    background:
        radial-gradient(circle at 10% 30%, rgba(255,255,255,0.08) 0, rgba(255,255,255,0.025) 11%, transparent 12%),
        radial-gradient(circle at 90% 18%, rgba(255,255,255,0.06) 0, rgba(255,255,255,0.02) 9%, transparent 10%),
        radial-gradient(circle at 88% 84%, rgba(255,255,255,0.055) 0, rgba(255,255,255,0.015) 10%, transparent 11%),
        linear-gradient(180deg, var(--bg1) 0%, var(--bg2) 46%, var(--bg3) 100%);
    color:#fff;
    position:relative;
    display:block !important;
}

body.mygp3-auth-page .mygp3-auth-box{
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
}

body.mygp3-auth-page .ring{
    position:absolute;
    border:2px solid rgba(255,255,255,0.08);
    border-radius:50%;
    pointer-events:none;
    z-index:0;
}

body.mygp3-auth-page .ring.left-1{width:260px;height:260px;left:-90px;top:120px;}
body.mygp3-auth-page .ring.left-2{width:330px;height:330px;left:-125px;top:85px;border-color:rgba(255,255,255,0.045);}
body.mygp3-auth-page .ring.right-1{width:250px;height:250px;right:-85px;bottom:95px;}
body.mygp3-auth-page .ring.right-2{width:320px;height:320px;right:-120px;bottom:55px;border-color:rgba(255,255,255,0.045);}

body.mygp3-auth-page .topbar{
    width:100%;
    padding:14px 22px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:relative;
    z-index:2;
}

body.mygp3-auth-page .icon-btn,
body.mygp3-auth-page .lang-btn{
    background:rgba(255,255,255,0.11);
    border:1px solid rgba(255,255,255,0.08);
    color:#fff;
    border-radius:18px;
    height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    backdrop-filter:blur(8px);
}

body.mygp3-auth-page .icon-btn{
    width:42px;
    margin:0 auto;
    font-size:14px;
}

body.mygp3-auth-page .lang-btn{
    padding:0 16px;
    gap:7px;
    font-size:15px;
    font-weight:600;
}

body.mygp3-auth-page .topbar .left,
body.mygp3-auth-page .topbar .center,
body.mygp3-auth-page .topbar .right{
    flex:1;
    display:flex;
    align-items:center;
}

body.mygp3-auth-page .topbar .center{justify-content:center;}
body.mygp3-auth-page .topbar .right{justify-content:flex-end;}

body.mygp3-auth-page .wrapper{
    width:100%;
    max-width:1080px;
    margin:0 auto;
    padding:8px 18px 38px;
    text-align:center;
    position:relative;
    z-index:2;
}

body.mygp3-auth-page .logo{
    width:126px;
    height:126px;
    margin:8px auto 14px;
    border-radius:50%;
    background:linear-gradient(180deg, #ffffff 0%, #dff7f3 100%);
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 12px 30px rgba(0,0,0,0.18);
    overflow:hidden;
}

body.mygp3-auth-page .logo img{
    width:84px;
    height:84px;
    object-fit:contain;
    display:block;
}

body.mygp3-auth-page h1{
    font-size:58px;
    font-weight:800;
    margin:0 0 8px;
    line-height:1.08;
    color:#fff;
    text-shadow:0 2px 0 rgba(0,0,0,0.10);
}

body.mygp3-auth-page .subtitle{
    font-size:23px;
    font-weight:700;
    margin-bottom:28px;
    line-height:1.3;
    color:#fff;
}

body.mygp3-auth-page .msg{
    max-width:960px;
    margin:0 auto 18px;
    padding:14px 18px;
    border-radius:14px;
    color:#fff;
    text-align:left;
    font-size:14px;
    line-height:1.45;
}

body.mygp3-auth-page .msg.error{
    background:rgba(255, 80, 80, 0.15);
    border:1px solid rgba(255, 120, 120, 0.25);
}

body.mygp3-auth-page .msg.success{
    background:rgba(60, 180, 100, 0.16);
    border:1px solid rgba(120, 255, 170, 0.20);
}

body.mygp3-auth-page .panel{
    max-width:1040px;
    margin:0 auto;
    padding:28px 30px 30px;
    border-radius:30px;
    background:var(--panel);
    border:1px solid var(--panel-border);
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.10), var(--shadow);
    backdrop-filter:blur(12px);
    text-align:left;
    overflow:hidden;
}

body.mygp3-auth-page .main-switch{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin-bottom:18px;
}

body.mygp3-auth-page .main-tab{
    height:60px;
    border:none;
    border-radius:18px;
    background:rgba(255,255,255,0.09);
    color:#fff;
    font-size:20px;
    font-weight:700;
    cursor:pointer;
    transition:.18s ease;
}

body.mygp3-auth-page .main-tab.active{
    background:rgba(255,255,255,0.20);
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.12);
}

body.mygp3-auth-page .sub-switch{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-bottom:20px;
}

body.mygp3-auth-page .sub-tab{
    height:52px;
    border:none;
    border-radius:16px;
    background:rgba(255,255,255,0.08);
    color:#fff;
    font-size:17px;
    font-weight:700;
    cursor:pointer;
    transition:.18s ease;
}

body.mygp3-auth-page .sub-tab.active{
    background:rgba(255,255,255,0.18);
}

body.mygp3-auth-page .form-panel{
    display:none;
    animation:fade .22s ease;
}

body.mygp3-auth-page .form-panel.active{
    display:block;
}

body.mygp3-auth-page .form-grid{
    display:grid;
    gap:18px;
}

body.mygp3-auth-page .form-grid.two-cols{
    grid-template-columns:1fr 1fr;
}

body.mygp3-auth-page .field{
    margin-bottom:20px;
}

body.mygp3-auth-page .field label{
    display:block;
    font-size:18px;
    margin-bottom:10px;
    color:rgba(255,255,255,0.96);
    line-height:1.25;
    font-weight:600;
}

body.mygp3-auth-page .input-wrap{
    position:relative;
}

body.mygp3-auth-page .input-wrap input{
    width:100%;
    height:68px;
    border:none;
    outline:none;
    border-radius:18px;
    background:var(--field-bg);
    color:var(--field-text);
    padding:0 20px;
    font-size:18px;
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
    transition:.18s ease;
}

body.mygp3-auth-page .input-wrap input::placeholder{
    color:var(--field-placeholder);
}

body.mygp3-auth-page .input-wrap input:focus{
    background:var(--field-bg-focus);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.05),
        0 0 0 2px rgba(81,215,197,0.16);
}

body.mygp3-auth-page .toggle-password{
    position:absolute;
    right:18px;
    top:50%;
    transform:translateY(-50%);
    background:transparent;
    border:none;
    color:rgba(255,255,255,0.85);
    cursor:pointer;
    font-size:22px;
    line-height:1;
}

body.mygp3-auth-page .remember-row{
    margin-top:-2px;
    margin-bottom:20px;
    text-align:left;
}

body.mygp3-auth-page .remember-row-split{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

body.mygp3-auth-page .remember-label{
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:rgba(255,255,255,0.92);
    font-size:17px;
    cursor:pointer;
    user-select:none;
    line-height:1.3;
}

body.mygp3-auth-page .remember-label input[type="checkbox"]{
    width:19px;
    height:19px;
    accent-color:#49c9b7;
    cursor:pointer;
    flex:0 0 auto;
}

body.mygp3-auth-page .mini-link{
    color:#fff;
    text-decoration:none;
    font-size:16px;
    font-weight:600;
}

body.mygp3-auth-page .mini-link:hover{
    text-decoration:underline;
    color:#fff;
}

body.mygp3-auth-page .actions{
    max-width:100%;
    margin:24px auto 0;
    text-align:center;
}

body.mygp3-auth-page .submit-btn{
    width:100%;
    height:72px;
    border:none;
    border-radius:22px;
    background:var(--accent);
    color:#fff;
    font-size:24px;
    cursor:pointer;
    box-shadow:0 0 22px rgba(77, 223, 207, 0.38);
    font-weight:700;
    transition:.18s ease;
}

body.mygp3-auth-page .submit-btn:hover{
    transform:translateY(-1px);
    box-shadow:0 8px 24px rgba(77, 223, 207, 0.28);
}

body.mygp3-auth-page .switch-link{
    margin-top:18px;
    display:inline-block;
    color:#fff;
    text-decoration:none;
    font-size:18px;
    font-weight:600;
    cursor:pointer;
}

body.mygp3-auth-page .switch-link:hover{
    text-decoration:underline;
    color:#fff;
}

body.mygp3-auth-page .profile-dot,
body.mygp3-auth-page .floating-facebook-btn{
    position:fixed;
    right:20px;
    top:40%;
    width:70px;
    height:70px;
    border-radius:50%;
    overflow:hidden;
    box-shadow:0 8px 18px rgba(0,0,0,0.22);
    border:2px solid rgba(255,255,255,0.25);
    z-index:20;
    opacity:.96;
}

body.mygp3-auth-page .floating-facebook-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    background:linear-gradient(135deg, #1877f2 0%, #0d5fd3 100%);
}

body.mygp3-auth-page .floating-facebook-btn svg{
    width:26px;
    height:26px;
    fill:#fff;
}

@keyframes fade{
    from{opacity:.6; transform:translateY(6px);}
    to{opacity:1; transform:translateY(0);}
}

/* =========================
   APP / DASHBOARD SAFE RULES
========================= */

body.mygp3-app-page .brand-link .brand-image{
    max-height:33px;
}

body.mygp3-app-page .user-panel .image img{
    width:34px;
    height:34px;
    object-fit:cover;
}

body.mygp3-app-page .small-box .icon i{
    font-size:58px;
}

body.mygp3-app-page .ref-link-box{
    background:rgba(255,255,255,.16);
    border:1px solid rgba(255,255,255,.25);
    border-radius:8px;
    padding:10px 12px;
    word-break:break-all;
}

body.mygp3-app-page .card.bg-gradient-info .ref-link-box,
body.mygp3-app-page .card.bg-gradient-primary .ref-link-box{
    color:#fff;
}

body.mygp3-app-page .content-header h1{
    font-weight:600;
}

body.mygp3-app-page .table td,
body.mygp3-app-page .table th{
    vertical-align:middle;
}

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

@media (max-width:1200px){
    body.mygp3-auth-page .wrapper{
        max-width:980px;
    }

    body.mygp3-auth-page .panel{
        max-width:950px;
    }

    body.mygp3-auth-page h1{
        font-size:50px;
    }

    body.mygp3-auth-page .subtitle{
        font-size:21px;
    }
}

@media (max-width:992px){
    body.mygp3-auth-page .wrapper{
        max-width:900px;
        padding:8px 16px 30px;
    }

    body.mygp3-auth-page .panel{
        max-width:880px;
        padding:24px 22px 24px;
        border-radius:26px;
    }

    body.mygp3-auth-page h1{
        font-size:44px;
    }

    body.mygp3-auth-page .subtitle{
        font-size:19px;
    }

    body.mygp3-auth-page .main-tab{
        height:54px;
        font-size:18px;
    }

    body.mygp3-auth-page .sub-tab{
        height:48px;
        font-size:16px;
    }

    body.mygp3-auth-page .field label{
        font-size:17px;
    }

    body.mygp3-auth-page .input-wrap input{
        height:62px;
        font-size:17px;
        border-radius:16px;
    }

    body.mygp3-auth-page .submit-btn{
        height:66px;
        font-size:22px;
        border-radius:20px;
    }

    body.mygp3-auth-page .switch-link,
    body.mygp3-auth-page .mini-link,
    body.mygp3-auth-page .remember-label{
        font-size:15px;
    }
}

@media (max-width:768px){
    body.mygp3-auth-page .topbar{
        padding:12px 14px 0;
    }

    body.mygp3-auth-page .wrapper{
        padding:6px 12px 26px;
    }

    body.mygp3-auth-page .logo{
        width:110px;
        height:110px;
        margin:10px auto 12px;
    }

    body.mygp3-auth-page .logo img{
        width:72px;
        height:72px;
    }

    body.mygp3-auth-page h1{
        font-size:36px;
    }

    body.mygp3-auth-page .subtitle{
        font-size:17px;
        margin-bottom:20px;
    }

    body.mygp3-auth-page .panel{
        padding:18px 14px 18px;
        border-radius:22px;
    }

    body.mygp3-auth-page .main-switch,
    body.mygp3-auth-page .sub-switch,
    body.mygp3-auth-page .form-grid.two-cols{
        grid-template-columns:1fr;
    }

    body.mygp3-auth-page .field{
        margin-bottom:16px;
    }

    body.mygp3-auth-page .field label{
        font-size:15px;
        margin-bottom:8px;
    }

    body.mygp3-auth-page .input-wrap input{
        height:56px;
        font-size:16px;
        padding:0 16px;
        border-radius:15px;
    }

    body.mygp3-auth-page .toggle-password{
        right:14px;
        font-size:20px;
    }

    body.mygp3-auth-page .submit-btn{
        height:58px;
        font-size:19px;
        border-radius:18px;
    }

    body.mygp3-auth-page .floating-facebook-btn,
    body.mygp3-auth-page .profile-dot{
        width:56px;
        height:56px;
        right:14px;
        top:auto;
        bottom:18px;
    }

    body.mygp3-auth-page .floating-facebook-btn svg{
        width:22px;
        height:22px;
    }
}

@media (max-width:480px){
    body.mygp3-auth-page h1{
        font-size:31px;
    }

    body.mygp3-auth-page .subtitle{
        font-size:15px;
    }

    body.mygp3-auth-page .main-tab{
        font-size:17px;
    }

    body.mygp3-auth-page .sub-tab{
        font-size:15px;
    }
}

/* ===== FORCE ACTIVE STYLE ===== */
.sidebar-dark-primary .nav-sidebar .nav-link.active {
    background: #1e88e5 !important;
    color: #fff !important;
    border-radius: 10px;
    margin: 6px 10px;
    box-shadow: 0 6px 16px rgba(30,136,229,0.35);
}

/* ICON FIX */
.sidebar-dark-primary .nav-sidebar .nav-link.active i {
    color: #fff !important;
}

/* TEXT FIX */
.sidebar-dark-primary .nav-sidebar .nav-link.active p {
    color: #fff !important;
}

/* LEFT BLUE STRIP */
.sidebar-dark-primary .nav-sidebar .nav-link.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 3px;
    background: #42a5f5;
    border-radius: 0 4px 4px 0;
}

/* REMOVE OLD ADMINLTE ACTIVE STYLE */
.nav-sidebar .nav-link.active {
    background: none;
}
.nav-sidebar .nav-link {
    margin: 4px 10px;
    border-radius: 10px;
    transition: all 0.2s ease;
}

.nav-sidebar .nav-link:hover {
    background: rgba(255,255,255,0.05);
}