:root{
    --eo-bg:#04101f;
    --eo-side:#06182d;
    --eo-panel:#0a2038;
    --eo-panel-2:#0e2845;
    --eo-line:rgba(92,151,210,.28);
    --eo-text:#f1f6fb;
    --eo-muted:#8fa7bf;
    --eo-gold:#d3aa57;
    --eo-blue:#48a6e9;
    --eo-green:#1bb693;
    --eo-danger:#df6570;
    --eo-radius:18px;
}

html,
body{
    background:
        radial-gradient(circle at 72% 0,rgba(44,91,143,.17),transparent 34%),
        var(--eo-bg)!important;
    color:var(--eo-text);
}

body.elia-orbit-role{
    margin:0;
    min-height:100vh;
    color:var(--eo-text);
    background:var(--eo-bg);
}

.eo-shell{
    min-height:100vh;
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
}

.eo-sidebar{
    position:sticky;
    top:0;
    height:100vh;
    padding:18px 14px;
    overflow:auto;
    background:
        linear-gradient(180deg,#071c34,#041427 72%,#03101f);
    border-right:1px solid var(--eo-line);
}

.eo-brand{
    display:flex;
    align-items:center;
    gap:10px;
    padding:4px 4px 22px;
    border-bottom:1px solid var(--eo-line);
    margin-bottom:18px;
}

.eo-brand strong{
    font-size:22px;
    color:#fff;
}

.eo-brand b{
    color:#f34f63;
}

.eo-brand span{
    color:#58a9ff;
}

.eo-menu-title{
    padding:10px 6px 8px;
    color:#7e94aa;
    font-size:10px;
    font-weight:900;
    letter-spacing:.17em;
    text-transform:uppercase;
}

.eo-nav{
    display:grid;
    gap:5px;
}

.eo-nav a{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:42px;
    padding:0 12px;
    border-radius:10px;
    color:#a9bad0;
    text-decoration:none;
    font-size:13px;
    font-weight:750;
    transition:.2s ease;
}

.eo-nav a:hover,
.eo-nav a.active{
    color:#081522;
    background:
        linear-gradient(
            90deg,
            #74b6ff,
            #f5d27d
        );
}

.eo-main{
    min-width:0;
}

.eo-topbar{
    min-height:62px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:10px 22px;
    border-bottom:1px solid var(--eo-line);
    background:rgba(3,16,31,.82);
    backdrop-filter:blur(15px);
}

.eo-search{
    width:min(420px,46vw);
    min-height:40px;
    padding:0 14px;
    border:1px solid var(--eo-line);
    border-radius:10px;
    background:#082039;
    color:#fff;
}

.eo-role{
    display:flex;
    align-items:center;
    gap:10px;
    color:#dce6ef;
    font-size:13px;
    font-weight:800;
}

.eo-page{
    width:min(1500px,calc(100% - 40px));
    margin:20px auto 34px;
}

.eo-breadcrumb{
    color:#8097af;
    font-size:12px;
    margin-bottom:14px;
}

.eo-hero{
    position:relative;
    overflow:hidden;
    min-height:170px;
    padding:30px;
    border:1px solid var(--eo-line);
    border-radius:var(--eo-radius);
    background:
        linear-gradient(
            90deg,
            rgba(6,25,45,.98),
            rgba(7,31,54,.84) 48%,
            rgba(7,31,54,.38)
        ),
        url('/assets/tours/kapadokya.svg')
        center/cover no-repeat;
    box-shadow:0 20px 70px rgba(0,0,0,.18);
}

.eo-hero:after{
    content:"";
    position:absolute;
    right:8%;
    top:18px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:
        radial-gradient(circle at 36% 30%,#42c2ef,#14266f 60%,#07112b);
    box-shadow:
        0 0 42px rgba(75,126,255,.4),
        inset 0 0 0 1px rgba(255,255,255,.1);
}

.eo-eyebrow{
    position:relative;
    z-index:2;
    display:block;
    margin-bottom:8px;
    color:#d8b76c;
    font-size:10px;
    font-weight:900;
    letter-spacing:.2em;
    text-transform:uppercase;
}

.eo-hero h1{
    position:relative;
    z-index:2;
    margin:0;
    font:700 clamp(30px,3vw,44px)/1.04 Georgia,serif;
}

.eo-hero p{
    position:relative;
    z-index:2;
    max-width:780px;
    color:#bac9d8;
    margin:10px 0 0;
    line-height:1.6;
}

.eo-actions{
    position:relative;
    z-index:2;
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:18px;
}

.eo-btn{
    min-height:40px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 15px;
    border-radius:9px;
    border:1px solid var(--eo-line);
    background:#0d2844;
    color:#fff;
    text-decoration:none;
    font-weight:850;
    font-size:12px;
}

.eo-btn.gold{
    background:linear-gradient(90deg,#efbd58,#f7d886);
    color:#092038;
    border-color:#f2ca77;
}

.eo-kpis{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin-top:12px;
}

.eo-kpi{
    padding:16px;
    border:1px solid var(--eo-line);
    border-radius:14px;
    background:
        linear-gradient(
            145deg,
            rgba(15,48,79,.95),
            rgba(7,29,51,.98)
        );
}

.eo-kpi small{
    display:block;
    color:#91a8bd;
    font-size:10px;
}

.eo-kpi strong{
    display:block;
    margin-top:5px;
    font-size:25px;
    color:#fff;
}

.eo-section-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:18px 0 10px;
}

.eo-section-head h2{
    margin:0;
    font:700 20px Georgia,serif;
}

.eo-module-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.eo-module{
    min-height:110px;
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:flex-end;
    padding:14px;
    border-radius:13px;
    border:1px solid var(--eo-line);
    text-decoration:none;
    color:white;
    background:
        linear-gradient(
            0deg,
            rgba(3,13,24,.96),
            rgba(5,21,37,.18)
        ),
        var(--eo-image,linear-gradient(145deg,#173e64,#0a1c31));
    background-size:cover;
    background-position:center;
}

.eo-module strong{
    display:block;
    font:700 16px Georgia,serif;
}

.eo-module small{
    display:block;
    margin-top:3px;
    color:#c3d0db;
}

.eo-panel-grid{
    display:grid;
    grid-template-columns:1.45fr 1fr .8fr;
    gap:12px;
    margin-top:14px;
}

.eo-card{
    padding:16px;
    border:1px solid var(--eo-line);
    border-radius:14px;
    background:#09213a;
}

.eo-card h3{
    margin:0 0 12px;
    font:700 16px Georgia,serif;
}

.eo-list{
    display:grid;
    gap:8px;
}

.eo-list-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:9px 0;
    border-bottom:1px solid rgba(126,168,207,.16);
}

.eo-list-row:last-child{
    border-bottom:0;
}

.eo-status{
    display:inline-flex;
    padding:4px 8px;
    border-radius:999px;
    background:rgba(27,182,147,.15);
    color:#62d6b6;
    font-size:10px;
    font-weight:900;
}

.eo-quick{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
}

.eo-quick a{
    min-height:72px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:12px;
    border:1px solid var(--eo-line);
    border-radius:12px;
    background:#0a2440;
    color:#fff;
    text-decoration:none;
    font-size:12px;
    font-weight:800;
}

.eo-category-group{
    margin-bottom:18px;
}

.eo-category-group > h3{
    margin:0 0 8px;
    color:#d6b972;
    font-size:11px;
    letter-spacing:.1em;
    text-transform:uppercase;
}

@media(max-width:1200px){
    .eo-kpis{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
    .eo-module-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .eo-panel-grid{
        grid-template-columns:1fr 1fr;
    }
    .eo-quick{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media(max-width:760px){
    .eo-shell{
        display:block;
    }
    .eo-sidebar{
        position:fixed;
        inset:0 auto 0 0;
        width:250px;
        z-index:1000;
        transform:translateX(-102%);
        transition:.25s ease;
    }
    body.eo-menu-open .eo-sidebar{
        transform:translateX(0);
    }
    .eo-topbar{
        padding:8px 10px;
    }
    .eo-search{
        display:none;
    }
    .eo-page{
        width:calc(100% - 20px);
        margin:10px auto 24px;
    }
    .eo-hero{
        min-height:150px;
        padding:20px 16px;
    }
    .eo-hero:after{
        width:76px;
        height:76px;
        right:12px;
        top:18px;
        opacity:.8;
    }
    .eo-kpis{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .eo-module-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .eo-panel-grid{
        grid-template-columns:1fr;
    }
    .eo-quick{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:420px){
    .eo-kpi strong{
        font-size:22px;
    }
    .eo-module{
        min-height:94px;
        padding:10px;
    }
}



/* ELITA_V32_UI_ONLY_START */

:root{
    --eo32-bg:#041326;
    --eo32-deep:#061a32;
    --eo32-panel:#092541;
    --eo32-panel2:#071c35;
    --eo32-line:#315c89;
    --eo32-line-soft:rgba(86,139,193,.28);
    --eo32-gold:#e8b755;
    --eo32-gold2:#ffd678;
    --eo32-text:#f7f9fc;
    --eo32-muted:#a8bbd1;
    --eo32-green:#33c77e;
    --eo32-red:#ef6b6b;
}


/* ================================================
   ORTAK ROLE SHELL
   ================================================ */

.eo-shell{
    min-height:100vh!important;

    background:
        radial-gradient(
            circle at 86% 5%,
            rgba(39,110,183,.18),
            transparent 31%
        ),
        #041326!important;

    color:
        var(--eo32-text)!important;
}


/* SIDEBAR */

.eo-sidebar{
    background:
        linear-gradient(
            180deg,
            #061a32,
            #041225
        )!important;

    border-right:
        1px solid
        rgba(74,124,177,.32)!important;

    box-shadow:
        14px 0 40px
        rgba(0,0,0,.18)!important;
}

.eo-brand{
    min-height:78px!important;

    display:flex!important;

    align-items:center!important;

    padding:
        12px 12px 21px!important;

    border-bottom:
        1px solid
        rgba(237,186,85,.22)!important;
}

.eo-brand strong{
    font-size:27px!important;

    letter-spacing:-1px!important;
}

.eo-brand strong b{
    color:#f04444!important;
}

.eo-brand strong span{
    color:#2478ff!important;
}


/* Menü başlığı */

.eo-menu-title{
    margin:
        22px 10px 11px!important;

    color:
        var(--eo32-gold)!important;

    font-size:
        10px!important;

    font-weight:
        900!important;

    letter-spacing:
        .18em!important;
}


/* Sidebar bağlantıları */

.eo-nav{
    display:grid!important;

    gap:7px!important;
}

.eo-nav a{
    min-height:48px!important;

    display:grid!important;

    grid-template-columns:
        34px minmax(0,1fr)!important;

    align-items:center!important;

    padding:
        0 12px!important;

    border:
        1px solid transparent!important;

    border-radius:
        11px!important;

    color:
        #dbe7f2!important;

    background:
        transparent!important;

    text-decoration:
        none!important;

    font-size:
        13px!important;

    font-weight:
        700!important;

    transition:
        .16s ease!important;
}

.eo-nav a > span:first-child{
    color:
        var(--eo32-gold)!important;

    font-size:
        18px!important;
}

.eo-nav a:hover,
.eo-nav a.active{
    color:#fff!important;

    border-color:
        rgba(237,186,85,.48)!important;

    background:
        linear-gradient(
            90deg,
            rgba(237,186,85,.15),
            rgba(10,39,71,.3)
        )!important;

    box-shadow:
        inset 3px 0 0
        var(--eo32-gold)!important;
}


/* ================================================
   TOP BAR
   ================================================ */

.eo-topbar{
    min-height:
        64px!important;

    padding:
        0 22px!important;

    background:
        rgba(4,18,37,.94)!important;

    backdrop-filter:
        blur(18px)!important;

    border-bottom:
        1px solid
        rgba(83,134,185,.27)!important;

    box-shadow:
        0 8px 25px
        rgba(0,0,0,.13)!important;
}

.eo-search{
    height:
        40px!important;

    border:
        1px solid
        #2f557e!important;

    border-radius:
        10px!important;

    padding:
        0 14px!important;

    background:
        #071d37!important;

    color:
        #fff!important;

    outline:
        none!important;
}

.eo-search:focus{
    border-color:
        var(--eo32-gold)!important;

    box-shadow:
        0 0 0 3px
        rgba(232,183,85,.09)!important;
}

.eo-role{
    padding:
        8px 13px!important;

    border:
        1px solid
        rgba(232,183,85,.38)!important;

    border-radius:
        999px!important;

    color:
        var(--eo32-gold)!important;

    background:
        rgba(232,183,85,.07)!important;

    font-weight:
        800!important;
}


/* ================================================
   PANEL ANA ALANI
   ================================================ */

.eo-page{
    width:
        min(1480px,calc(100% - 38px))!important;

    margin:
        0 auto!important;

    padding:
        24px 0 50px!important;
}

.eo-breadcrumb{
    margin-bottom:
        13px!important;

    color:
        #819ab5!important;

    font-size:
        12px!important;
}


/* ================================================
   HERO
   ================================================ */

.eo-hero{
    position:
        relative!important;

    overflow:
        hidden!important;

    min-height:
        205px!important;

    padding:
        34px!important;

    border:
        1px solid
        rgba(75,127,181,.48)!important;

    border-radius:
        19px!important;

    background:
        radial-gradient(
            circle at 82% 40%,
            rgba(232,183,85,.17),
            transparent 23%
        ),
        linear-gradient(
            125deg,
            #0a2a4d,
            #061a32 64%
        )!important;

    box-shadow:
        0 20px 55px
        rgba(0,0,0,.21)!important;
}

.eo-hero::after{
    content:""!important;

    position:absolute!important;

    width:
        260px!important;

    height:
        260px!important;

    right:
        60px!important;

    top:
        -30px!important;

    border:
        1px solid
        rgba(232,183,85,.16)!important;

    border-radius:
        50%!important;

    box-shadow:
        inset 0 0 55px
        rgba(32,111,196,.12)!important;
}

.eo-eyebrow{
    color:
        var(--eo32-gold)!important;

    font-size:
        10px!important;

    font-weight:
        900!important;

    letter-spacing:
        .19em!important;
}

.eo-hero h1{
    position:
        relative!important;

    z-index:2!important;

    max-width:
        800px!important;

    margin:
        8px 0 10px!important;

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        clamp(34px,3.7vw,56px)!important;

    line-height:
        1.02!important;
}

.eo-hero p{
    position:
        relative!important;

    z-index:2!important;

    max-width:
        780px!important;

    color:
        #c1d0e0!important;

    font-size:
        14px!important;

    line-height:
        1.6!important;
}


/* ================================================
   KPI KARTLARI
   ================================================ */

.eo-kpis{
    display:grid!important;

    grid-template-columns:
        repeat(4,minmax(0,1fr))!important;

    gap:
        14px!important;

    margin-top:
        16px!important;
}

.eo-kpi{
    min-height:
        115px!important;

    padding:
        18px!important;

    border:
        1px solid
        rgba(232,183,85,.47)!important;

    border-radius:
        15px!important;

    background:
        linear-gradient(
            145deg,
            #092541,
            #06192f
        )!important;

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.16)!important;
}

.eo-kpi small{
    color:
        #9fb3c9!important;

    font-size:
        11px!important;

    font-weight:
        700!important;
}

.eo-kpi strong{
    display:block!important;

    margin-top:
        6px!important;

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        29px!important;
}


/* ================================================
   MODÜL KARTLARI
   ================================================ */

.eo-modules,
.eo-module-grid{
    display:grid!important;

    grid-template-columns:
        repeat(4,minmax(0,1fr))!important;

    gap:
        14px!important;
}

.eo-module{
    min-height:
        145px!important;

    padding:
        19px!important;

    border:
        1px solid
        #315c87!important;

    border-radius:
        15px!important;

    background:
        linear-gradient(
            145deg,
            #092541,
            #06182e
        )!important;

    color:
        #fff!important;

    text-decoration:
        none!important;

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.12)!important;

    transition:
        transform .17s ease,
        border-color .17s ease!important;
}

.eo-module:hover{
    transform:
        translateY(-3px)!important;

    border-color:
        var(--eo32-gold)!important;
}

.eo-module strong{
    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        19px!important;
}

.eo-module small{
    display:block!important;

    margin-top:
        7px!important;

    color:
        #a6b9cf!important;

    line-height:
        1.45!important;
}


/* ================================================
   HIZLI İŞLEMLER
   ================================================ */

.eo-quick{
    display:grid!important;

    grid-template-columns:
        repeat(3,minmax(0,1fr))!important;

    gap:
        12px!important;
}

.eo-quick a{
    min-height:
        57px!important;

    display:flex!important;

    align-items:center!important;

    gap:
        12px!important;

    padding:
        0 15px!important;

    border:
        1px solid
        #315a84!important;

    border-radius:
        11px!important;

    background:
        #071e39!important;

    color:
        #fff!important;

    text-decoration:
        none!important;

    font-weight:
        700!important;
}


/* ================================================
   ET-NEXT MÜŞTERİ / ACENTE / OKUL / VELİ /
   GEZİ KULÜBÜ
   ================================================ */

.etx-portal-page{
    width:
        min(1450px,calc(100% - 34px))!important;

    margin:
        0 auto!important;

    padding:
        24px 0 45px!important;
}


/* HERO */

.etx-portal-page
.etx-portal-hero{
    min-height:
        205px!important;

    padding:
        29px!important;

    border:
        1px solid
        rgba(232,183,85,.45)!important;

    border-radius:
        18px!important;

    background:
        radial-gradient(
            circle at 85% 25%,
            rgba(232,183,85,.15),
            transparent 24%
        ),
        linear-gradient(
            120deg,
            #09294b,
            #06192f
        )!important;

    box-shadow:
        0 18px 45px
        rgba(0,0,0,.18)!important;
}

.etx-portal-page
.etx-portal-hero h1{
    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        clamp(31px,3vw,48px)!important;

    line-height:
        1.05!important;
}

.etx-portal-page
.etx-portal-hero p{
    color:
        #bdcede!important;

    font-size:
        14px!important;

    line-height:
        1.55!important;
}


/* HIZLI MENÜ */

.etx-portal-page
.etx-quick-row{
    display:grid!important;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(160px,1fr)
        )!important;

    gap:
        10px!important;

    margin:
        14px 0!important;
}

.etx-portal-page
.etx-quick-row a{
    min-height:
        62px!important;

    display:flex!important;

    align-items:center!important;

    gap:
        8px!important;

    padding:
        0 14px!important;

    border:
        1px solid
        #315b87!important;

    border-radius:
        11px!important;

    background:
        linear-gradient(
            145deg,
            #092540,
            #071a31
        )!important;

    color:
        #fff!important;

    text-decoration:
        none!important;

    font-weight:
        700!important;
}


/* İSTATİSTİK */

.etx-portal-page
.etx-stat-row{
    display:grid!important;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(175px,1fr)
        )!important;

    gap:
        12px!important;

    margin:
        14px 0!important;
}

.etx-portal-page
.etx-stat-row > div,
.etx-portal-page
.etx-stat-row .etx-stat{
    min-height:
        105px!important;

    padding:
        17px!important;

    border:
        1px solid
        rgba(232,183,85,.42)!important;

    border-radius:
        14px!important;

    background:
        linear-gradient(
            145deg,
            #092541,
            #06192f
        )!important;
}

.etx-portal-page
.etx-stat-row b{
    color:
        #fff!important;

    font-size:
        25px!important;
}

.etx-portal-page
.etx-stat-row small{
    color:
        #a6b9ce!important;
}


/* KARTLAR */

.etx-portal-page
.etx-card,
.etx-portal-page
section.etx-card{
    border:
        1px solid
        #315a85!important;

    border-radius:
        15px!important;

    background:
        linear-gradient(
            145deg,
            #092440,
            #06182e
        )!important;

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.12)!important;
}

.etx-portal-page
.etx-card h2,
.etx-portal-page
.etx-card h3{
    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;
}


/* TABLO */

.etx-portal-page table{
    width:
        100%!important;

    border-collapse:
        collapse!important;
}

.etx-portal-page th{
    padding:
        11px 12px!important;

    border-bottom:
        1px solid
        #315a85!important;

    color:
        var(--eo32-gold)!important;

    background:
        #071c35!important;

    font-size:
        11px!important;

    text-transform:
        uppercase!important;
}

.etx-portal-page td{
    padding:
        12px!important;

    border-bottom:
        1px solid
        rgba(62,108,153,.25)!important;

    color:
        #d9e5f1!important;
}


/* FORMLAR */

.etx-portal-page
input,
.etx-portal-page
select,
.etx-portal-page
textarea{
    border:
        1px solid
        #31577d!important;

    border-radius:
        9px!important;

    background:
        #061b33!important;

    color:
        #fff!important;
}

.etx-portal-page
button,
.etx-portal-page
.button{
    border:
        1px solid
        #f0c66e!important;

    border-radius:
        9px!important;

    background:
        linear-gradient(
            180deg,
            #f6cd72,
            #e2aa42
        )!important;

    color:
        #06182d!important;

    font-weight:
        800!important;
}


/* ================================================
   GUIDE / DRIVER / ADMIN MEVCUT PANELLER
   ================================================ */

.guide-dashboard,
.guide-panel,
.et-sofor-panel,
.et-sofor-dashboard{
    color:
        #eef5fc!important;
}

.guide-dashboard section,
.guide-panel section,
.et-sofor-panel section,
.et-sofor-dashboard section{
    border-color:
        #315a85!important;

    border-radius:
        14px!important;

    background:
        linear-gradient(
            145deg,
            #092541,
            #06192f
        )!important;
}


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

@media(max-width:1200px){

    .eo-kpis,
    .eo-modules,
    .eo-module-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr))!important;
    }

}


@media(max-width:760px){

    .eo-page,
    .etx-portal-page{
        width:
            calc(100% - 20px)!important;
    }

    .eo-hero{
        min-height:
            0!important;

        padding:
            23px!important;
    }

    .eo-hero::after{
        display:none!important;
    }

    .eo-kpis,
    .eo-modules,
    .eo-module-grid,
    .eo-quick{
        grid-template-columns:
            1fr!important;
    }

    .etx-portal-page
    .etx-portal-hero{
        min-height:
            0!important;

        padding:
            22px!important;
    }

    .etx-portal-page
    .etx-quick-row,
    .etx-portal-page
    .etx-stat-row{
        grid-template-columns:
            1fr!important;
    }

}


/* ELITA_V32_UI_ONLY_END */



/* ELITA_V32_FINAL_APP_CSS_START */


/* ========================================================
   ROLE COLORS
   ======================================================== */

body.eo-app-ui{
    --eo-final-accent:#e8b755;
    --eo-final-bg:#041326;
    --eo-final-panel:#08233f;
    --eo-final-panel2:#061a31;
    --eo-final-line:#315b86;
    --eo-final-text:#f7f9fc;
    --eo-final-muted:#9eb2c8;

    background:
        radial-gradient(
            circle at 90% 0,
            rgba(36,108,184,.13),
            transparent 30%
        ),
        #041326!important;

    color:
        var(--eo-final-text)!important;
}


body.eo-role-agency{
    --eo-final-accent:#b990ff;
}

body.eo-role-school{
    --eo-final-accent:#5ed7d0;
}

body.eo-role-parent{
    --eo-final-accent:#f1c56a;
}

body.eo-role-driver{
    --eo-final-accent:#6fb7ff;
}

body.eo-role-guide{
    --eo-final-accent:#70dca8;
}

body.eo-role-club{
    --eo-final-accent:#d59aff;
}

body.eo-role-operations{
    --eo-final-accent:#ffbf57;
}

body.eo-role-finance{
    --eo-final-accent:#62d8a3;
}


/* ========================================================
   ROLE APP HEADER
   ======================================================== */

.eo-app-rolebar{
    width:
        min(1480px,calc(100% - 34px));

    min-height:
        130px;

    margin:
        22px auto 17px;

    padding:
        22px 25px;

    display:grid;

    grid-template-columns:
        185px minmax(0,1fr) auto;

    align-items:center;

    gap:
        24px;

    border:
        1px solid
        rgba(232,183,85,.38);

    border-radius:
        17px;

    background:
        radial-gradient(
            circle at 85% 50%,
            rgba(45,119,199,.18),
            transparent 25%
        ),
        linear-gradient(
            120deg,
            #092a4b,
            #06192f
        );

    box-shadow:
        0 18px 50px
        rgba(0,0,0,.18);
}

.eo-app-rolebar-brand img{
    display:block;

    width:
        165px;

    max-width:
        100%;

    height:auto;
}

.eo-app-rolebar-copy span{
    color:
        var(--eo-final-accent);

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .18em;
}

.eo-app-rolebar-copy h1{
    margin:
        5px 0 5px!important;

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        clamp(26px,2.5vw,39px)!important;
}

.eo-app-rolebar-copy p{
    margin:
        0!important;

    color:
        #aebfd1!important;

    font-size:
        13px!important;
}

.eo-app-home{
    min-height:
        42px;

    display:flex;

    align-items:center;

    padding:
        0 16px;

    border:
        1px solid
        var(--eo-final-accent);

    border-radius:
        9px;

    color:
        var(--eo-final-accent)!important;

    background:
        rgba(4,18,37,.34);

    text-decoration:
        none!important;

    font-size:
        12px;

    font-weight:
        800;
}


/* ========================================================
   APP LAYOUT TOP BAR
   ======================================================== */

body.eo-app-ui > .top{
    border-bottom:
        1px solid
        rgba(67,119,172,.42)!important;

    background:
        #06182e!important;

    box-shadow:
        0 10px 32px
        rgba(0,0,0,.16)!important;
}

body.eo-app-ui > .top nav a{
    color:
        #dce8f4!important;

    font-weight:
        700!important;
}

body.eo-app-ui > .top nav a:hover{
    color:
        var(--eo-final-accent)!important;
}


/* ========================================================
   GUIDE / DRIVER / OPERATIONS / FINANCE
   GENERIC APPLICATION SURFACE
   ======================================================== */

body.eo-role-guide main,
body.eo-role-driver main,
body.eo-role-operations main,
body.eo-role-finance main{
    width:
        100%!important;

    max-width:
        none!important;
}


/* section */

body.eo-role-guide main > section:not(.eo-app-rolebar),
body.eo-role-driver main > section:not(.eo-app-rolebar),
body.eo-role-operations main > section:not(.eo-app-rolebar),
body.eo-role-finance main > section:not(.eo-app-rolebar){

    width:
        min(1480px,calc(100% - 34px))!important;

    margin:
        0 auto 18px!important;

    padding:
        23px!important;

    border:
        1px solid
        var(--eo-final-line)!important;

    border-radius:
        16px!important;

    background:
        linear-gradient(
            145deg,
            #092541,
            #06192f
        )!important;

    box-shadow:
        0 15px 38px
        rgba(0,0,0,.14)!important;
}


/* cards */

body.eo-app-ui main .card,
body.eo-app-ui main .admin-card,
body.eo-app-ui main .guide-card,
body.eo-app-ui main .et-sofor-card{

    border:
        1px solid
        var(--eo-final-line)!important;

    border-radius:
        14px!important;

    background:
        linear-gradient(
            145deg,
            #0a2948,
            #071a31
        )!important;

    color:
        #eef5fc!important;

    box-shadow:
        0 10px 27px
        rgba(0,0,0,.11)!important;
}


/* grids */

body.eo-app-ui main .grid{
    gap:
        13px!important;
}


/* headings */

body.eo-app-ui main h1,
body.eo-app-ui main h2,
body.eo-app-ui main h3{

    color:
        #fff!important;
}

body.eo-app-ui main h1,
body.eo-app-ui main h2{

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;
}

body.eo-app-ui main .eyebrow,
body.eo-app-ui main .admin-eyebrow{

    color:
        var(--eo-final-accent)!important;

    font-weight:
        900!important;

    letter-spacing:
        .14em!important;
}


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

body.eo-app-ui main .table{
    overflow-x:
        auto!important;

    border:
        1px solid
        rgba(64,112,159,.42)!important;

    border-radius:
        12px!important;
}

body.eo-app-ui main table{
    width:
        100%!important;

    border-collapse:
        collapse!important;

    background:
        #071c34!important;
}

body.eo-app-ui main th{
    padding:
        12px 13px!important;

    border-bottom:
        1px solid
        #375e86!important;

    background:
        #06182d!important;

    color:
        var(--eo-final-accent)!important;

    font-size:
        11px!important;

    font-weight:
        900!important;

    text-align:
        left!important;
}

body.eo-app-ui main td{
    padding:
        12px 13px!important;

    border-bottom:
        1px solid
        rgba(58,103,149,.25)!important;

    color:
        #d9e5f0!important;
}

body.eo-app-ui main tr:hover td{
    background:
        rgba(47,105,165,.08)!important;
}


/* ========================================================
   FORMS
   ======================================================== */

body.eo-app-ui main label{
    color:
        #c6d4e3!important;

    font-size:
        12px!important;

    font-weight:
        700!important;
}

body.eo-app-ui main input,
body.eo-app-ui main select,
body.eo-app-ui main textarea{

    min-height:
        42px!important;

    border:
        1px solid
        #31587e!important;

    border-radius:
        9px!important;

    background:
        #061b33!important;

    color:
        #fff!important;

    outline:
        none!important;
}

body.eo-app-ui main textarea{
    min-height:
        110px!important;
}

body.eo-app-ui main input:focus,
body.eo-app-ui main select:focus,
body.eo-app-ui main textarea:focus{

    border-color:
        var(--eo-final-accent)!important;

    box-shadow:
        0 0 0 3px
        rgba(232,183,85,.08)!important;
}


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

body.eo-app-ui main .btn,
body.eo-app-ui main button:not(.eo-menu-toggle),
body.eo-app-ui main input[type=submit]{

    border:
        1px solid
        var(--eo-final-accent)!important;

    border-radius:
        9px!important;

    background:
        var(--eo-final-accent)!important;

    color:
        #06182d!important;

    font-weight:
        900!important;
}


/* ========================================================
   ADMIN OPERATIONS / FINANCE HERO
   ======================================================== */

body.eo-role-operations .admin-hero,
body.eo-role-finance .admin-hero{

    padding:
        28px!important;

    border:
        1px solid
        rgba(232,183,85,.38)!important;

    border-radius:
        17px!important;

    background:
        radial-gradient(
            circle at 88% 30%,
            rgba(232,183,85,.12),
            transparent 25%
        ),
        linear-gradient(
            120deg,
            #0a2a4a,
            #06192f
        )!important;
}


/* ========================================================
   EXISTING EO SHELL - FINAL POLISH
   ======================================================== */

.eo-shell .eo-sidebar{
    width:
        258px!important;
}

.eo-shell .eo-main{
    min-width:
        0!important;
}

.eo-shell .eo-nav a{
    font-size:
        13.5px!important;
}

.eo-shell .eo-kpi strong{
    font-size:
        31px!important;
}

.eo-shell .eo-module{
    min-height:
        155px!important;
}

.eo-shell .eo-section-head h2{
    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        26px!important;
}


/* ========================================================
   ET NEXT PORTAL FINAL POLISH
   ======================================================== */

.etx-portal-page{
    color:
        #eef5fc!important;
}

.etx-portal-page .etx-list-row{
    border:
        1px solid
        rgba(60,107,155,.42)!important;

    border-radius:
        11px!important;

    background:
        #071d37!important;
}

.etx-portal-page a{
    transition:
        .16s ease!important;
}


/* ========================================================
   STATUS BADGES
   ======================================================== */

body.eo-app-ui main
:where(
    .badge,
    .status,
    .pill
){
    display:inline-flex!important;

    align-items:center!important;

    min-height:
        28px!important;

    padding:
        0 9px!important;

    border:
        1px solid
        rgba(232,183,85,.39)!important;

    border-radius:
        999px!important;

    color:
        #f2c767!important;

    background:
        rgba(232,183,85,.07)!important;

    font-size:
        10px!important;

    font-weight:
        800!important;
}


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

@media(max-width:900px){

    .eo-app-rolebar{
        grid-template-columns:
            145px minmax(0,1fr)!important;

        gap:
            16px!important;
    }

    .eo-app-home{
        grid-column:
            1 / -1!important;

        width:
            max-content!important;
    }

}


@media(max-width:640px){

    .eo-app-rolebar{
        width:
            calc(100% - 18px)!important;

        grid-template-columns:
            1fr!important;

        padding:
            20px!important;
    }

    .eo-app-rolebar-brand img{
        width:
            145px!important;
    }

    body.eo-role-guide main > section:not(.eo-app-rolebar),
    body.eo-role-driver main > section:not(.eo-app-rolebar),
    body.eo-role-operations main > section:not(.eo-app-rolebar),
    body.eo-role-finance main > section:not(.eo-app-rolebar){

        width:
            calc(100% - 18px)!important;

        padding:
            17px!important;
    }

    .eo-shell .eo-sidebar{
        width:
            min(295px,88vw)!important;
    }

}


/* ELITA_V32_FINAL_APP_CSS_END */



/* ELITA_V32_2_PANEL_CSS_START */


/* =======================================================
   ELIA ORBIT APPLICATION SYSTEM
   ======================================================= */

body.eo32-app{

    --eo32-bg:#031225;
    --eo32-deep:#061a32;
    --eo32-card:#092641;
    --eo32-card2:#061a31;
    --eo32-line:#315b86;
    --eo32-gold:#e9b957;
    --eo32-text:#f5f8fc;
    --eo32-muted:#9eb2c9;
    --eo32-good:#3bcf8a;
    --eo32-warn:#f1bd54;
    --eo32-bad:#f06d72;

    background:
        radial-gradient(
            circle at 88% 0,
            rgba(40,112,190,.14),
            transparent 31%
        ),
        #031225!important;

    color:
        var(--eo32-text)!important;
}


/* role accent */

body.eo32-role-customer{
    --eo-role:#e9b957;
}

body.eo32-role-agency{
    --eo-role:#bc94ff;
}

body.eo32-role-school{
    --eo-role:#62dad1;
}

body.eo32-role-parent{
    --eo-role:#efc36b;
}

body.eo32-role-driver{
    --eo-role:#69b7ff;
}

body.eo32-role-guide{
    --eo-role:#63daa3;
}

body.eo32-role-club{
    --eo-role:#d59aff;
}

body.eo32-role-operations{
    --eo-role:#ffbf59;
}

body.eo32-role-finance{
    --eo-role:#57d69e;
}


/* =======================================================
   APPLICATION HEADER
   ======================================================= */

.eo32-app-header{

    width:
        min(1480px,calc(100% - 34px));

    min-height:
        132px;

    margin:
        22px auto 16px;

    display:grid;

    grid-template-columns:
        175px minmax(0,1fr) auto;

    align-items:center;

    gap:
        25px;

    padding:
        23px 26px;

    border:
        1px solid
        rgba(232,183,85,.38);

    border-radius:
        18px;

    background:
        radial-gradient(
            circle at 86% 40%,
            rgba(52,128,207,.19),
            transparent 25%
        ),
        linear-gradient(
            120deg,
            #0a2b4d,
            #061a31 66%
        );

    box-shadow:
        0 20px 55px
        rgba(0,0,0,.21);
}


.eo32-app-logo img{

    display:block;

    width:
        165px;

    max-width:
        100%;

    height:auto;
}


.eo32-app-copy span{

    color:
        var(--eo-role,var(--eo32-gold));

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .18em;
}


.eo32-app-copy h1{

    margin:
        6px 0 5px!important;

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        clamp(
            27px,
            2.7vw,
            42px
        )!important;

    line-height:
        1!important;
}


.eo32-app-copy p{

    margin:0!important;

    color:
        #aabdd0!important;

    font-size:
        13px!important;
}


.eo32-app-actions{

    display:flex;

    flex-wrap:wrap;

    justify-content:flex-end;

    gap:
        8px;
}


.eo32-app-actions a{

    min-height:
        40px;

    display:flex;

    align-items:center;

    padding:
        0 14px;

    border:
        1px solid
        var(--eo-role,var(--eo32-gold));

    border-radius:
        9px;

    background:
        rgba(5,20,39,.5);

    color:
        var(--eo-role,var(--eo32-gold))!important;

    text-decoration:
        none!important;

    font-size:
        11px;

    font-weight:
        900;
}


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

body.eo32-app > .top{

    border-bottom:
        1px solid
        rgba(74,126,180,.34)!important;

    background:
        #06182e!important;

    box-shadow:
        0 8px 30px
        rgba(0,0,0,.15)!important;
}


body.eo32-app > .top nav a{

    color:
        #dbe6f1!important;

    font-weight:
        700!important;
}


body.eo32-app > .top nav a:hover{

    color:
        var(--eo-role,var(--eo32-gold))!important;
}


/* =======================================================
   GENERIC OLD PANEL -> APPLICATION PANEL
   operations / accounting / driver / guide
   ======================================================= */

body.eo32-app main > .section,
body.eo32-app main > section.section{

    width:
        min(
            1480px,
            calc(100% - 34px)
        )!important;

    margin:
        0 auto 22px!important;

    padding:
        25px!important;

    border:
        1px solid
        var(--eo32-line)!important;

    border-radius:
        17px!important;

    background:
        linear-gradient(
            145deg,
            #092641,
            #06192f
        )!important;

    box-shadow:
        0 17px 42px
        rgba(0,0,0,.15)!important;
}


/* main headings */

body.eo32-app main h1{

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;
}


body.eo32-app main h2{

    margin-top:
        27px!important;

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;
}


.eo32-eyebrow,
body.eo32-app main .eyebrow,
body.eo32-app main .admin-eyebrow{

    color:
        var(--eo-role,var(--eo32-gold))!important;

    font-size:
        10px!important;

    font-weight:
        900!important;

    letter-spacing:
        .17em!important;
}


/* =======================================================
   KPI GRID
   ======================================================= */

body.eo32-app main .grid{

    display:grid!important;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(205px,1fr)
        )!important;

    gap:
        13px!important;

    margin:
        15px 0 22px!important;
}


body.eo32-app main .card,
body.eo32-app main .stat{

    min-height:
        112px!important;

    padding:
        18px!important;

    border:
        1px solid
        rgba(232,183,85,.37)!important;

    border-radius:
        14px!important;

    background:
        radial-gradient(
            circle at 100% 0,
            rgba(232,183,85,.07),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            #0a2948,
            #061a31
        )!important;

    color:
        #f5f8fb!important;

    box-shadow:
        0 11px 29px
        rgba(0,0,0,.13)!important;
}


body.eo32-app main .card h3{

    margin:
        0 0 8px!important;

    color:
        #a8bbcf!important;

    font-family:
        inherit!important;

    font-size:
        11px!important;

    font-weight:
        800!important;

    letter-spacing:
        .07em!important;

    text-transform:
        uppercase!important;
}


body.eo32-app main .card strong,
body.eo32-app main .stat b{

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        clamp(
            23px,
            2vw,
            34px
        )!important;
}


/* =======================================================
   ET-NEXT
   customer / agency / school / parent / club
   ======================================================= */

body.eo32-app .etx-portal-page{

    width:
        min(
            1480px,
            calc(100% - 34px)
        )!important;

    margin:
        0 auto!important;

    padding:
        23px 0 46px!important;

    color:
        #eef5fc!important;
}


body.eo32-app
.etx-portal-hero{

    min-height:
        210px!important;

    padding:
        30px!important;

    border:
        1px solid
        rgba(232,183,85,.4)!important;

    border-radius:
        18px!important;

    background:
        radial-gradient(
            circle at 86% 25%,
            rgba(53,130,211,.17),
            transparent 25%
        ),
        linear-gradient(
            120deg,
            #0a2a4b,
            #06192f
        )!important;

    box-shadow:
        0 19px 50px
        rgba(0,0,0,.18)!important;
}


body.eo32-app
.etx-portal-hero h1{

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        clamp(
            31px,
            3vw,
            48px
        )!important;
}


body.eo32-app
.etx-portal-hero p{

    color:
        #b8cada!important;

    line-height:
        1.6!important;
}


/* quick nav */

body.eo32-app
.etx-quick-row{

    display:grid!important;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(165px,1fr)
        )!important;

    gap:
        10px!important;

    margin:
        14px 0!important;
}


body.eo32-app
.etx-quick-row a{

    min-height:
        62px!important;

    display:flex!important;

    align-items:center!important;

    gap:
        9px!important;

    padding:
        0 14px!important;

    border:
        1px solid
        var(--eo32-line)!important;

    border-radius:
        11px!important;

    background:
        linear-gradient(
            145deg,
            #092541,
            #071a31
        )!important;

    color:
        #fff!important;

    text-decoration:
        none!important;

    font-size:
        12px!important;

    font-weight:
        800!important;
}


body.eo32-app
.etx-quick-row a:hover{

    border-color:
        var(--eo-role,var(--eo32-gold))!important;

    transform:
        translateY(-2px)!important;
}


/* stats */

body.eo32-app
.etx-stat-row{

    display:grid!important;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(190px,1fr)
        )!important;

    gap:
        12px!important;

    margin:
        14px 0!important;
}


body.eo32-app
.etx-stat-row > div,
body.eo32-app
.etx-stat{

    min-height:
        110px!important;

    padding:
        17px!important;

    border:
        1px solid
        rgba(232,183,85,.38)!important;

    border-radius:
        14px!important;

    background:
        linear-gradient(
            145deg,
            #092641,
            #06192f
        )!important;
}


body.eo32-app
.etx-stat-row b{

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        25px!important;
}


body.eo32-app
.etx-stat-row small{

    color:
        #a4b7cb!important;
}


/* etx cards */

body.eo32-app
.etx-card,
body.eo32-app
.etx-list-row{

    border:
        1px solid
        var(--eo32-line)!important;

    border-radius:
        14px!important;

    background:
        linear-gradient(
            145deg,
            #092541,
            #06192f
        )!important;

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.12)!important;
}


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

body.eo32-app .table,
.eo32-table-scroll{

    width:
        100%!important;

    overflow-x:
        auto!important;

    border:
        1px solid
        rgba(58,105,152,.48)!important;

    border-radius:
        12px!important;

    background:
        #071b33!important;
}


body.eo32-app table{

    width:
        100%!important;

    border-collapse:
        collapse!important;

    background:
        #071b33!important;
}


body.eo32-app th{

    padding:
        12px 13px!important;

    border-bottom:
        1px solid
        #345d87!important;

    background:
        #06182e!important;

    color:
        var(--eo-role,var(--eo32-gold))!important;

    font-size:
        10px!important;

    font-weight:
        900!important;

    letter-spacing:
        .06em!important;

    text-align:
        left!important;

    text-transform:
        uppercase!important;

    white-space:
        nowrap!important;
}


body.eo32-app td{

    padding:
        12px 13px!important;

    border-bottom:
        1px solid
        rgba(61,108,154,.25)!important;

    color:
        #d9e5f1!important;

    font-size:
        12px!important;
}


body.eo32-app tbody tr:hover td{

    background:
        rgba(41,103,166,.08)!important;
}


/* =======================================================
   STATUS
   ======================================================= */

.eo32-status{

    font-weight:
        800!important;
}


.eo32-status-ok{

    color:
        var(--eo32-good)!important;
}


.eo32-status-wait{

    color:
        var(--eo32-warn)!important;
}


.eo32-status-bad{

    color:
        var(--eo32-bad)!important;
}


/* =======================================================
   FORMS
   ======================================================= */

body.eo32-app
:where(
    input,
    select,
    textarea
){

    min-height:
        42px!important;

    border:
        1px solid
        #31577d!important;

    border-radius:
        9px!important;

    background:
        #061b33!important;

    color:
        #fff!important;

    outline:
        none!important;
}


body.eo32-app textarea{

    min-height:
        105px!important;
}


body.eo32-app
:where(
    input,
    select,
    textarea
):focus{

    border-color:
        var(--eo-role,var(--eo32-gold))!important;

    box-shadow:
        0 0 0 3px
        rgba(232,183,85,.08)!important;
}


body.eo32-app label{

    color:
        #bdcede!important;

    font-size:
        12px!important;

    font-weight:
        700!important;
}


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

body.eo32-app
:where(
    .btn,
    .button,
    button,
    input[type="submit"]
){

    border-radius:
        9px!important;

    font-weight:
        900!important;
}


body.eo32-app
:where(
    .btn,
    .button,
    button,
    input[type="submit"]
):not(.ghost):not(.secondary){

    border:
        1px solid
        var(--eo-role,var(--eo32-gold))!important;

    background:
        var(--eo-role,var(--eo32-gold))!important;

    color:
        #05172b!important;
}


/* =======================================================
   LOGIN / AUTH SCREENS
   ======================================================= */

body.eo32-app
:where(
    .auth,
    .guide-auth,
    .et-sofor-auth-form
){

    width:
        min(
            1120px,
            calc(100% - 28px)
        )!important;

    margin:
        45px auto!important;

    padding:
        28px!important;

    border:
        1px solid
        rgba(232,183,85,.43)!important;

    border-radius:
        18px!important;

    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(52,130,211,.16),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #092744,
            #06182e
        )!important;

    box-shadow:
        0 24px 60px
        rgba(0,0,0,.23)!important;
}


/* =======================================================
   EMPTY STATE
   ======================================================= */

.eo32-empty{

    margin:
        15px 0 0;

    padding:
        22px;

    border:
        1px dashed
        #365f89;

    border-radius:
        11px;

    color:
        #91a7be;

    background:
        rgba(5,21,40,.42);

    text-align:
        center;
}


/* =======================================================
   PORTAL CENTER
   ======================================================= */

.eo32-portal-hub{

    width:
        min(
            1500px,
            calc(100% - 36px)
        );

    margin:
        26px auto 50px;

    color:
        #f7f9fc;
}


.eo32-portal-hero{

    min-height:
        270px;

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        320px;

    align-items:center;

    gap:
        25px;

    padding:
        40px;

    border:
        1px solid
        rgba(232,183,85,.45);

    border-radius:
        21px;

    background:
        radial-gradient(
            circle at 83% 36%,
            rgba(47,125,207,.22),
            transparent 25%
        ),
        linear-gradient(
            125deg,
            #0a2b4d,
            #06182f
        );

    box-shadow:
        0 22px 60px
        rgba(0,0,0,.2);
}


.eo32-kicker{

    color:
        #e9b957;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .19em;
}


.eo32-portal-hero h1{

    margin:
        8px 0 11px;

    max-width:
        820px;

    color:
        #fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            40px,
            4.2vw,
            68px
        );

    line-height:
        .98;
}


.eo32-portal-hero p{

    max-width:
        780px;

    color:
        #b9cbdc;

    font-size:
        15px;

    line-height:
        1.65;
}


.eo32-hero-metrics{

    display:grid;

    gap:
        10px;
}


.eo32-hero-metrics div{

    padding:
        15px;

    border:
        1px solid
        rgba(70,124,179,.44);

    border-radius:
        12px;

    background:
        rgba(5,21,40,.5);
}


.eo32-hero-metrics strong{

    display:block;

    color:
        #f0c566;

    font-size:
        23px;
}


.eo32-hero-metrics span{

    color:
        #99aec5;

    font-size:
        11px;
}


.eo32-portal-heading{

    display:flex;

    justify-content:
        space-between;

    align-items:flex-end;

    gap:
        22px;

    padding:
        28px 4px 16px;
}


.eo32-portal-heading span{

    color:
        #e9b957;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .16em;
}


.eo32-portal-heading h2{

    margin:
        4px 0 0;

    color:
        #fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        32px;
}


.eo32-portal-heading p{

    max-width:
        600px;

    margin:
        0;

    color:
        #99aec5;

    font-size:
        12px;

    text-align:
        right;
}


.eo32-portal-grid{

    display:grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );

    gap:
        14px;
}


.eo32-portal-card{

    min-height:
        245px;

    display:flex;

    flex-direction:
        column;

    padding:
        22px;

    border:
        1px solid
        #315b87;

    border-radius:
        17px;

    background:
        radial-gradient(
            circle at 100% 0,
            rgba(232,183,85,.09),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #0a2948,
            #061a31
        );

    color:
        #fff;

    text-decoration:
        none;

    box-shadow:
        0 13px 32px
        rgba(0,0,0,.14);

    transition:
        .17s ease;
}


.eo32-portal-card:hover{

    transform:
        translateY(-4px);

    border-color:
        #e9b957;

    box-shadow:
        0 21px 42px
        rgba(0,0,0,.23);
}


.eo32-card-top{

    display:flex;

    justify-content:
        space-between;

    align-items:center;
}


.eo32-card-number{

    color:
        #e9b957;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .15em;
}


.eo32-card-icon{

    width:
        43px;

    height:
        43px;

    display:grid;

    place-items:center;

    border:
        1px solid
        rgba(232,183,85,.47);

    border-radius:
        50%;

    color:
        #e9b957;

    background:
        #06182e;

    font-size:
        19px;
}


.eo32-card-role{

    margin-top:
        19px;

    color:
        #748fa9;

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        .14em;
}


.eo32-portal-card h3{

    margin:
        6px 0 9px;

    color:
        #fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        25px;
}


.eo32-portal-card p{

    margin:0;

    color:
        #a8bbcf;

    font-size:
        12px;

    line-height:
        1.55;
}


.eo32-card-bottom{

    margin-top:auto;

    padding-top:
        20px;

    display:flex;

    justify-content:
        space-between;

    align-items:center;

    gap:
        12px;
}


.eo32-card-bottom span{

    color:
        #8099b3;

    font-size:
        10px;
}


.eo32-card-bottom b{

    min-height:
        36px;

    display:flex;

    align-items:center;

    padding:
        0 12px;

    border-radius:
        8px;

    background:
        #e9b957;

    color:
        #06182d;

    font-size:
        11px;
}


.eo32-security-row{

    display:grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:
        11px;

    margin-top:
        14px;
}


.eo32-security-row div{

    padding:
        15px;

    border:
        1px solid
        rgba(59,106,154,.43);

    border-radius:
        11px;

    background:
        #071a31;
}


.eo32-security-row strong{

    display:block;

    color:
        #fff;

    font-size:
        12px;
}


.eo32-security-row small{

    display:block;

    margin-top:
        4px;

    color:
        #91a7bd;

    line-height:
        1.45;
}


/* =======================================================
   MOBILE / TABLET
   ======================================================= */

@media(max-width:1050px){

    .eo32-portal-grid{

        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );

    }


    .eo32-portal-hero{

        grid-template-columns:
            1fr;

    }


    .eo32-hero-metrics{

        grid-template-columns:
            repeat(3,1fr);

    }

}


@media(max-width:820px){

    .eo32-app-header{

        grid-template-columns:
            145px minmax(0,1fr);

    }


    .eo32-app-actions{

        grid-column:
            1/-1;

        justify-content:
            flex-start;

    }

}


@media(max-width:650px){

    .eo32-app-header{

        width:
            calc(100% - 18px);

        grid-template-columns:
            1fr;

        padding:
            19px;

    }


    .eo32-app-logo img{

        width:
            145px;

    }


    body.eo32-app main > .section,
    body.eo32-app main > section.section,
    body.eo32-app .etx-portal-page{

        width:
            calc(100% - 18px)!important;

    }


    body.eo32-app main > .section,
    body.eo32-app main > section.section{

        padding:
            17px!important;

    }


    body.eo32-app main .grid,
    body.eo32-app .etx-stat-row,
    body.eo32-app .etx-quick-row{

        grid-template-columns:
            1fr!important;

    }


    .eo32-portal-hub{

        width:
            calc(100% - 18px);

        margin-top:
            12px;

    }


    .eo32-portal-hero{

        min-height:
            0;

        padding:
            23px 19px;

    }


    .eo32-portal-grid,
    .eo32-security-row,
    .eo32-hero-metrics{

        grid-template-columns:
            1fr;

    }


    .eo32-portal-heading{

        align-items:
            flex-start;

        flex-direction:
            column;

    }


    .eo32-portal-heading p{

        text-align:
            left;

    }

}


/* ELITA_V32_2_PANEL_CSS_END */



/* ELITA_V33_PANEL_INTEGRATION_CSS_START */


/* ======================================================
   CORE
====================================================== */

body.eo33-integrated-panel{

    --eo33-bg:#041326;
    --eo33-bg2:#061a32;
    --eo33-panel:#092541;
    --eo33-panel2:#071b34;
    --eo33-line:#315b87;
    --eo33-gold:#e9b957;
    --eo33-text:#f5f8fc;
    --eo33-muted:#9fb3c8;
    --eo33-role:#e9b957;

    min-height:
        100vh!important;

    background:
        radial-gradient(
            circle at 90% 0,
            rgba(40,112,190,.14),
            transparent 28%
        ),
        #041326!important;

    color:
        var(--eo33-text)!important;
}


/* ======================================================
   ROLE ACCENTS
====================================================== */

body.eo33-role-customer{
    --eo33-role:#e9b957;
}

body.eo33-role-agency{
    --eo33-role:#b993ff;
}

body.eo33-role-school{
    --eo33-role:#5edbd1;
}

body.eo33-role-parent{
    --eo33-role:#f0c46a;
}

body.eo33-role-driver{
    --eo33-role:#67b8ff;
}

body.eo33-role-guide{
    --eo33-role:#65dca6;
}

body.eo33-role-operations{
    --eo33-role:#ffbe56;
}

body.eo33-role-club{
    --eo33-role:#d59bff;
}

body.eo33-role-finance{
    --eo33-role:#55d69d;
}


/* ======================================================
   DESKTOP MAIN OFFSET
====================================================== */

@media(min-width:981px){

    body.eo33-integrated-panel
    > main{

        margin-left:
            270px!important;

        width:
            calc(100% - 270px)!important;

        max-width:
            none!important;

        box-sizing:
            border-box!important;
    }


    /*
     * ET-NEXT layout main farklı wrapper kullanıyorsa.
     */

    body.eo33-integrated-panel
    .etx-portal-page{

        max-width:
            1480px!important;
    }

}


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

.eo33-sidebar{

    position:
        fixed;

    z-index:
        9000;

    left:
        0;

    top:
        0;

    width:
        270px;

    height:
        100vh;

    display:
        flex;

    flex-direction:
        column;

    padding:
        20px 15px;

    overflow-y:
        auto;

    background:
        linear-gradient(
            180deg,
            #061a32,
            #041225
        );

    border-right:
        1px solid
        rgba(76,128,182,.33);

    box-shadow:
        16px 0 40px
        rgba(0,0,0,.20);

    box-sizing:
        border-box;
}


.eo33-brand{

    display:
        flex;

    align-items:
        center;

    min-height:
        66px;

    padding:
        0 8px 18px;

    border-bottom:
        1px solid
        rgba(233,185,87,.20);
}


.eo33-brand img{

    display:
        block;

    width:
        185px;

    max-width:
        100%;

    height:
        auto;
}


.eo33-sidebar-role{

    padding:
        18px 10px 13px;
}


.eo33-sidebar-role span{

    display:
        block;

    color:
        var(--eo33-role);

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        .17em;
}


.eo33-sidebar-role strong{

    display:
        block;

    margin-top:
        6px;

    color:
        #fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        20px;

    font-weight:
        400;
}


/* ======================================================
   NAV
====================================================== */

.eo33-nav{

    display:
        grid;

    gap:
        6px;
}


.eo33-nav a{

    min-height:
        44px;

    display:
        grid;

    grid-template-columns:
        31px minmax(0,1fr);

    align-items:
        center;

    gap:
        5px;

    padding:
        0 11px;

    border:
        1px solid transparent;

    border-radius:
        10px;

    color:
        #dce7f2;

    text-decoration:
        none;

    font-size:
        12px;

    font-weight:
        700;

    transition:
        .16s ease;
}


.eo33-nav a:hover,
.eo33-nav a.active{

    border-color:
        color-mix(
            in srgb,
            var(--eo33-role) 48%,
            transparent
        );

    background:
        linear-gradient(
            90deg,
            color-mix(
                in srgb,
                var(--eo33-role) 14%,
                transparent
            ),
            rgba(8,31,58,.4)
        );

    color:
        #fff;

    box-shadow:
        inset 3px 0 0
        var(--eo33-role);
}


.eo33-nav-icon{

    display:
        grid;

    place-items:
        center;

    color:
        var(--eo33-role);

    font-size:
        16px;
}


.eo33-sidebar-bottom{

    margin-top:
        auto;

    padding:
        16px 11px;

    border:
        1px solid
        rgba(233,185,87,.25);

    border-radius:
        12px;

    background:
        rgba(233,185,87,.04);
}


.eo33-sidebar-bottom strong{

    display:
        block;

    color:
        var(--eo33-role);

    font-size:
        12px;
}


.eo33-sidebar-bottom small{

    display:
        block;

    margin-top:
        4px;

    color:
        #849bb3;

    font-size:
        10px;
}


/* ======================================================
   APP BAR
====================================================== */

.eo33-appbar{

    position:
        relative;

    overflow:
        hidden;

    width:
        min(
            1480px,
            calc(100% - 34px)
        );

    min-height:
        145px;

    margin:
        20px auto 16px;

    padding:
        27px 30px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        25px;

    border:
        1px solid
        color-mix(
            in srgb,
            var(--eo33-role) 58%,
            #315b87
        );

    border-radius:
        18px;

    background:
        radial-gradient(
            circle at 85% 43%,
            color-mix(
                in srgb,
                var(--eo33-role) 16%,
                transparent
            ),
            transparent 24%
        ),
        linear-gradient(
            120deg,
            #0a2a4b,
            #06192f
        );

    box-shadow:
        0 20px 50px
        rgba(0,0,0,.19);

    box-sizing:
        border-box;
}


.eo33-appbar::after{

    content:"";

    position:
        absolute;

    width:
        280px;

    height:
        280px;

    right:
        70px;

    top:
        -110px;

    border:
        1px solid
        color-mix(
            in srgb,
            var(--eo33-role) 22%,
            transparent
        );

    border-radius:
        50%;

    pointer-events:
        none;
}


.eo33-appbar-copy{

    position:
        relative;

    z-index:
        2;

    min-width:
        0;
}


.eo33-appbar-copy > span{

    color:
        var(--eo33-role);

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        .18em;
}


.eo33-appbar-copy h1{

    margin:
        7px 0 7px!important;

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        clamp(
            31px,
            3vw,
            47px
        )!important;

    line-height:
        1!important;

    font-weight:
        400!important;
}


.eo33-appbar-copy p{

    max-width:
        740px;

    margin:
        0!important;

    color:
        #adc0d2!important;

    font-size:
        13px!important;

    line-height:
        1.55!important;
}


.eo33-appbar-tools{

    position:
        relative;

    z-index:
        2;

    display:
        flex;

    flex-wrap:
        wrap;

    justify-content:
        flex-end;

    gap:
        8px;

    flex:
        0 0 auto;
}


.eo33-appbar-tools a{

    min-height:
        39px;

    display:
        inline-flex;

    align-items:
        center;

    padding:
        0 13px;

    border:
        1px solid
        var(--eo33-role);

    border-radius:
        8px;

    background:
        rgba(4,18,37,.38);

    color:
        var(--eo33-role);

    text-decoration:
        none;

    font-size:
        10px;

    font-weight:
        900;
}


/* ======================================================
   EXISTING PANEL CONTENT
====================================================== */

body.eo33-integrated-panel
main
:where(
    .section,
    .dashboard,
    .dashboard-section,
    .etx-card,
    .dashboard-card,
    .panel,
    .guide-panel,
    .driver-panel
){

    border-color:
        var(--eo33-line)!important;
}


.eo33-existing-card{

    border:
        1px solid
        var(--eo33-line)!important;

    border-radius:
        14px!important;

    background:
        radial-gradient(
            circle at 100% 0,
            color-mix(
                in srgb,
                var(--eo33-role) 7%,
                transparent
            ),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #092541,
            #06192f
        )!important;

    color:
        #eef5fc!important;

    box-shadow:
        0 11px 28px
        rgba(0,0,0,.12)!important;
}


/* ======================================================
   KPI / STATS
====================================================== */

body.eo33-integrated-panel
:where(
    .etx-stat-row,
    .stats,
    .dashboard-stats,
    .kpis
){

    gap:
        12px!important;
}


body.eo33-integrated-panel
:where(
    .stat,
    .etx-stat,
    .kpi,
    .dashboard-stat
){

    border:
        1px solid
        color-mix(
            in srgb,
            var(--eo33-role) 44%,
            #315b87
        )!important;

    border-radius:
        14px!important;

    background:
        linear-gradient(
            145deg,
            #092541,
            #06192f
        )!important;

    color:
        #fff!important;
}


/* ======================================================
   TABLE
====================================================== */

.eo33-table-scroll{

    position:
        relative;

    width:
        100%;

    overflow-x:
        auto;

    border:
        1px solid
        rgba(56,103,151,.44);

    border-radius:
        12px;

    background:
        #071b33;
}


body.eo33-integrated-panel table{

    width:
        100%!important;

    border-collapse:
        collapse!important;

    background:
        #071b33!important;
}


body.eo33-integrated-panel th{

    padding:
        12px 13px!important;

    border-bottom:
        1px solid
        #345d87!important;

    background:
        #06182e!important;

    color:
        var(--eo33-role)!important;

    font-size:
        10px!important;

    font-weight:
        900!important;

    letter-spacing:
        .06em!important;

    text-align:
        left!important;

    text-transform:
        uppercase!important;

    white-space:
        nowrap!important;
}


body.eo33-integrated-panel td{

    padding:
        12px 13px!important;

    border-bottom:
        1px solid
        rgba(61,108,154,.24)!important;

    color:
        #d9e5f1!important;

    font-size:
        12px!important;
}


body.eo33-integrated-panel
tbody tr:hover td{

    background:
        color-mix(
            in srgb,
            var(--eo33-role) 5%,
            transparent
        )!important;
}


/* ======================================================
   FORMS
====================================================== */

body.eo33-integrated-panel
main
:where(
    input,
    select,
    textarea
){

    border:
        1px solid
        #31577d!important;

    border-radius:
        8px!important;

    background:
        #061b33!important;

    color:
        #fff!important;

    outline:
        0!important;
}


body.eo33-integrated-panel
main
:where(
    input,
    select
){

    min-height:
        41px!important;
}


body.eo33-integrated-panel
main
:where(
    input,
    select,
    textarea
):focus{

    border-color:
        var(--eo33-role)!important;

    box-shadow:
        0 0 0 3px
        color-mix(
            in srgb,
            var(--eo33-role) 9%,
            transparent
        )!important;
}


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

body.eo33-integrated-panel
main
:where(
    .btn,
    .button,
    button[type="submit"],
    input[type="submit"]
){

    border-radius:
        8px!important;

    font-weight:
        900!important;
}


body.eo33-integrated-panel
main
:where(
    .btn,
    .button,
    button[type="submit"],
    input[type="submit"]
):not(.secondary):not(.ghost){

    border:
        1px solid
        var(--eo33-role)!important;

    background:
        var(--eo33-role)!important;

    color:
        #06172b!important;
}


/* ======================================================
   EMPTY STATE
====================================================== */

.eo33-empty{

    padding:
        20px;

    color:
        #8fa5bc;

    background:
        #071b33;

    text-align:
        center;

    font-size:
        12px;
}


/* ======================================================
   PORTAL CENTER POLISH
====================================================== */

.eo32-portal-hub,
.eo-portals-v32{

    --eo33-role:
        #e9b957;
}


.eo32-portal-card,
.portal-card{

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease!important;
}


.eo32-portal-card:hover,
.portal-card:hover{

    transform:
        translateY(-5px)!important;

    border-color:
        #e9b957!important;

    box-shadow:
        0 24px 50px
        rgba(0,0,0,.25)!important;
}


/* ======================================================
   MOBILE MENU BUTTON
====================================================== */

.eo33-mobile-toggle{

    display:
        none;

    position:
        fixed;

    z-index:
        9100;

    left:
        12px;

    top:
        12px;

    width:
        43px;

    height:
        43px;

    border:
        1px solid
        var(--eo33-role);

    border-radius:
        10px;

    background:
        #071d37;

    color:
        var(--eo33-role);

    font-size:
        19px;

    box-shadow:
        0 10px 25px
        rgba(0,0,0,.22);
}


/* ======================================================
   TABLET / MOBILE
====================================================== */

@media(max-width:980px){

    body.eo33-integrated-panel
    > main{

        margin-left:
            0!important;

        width:
            100%!important;
    }


    .eo33-sidebar{

        width:
            min(300px,88vw);

        transform:
            translateX(-105%);

        transition:
            transform .2s ease;
    }


    body.eo33-menu-open
    .eo33-sidebar{

        transform:
            translateX(0);
    }


    .eo33-mobile-toggle{

        display:
            block;
    }


    .eo33-appbar{

        width:
            calc(100% - 20px);

        margin-top:
            66px;

        padding:
            23px;

        align-items:
            flex-start;

        flex-direction:
            column;
    }


    .eo33-appbar-tools{

        justify-content:
            flex-start;
    }

}


@media(max-width:640px){

    .eo33-appbar{

        min-height:
            0;

        padding:
            20px 18px;
    }


    .eo33-appbar-copy h1{

        font-size:
            32px!important;
    }


    .eo33-appbar-tools{

        width:
            100%;
    }


    .eo33-appbar-tools a{

        flex:
            1 1 auto;

        justify-content:
            center;
    }


    body.eo33-integrated-panel
    :where(
        .etx-stat-row,
        .stats,
        .dashboard-stats,
        .kpis
    ){

        grid-template-columns:
            1fr!important;
    }

}


/* ELITA_V33_PANEL_INTEGRATION_CSS_END */



/* ELITA_V34_CUSTOMER_APP_CSS_START */


/* ==================================================
   CUSTOMER APP ROOT
================================================== */

body.eo34-customer-app{

    --eo34-bg:#031326;
    --eo34-panel:#082541;
    --eo34-panel2:#061b34;
    --eo34-border:#315e8c;
    --eo34-gold:#efbd58;
    --eo34-blue:#4d9cff;
    --eo34-text:#f6f9fd;
    --eo34-muted:#9fb4ca;

    background:
        radial-gradient(
            circle at 88% 5%,
            rgba(31,110,201,.14),
            transparent 25%
        ),
        #031326!important;

    color:
        var(--eo34-text)!important;
}


/*
 * Müşteri panelinde public website header/footer yerine
 * uygulama arayüzü.
 */

body.eo34-customer-app
.etx-utility,

body.eo34-customer-app
.etx-header,

body.eo34-customer-app
.etx-footer{

    display:none!important;
}


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

body.eo34-customer-app
.eo33-sidebar.eo34-customer-sidebar{

    width:
        255px!important;

    padding:
        17px 13px!important;

    background:
        linear-gradient(
            180deg,
            #061d39,
            #031326
        )!important;

    border-right:
        1px solid
        #244b72!important;

    box-shadow:
        15px 0 40px
        rgba(0,0,0,.24)!important;
}


.eo34-brand{

    display:flex;

    min-height:
        70px;

    align-items:center;

    padding:
        0 7px 16px;

    border-bottom:
        1px solid
        rgba(239,189,88,.20);
}


.eo34-brand img{

    width:
        180px;

    height:auto;
}


.eo34-side-title{

    padding:
        16px 10px 13px;
}


.eo34-side-title span{

    display:block;

    color:
        var(--eo34-gold);

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        .18em;
}


.eo34-side-title strong{

    display:block;

    margin-top:
        5px;

    color:
        #fff;

    font-size:
        15px;
}


.eo34-customer-nav{

    display:grid;

    gap:
        5px;
}


.eo34-customer-nav a{

    min-height:
        43px;

    display:grid;

    grid-template-columns:
        31px minmax(0,1fr);

    align-items:center;

    padding:
        0 10px;

    border:
        1px solid transparent;

    border-radius:
        9px;

    color:
        #d9e5f1;

    text-decoration:
        none;

    font-size:
        12px;

    font-weight:
        700;

    transition:
        .15s ease;
}


.eo34-customer-nav a i{

    color:
        #75b7ff;

    font-style:
        normal;

    font-size:
        16px;
}


.eo34-customer-nav a:hover,
.eo34-customer-nav a.active{

    border-color:
        rgba(239,189,88,.60);

    background:
        linear-gradient(
            90deg,
            rgba(239,189,88,.14),
            rgba(12,48,87,.36)
        );

    box-shadow:
        inset 3px 0 0
        var(--eo34-gold);

    color:
        #fff;
}


.eo34-portal-link{

    min-height:
        42px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-top:auto;

    border:
        1px solid
        var(--eo34-gold);

    border-radius:
        9px;

    color:
        var(--eo34-gold);

    background:
        rgba(239,189,88,.05);

    text-decoration:
        none;

    font-size:
        11px;

    font-weight:
        900;
}


/* ==================================================
   MAIN
================================================== */

@media(min-width:981px){

    body.eo34-customer-app
    > main{

        margin-left:
            255px!important;

        width:
            calc(100% - 255px)!important;

        min-height:
            100vh!important;

        max-width:
            none!important;
    }

}


/* ==================================================
   TOPBAR
================================================== */

.eo34-customer-topbar{

    position:
        sticky;

    z-index:
        500;

    top:
        0;

    min-height:
        68px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:
        20px;

    padding:
        11px 24px;

    border-bottom:
        1px solid
        #244c75;

    background:
        rgba(3,18,35,.95);

    backdrop-filter:
        blur(15px);

    box-shadow:
        0 9px 30px
        rgba(0,0,0,.16);
}


.eo34-search{

    width:
        min(520px,55%);

    height:
        42px;

    display:grid;

    grid-template-columns:
        36px minmax(0,1fr);

    align-items:center;

    border:
        1px solid
        #315d89;

    border-radius:
        9px;

    background:
        #071d37;
}


.eo34-search span{

    display:grid;

    place-items:center;

    color:
        #8cbcf2;

    font-size:
        18px;
}


.eo34-search input{

    width:
        100%!important;

    height:
        40px!important;

    min-height:
        40px!important;

    padding:
        0 10px 0 0!important;

    border:
        0!important;

    background:
        transparent!important;

    color:
        #fff!important;

    box-shadow:
        none!important;
}


.eo34-top-actions{

    display:flex;

    align-items:center;

    gap:
        10px;
}


.eo34-notification{

    position:relative;

    width:
        40px;

    height:
        40px;

    display:grid;

    place-items:center;

    border:
        1px solid
        #315d89;

    border-radius:
        9px;

    color:
        #dce9f6;

    text-decoration:
        none;

    background:
        #071d37;
}


.eo34-notification b{

    position:absolute;

    right:
        -5px;

    top:
        -5px;

    min-width:
        18px;

    height:
        18px;

    display:grid;

    place-items:center;

    padding:
        0 4px;

    border-radius:
        999px;

    background:
        #ef4851;

    color:
        #fff;

    font-size:
        9px;
}


.eo34-user{

    display:grid;

    grid-template-columns:
        38px minmax(0,1fr) 18px;

    align-items:center;

    gap:
        8px;

    min-width:
        205px;

    padding:
        4px 9px;

    border:
        1px solid transparent;

    border-radius:
        10px;

    color:
        #fff;

    text-decoration:
        none;
}


.eo34-user:hover{

    border-color:
        #315d89;

    background:
        #071d37;
}


.eo34-avatar{

    width:
        36px;

    height:
        36px;

    display:grid;

    place-items:center;

    border:
        1px solid
        var(--eo34-gold);

    border-radius:
        50%;

    background:
        linear-gradient(
            145deg,
            #153a64,
            #081d37
        );

    color:
        #fff;

    font-size:
        11px;

    font-weight:
        900;
}


.eo34-user strong,
.eo34-user small{

    display:block;
}


.eo34-user strong{

    color:
        #fff;

    font-size:
        11px;

    text-transform:
        uppercase;
}


.eo34-user small{

    margin-top:
        2px;

    color:
        #8fa6bd;

    font-size:
        9px;
}


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

body.eo34-customer-app
.etx-customer{

    width:
        min(
            1450px,
            calc(100% - 36px)
        )!important;

    max-width:
        1450px!important;

    margin:
        0 auto!important;

    padding:
        20px 0 45px!important;
}


/* ==================================================
   HERO
================================================== */

body.eo34-customer-app
.etx-customer
.eo34-customer-hero{

    position:
        relative;

    overflow:
        hidden;

    min-height:
        190px!important;

    padding:
        31px 32px!important;

    display:grid!important;

    grid-template-columns:
        minmax(0,1fr) 270px!important;

    align-items:center!important;

    gap:
        25px!important;

    border:
        1px solid
        #315f8d!important;

    border-radius:
        16px!important;

    background:
        radial-gradient(
            circle at 88% 45%,
            rgba(239,189,88,.18),
            transparent 13%
        ),
        radial-gradient(
            circle at 82% 45%,
            rgba(39,124,220,.26),
            transparent 32%
        ),
        linear-gradient(
            118deg,
            #0a3157,
            #071e3b 63%,
            #06172d
        )!important;

    box-shadow:
        0 19px 48px
        rgba(0,0,0,.18)!important;
}


body.eo34-customer-app
.etx-customer
.eo34-customer-hero::after{

    content:"";

    position:absolute;

    width:
        380px;

    height:
        380px;

    right:
        -75px;

    top:
        -165px;

    border:
        1px solid
        rgba(103,179,255,.19);

    border-radius:
        50%;
}


body.eo34-customer-app
.etx-customer
.eo34-customer-hero
> *{

    position:relative;

    z-index:
        2;
}


body.eo34-customer-app
.etx-customer
.eo34-customer-hero
.eyebrow{

    color:
        var(--eo34-gold)!important;

    font-size:
        9px!important;

    letter-spacing:
        .18em!important;
}


body.eo34-customer-app
.etx-customer
.eo34-customer-hero h1{

    margin:
        7px 0 8px!important;

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        clamp(
            35px,
            3.8vw,
            54px
        )!important;

    line-height:
        1!important;

    font-weight:
        400!important;
}


body.eo34-customer-app
.etx-customer
.eo34-customer-hero p{

    max-width:
        760px!important;

    color:
        #aec2d5!important;

    font-size:
        13px!important;

    line-height:
        1.6!important;
}


body.eo34-customer-app
.etx-welcome-badge{

    min-height:
        105px;

    display:flex!important;

    flex-direction:
        column;

    justify-content:
        center;

    padding:
        18px 20px!important;

    border:
        1px solid
        #3a6796!important;

    border-radius:
        13px!important;

    background:
        rgba(4,19,38,.54)!important;
}


body.eo34-customer-app
.etx-welcome-badge b{

    color:
        #f1c265!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        25px!important;
}


/* ==================================================
   KPI ROW
================================================== */

.eo34-kpi-row{

    display:grid;

    grid-template-columns:
        repeat(6,minmax(0,1fr));

    gap:
        10px;

    margin:
        13px 0;
}


.eo34-kpi{

    min-height:
        105px;

    display:grid;

    grid-template-columns:
        43px minmax(0,1fr);

    align-items:center;

    gap:
        11px;

    padding:
        15px;

    border:
        1px solid
        #315d89;

    border-radius:
        13px;

    background:
        radial-gradient(
            circle at 0 50%,
            rgba(65,151,255,.10),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            #092844,
            #071b33
        );

    text-decoration:
        none;

    box-shadow:
        0 10px 26px
        rgba(0,0,0,.11);

    transition:
        .15s ease;
}


.eo34-kpi:hover{

    transform:
        translateY(-2px);

    border-color:
        var(--eo34-gold);
}


.eo34-kpi i{

    width:
        41px;

    height:
        41px;

    display:grid;

    place-items:center;

    border:
        1px solid
        rgba(86,166,255,.38);

    border-radius:
        10px;

    color:
        #7ab9ff;

    background:
        rgba(25,97,177,.15);

    font-style:
        normal;

    font-size:
        17px;
}


.eo34-kpi strong,
.eo34-kpi b,
.eo34-kpi small{

    display:block;
}


.eo34-kpi strong{

    color:
        #fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        20px;
}


.eo34-kpi b{

    margin-top:
        3px;

    color:
        #f0f5fa;

    font-size:
        10px;
}


.eo34-kpi small{

    margin-top:
        3px;

    color:
        #8199b1;

    font-size:
        9px;
}


/* ==================================================
   QUICK PANEL
================================================== */

.eo34-quick-panel{

    margin:
        14px 0;

    padding:
        17px;

    border:
        1px solid
        #315d89;

    border-radius:
        14px;

    background:
        linear-gradient(
            145deg,
            #08243f,
            #06192f
        );
}


.eo34-quick-panel header{

    margin-bottom:
        12px;
}


.eo34-quick-panel header span{

    color:
        var(--eo34-gold);

    font-size:
        8px;

    font-weight:
        900;

    letter-spacing:
        .17em;
}


.eo34-quick-panel header h2{

    margin:
        4px 0 0!important;

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        22px!important;
}


body.eo34-customer-app
.eo34-quick-actions{

    margin:
        0!important;

    display:grid!important;

    grid-template-columns:
        repeat(5,minmax(0,1fr))!important;

    gap:
        9px!important;
}


body.eo34-customer-app
.eo34-quick-actions a{

    min-height:
        67px!important;

    padding:
        11px 13px!important;

    border:
        1px solid
        #315d89!important;

    border-radius:
        10px!important;

    background:
        #071d37!important;
}


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

body.eo34-customer-app
.eo34-dashboard-grid{

    display:grid!important;

    grid-template-columns:
        repeat(12,minmax(0,1fr))!important;

    gap:
        12px!important;
}


body.eo34-customer-app
.eo34-dashboard-card{

    grid-column:
        span 4;

    min-width:
        0;

    padding:
        19px!important;

    border:
        1px solid
        #315d89!important;

    border-radius:
        14px!important;

    background:
        linear-gradient(
            145deg,
            #08243f,
            #06192f
        )!important;

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.11)!important;
}


body.eo34-customer-app
.eo34-dashboard-grid
.etx-span-2{

    grid-column:
        span 8!important;
}


body.eo34-customer-app
.eo34-dashboard-grid
.etx-points-card{

    grid-column:
        span 4!important;

    border-color:
        rgba(239,189,88,.56)!important;

    background:
        radial-gradient(
            circle at 100% 0,
            rgba(239,189,88,.12),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #092641,
            #06192f
        )!important;
}


body.eo34-customer-app
.etx-card-head h2{

    color:
        #fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        20px!important;
}


body.eo34-customer-app
.etx-card-head > span{

    color:
        #84a0ba!important;

    font-size:
        10px!important;
}


/* ==================================================
   TABLE
================================================== */

body.eo34-customer-app
.etx-customer table{

    width:
        100%!important;

    border-collapse:
        collapse!important;
}


body.eo34-customer-app
.etx-customer th{

    padding:
        10px 10px!important;

    color:
        #8fadd0!important;

    background:
        transparent!important;

    border-bottom:
        1px solid
        #31577f!important;

    font-size:
        9px!important;

    text-transform:
        uppercase!important;
}


body.eo34-customer-app
.etx-customer td{

    padding:
        12px 10px!important;

    color:
        #dce7f2!important;

    border-bottom:
        1px solid
        rgba(55,99,145,.28)!important;

    font-size:
        11px!important;
}


body.eo34-customer-app
.etx-mini-btn{

    min-height:
        32px!important;

    display:inline-flex!important;

    align-items:center!important;

    padding:
        0 11px!important;

    border:
        1px solid
        #5f9ee1!important;

    border-radius:
        7px!important;

    color:
        #eaf4ff!important;

    text-decoration:
        none!important;

    font-size:
        10px!important;
}


/* ==================================================
   LIST ROWS
================================================== */

body.eo34-customer-app
.etx-list-row{

    min-height:
        54px!important;

    padding:
        10px 0!important;

    border-bottom:
        1px solid
        rgba(55,100,147,.28)!important;
}


/* ==================================================
   ACCOUNT CENTER
================================================== */

.eo34-account-center{

    margin:
        15px 0;

    padding:
        20px;

    border:
        1px solid
        #315d89;

    border-radius:
        14px;

    background:
        linear-gradient(
            145deg,
            #08243f,
            #06192f
        );
}


.eo34-account-center header span{

    color:
        var(--eo34-gold);

    font-size:
        8px;

    font-weight:
        900;

    letter-spacing:
        .17em;
}


.eo34-account-center header h2{

    margin:
        5px 0 14px;

    color:
        #fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        23px;
}


.eo34-account-grid{

    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:
        10px;
}


.eo34-account-grid a{

    min-height:
        90px;

    display:grid;

    grid-template-columns:
        40px minmax(0,1fr) auto;

    align-items:center;

    gap:
        10px;

    padding:
        14px;

    border:
        1px solid
        #315d89;

    border-radius:
        11px;

    background:
        #071d37;

    color:
        #fff;

    text-decoration:
        none;
}


.eo34-account-grid a:hover{

    border-color:
        var(--eo34-gold);
}


.eo34-account-grid i{

    width:
        38px;

    height:
        38px;

    display:grid;

    place-items:center;

    border-radius:
        10px;

    background:
        rgba(71,150,240,.12);

    color:
        #79b9ff;

    font-style:
        normal;
}


.eo34-account-grid b,
.eo34-account-grid small{

    display:block;
}


.eo34-account-grid b{

    font-size:
        12px;
}


.eo34-account-grid small{

    margin-top:
        4px;

    color:
        #8da4ba;

    font-size:
        9px;
}


.eo34-account-grid em{

    color:
        var(--eo34-gold);

    font-style:
        normal;

    font-size:
        10px;

    font-weight:
        800;
}


/* ==================================================
   SUGGESTIONS
================================================== */

body.eo34-customer-app
.eo34-suggestions{

    margin-top:
        17px!important;

    padding:
        0!important;
}


body.eo34-customer-app
.etx-suggestion-grid{

    display:grid!important;

    grid-template-columns:
        repeat(4,minmax(0,1fr))!important;

    gap:
        12px!important;
}


body.eo34-customer-app
.etx-suggest{

    overflow:
        hidden!important;

    border:
        1px solid
        #315d89!important;

    border-radius:
        12px!important;

    background:
        #071d37!important;
}


body.eo34-customer-app
.etx-suggest-img{

    height:
        145px!important;
}


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

@media(max-width:1200px){

    .eo34-kpi-row{

        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }


    body.eo34-customer-app
    .eo34-quick-actions{

        grid-template-columns:
            repeat(3,minmax(0,1fr))!important;
    }

}


@media(max-width:980px){

    body.eo34-customer-app
    > main{

        margin-left:
            0!important;

        width:
            100%!important;
    }


    body.eo34-customer-app
    .etx-customer{

        width:
            calc(100% - 20px)!important;

        padding-top:
            74px!important;
    }


    .eo34-customer-topbar{

        margin-left:
            0;

        padding-left:
            66px;
    }


    body.eo34-customer-app
    .eo34-dashboard-grid{

        grid-template-columns:
            repeat(2,minmax(0,1fr))!important;
    }


    body.eo34-customer-app
    .eo34-dashboard-card,

    body.eo34-customer-app
    .eo34-dashboard-grid
    .etx-span-2,

    body.eo34-customer-app
    .eo34-dashboard-grid
    .etx-points-card{

        grid-column:
            auto!important;
    }


    .eo34-account-grid{

        grid-template-columns:
            1fr;
    }


    body.eo34-customer-app
    .etx-suggestion-grid{

        grid-template-columns:
            repeat(2,minmax(0,1fr))!important;
    }

}


@media(max-width:650px){

    .eo34-customer-topbar{

        min-height:
            auto;

        align-items:
            stretch;

        flex-direction:
            column;

        padding:
            12px 12px 12px 65px;
    }


    .eo34-search{

        width:
            100%;
    }


    .eo34-top-actions{

        justify-content:
            space-between;
    }


    .eo34-user{

        min-width:
            0;

        flex:
            1;
    }


    body.eo34-customer-app
    .etx-customer
    .eo34-customer-hero{

        min-height:
            0!important;

        grid-template-columns:
            1fr!important;

        padding:
            23px 20px!important;
    }


    .eo34-kpi-row{

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    body.eo34-customer-app
    .eo34-quick-actions{

        grid-template-columns:
            1fr!important;
    }


    body.eo34-customer-app
    .eo34-dashboard-grid{

        grid-template-columns:
            1fr!important;
    }


    body.eo34-customer-app
    .etx-suggestion-grid{

        grid-template-columns:
            1fr!important;
    }

}


/* ELITA_V34_CUSTOMER_APP_CSS_END */



/* ELITA_V34_2_CUSTOMER_REAL_CSS_START */


/* =====================================================
   CUSTOMER APPLICATION ROOT
===================================================== */

body:has(.eo342-customer-marker){

    --eo342-bg:#031225;
    --eo342-panel:#082541;
    --eo342-panel2:#061b34;
    --eo342-border:#315d89;
    --eo342-border2:#244b73;
    --eo342-gold:#efbd58;
    --eo342-blue:#62adff;
    --eo342-text:#f5f9fd;
    --eo342-muted:#94abc2;

    background:
        radial-gradient(
            circle at 87% 4%,
            rgba(46,126,216,.13),
            transparent 26%
        ),
        #031225!important;

    color:
        var(--eo342-text)!important;
}


/* =====================================================
   ESKI SITE HEADER / FOOTER MUSTERI APP'TE YOK
===================================================== */

body:has(.eo342-customer-marker)
.etx-utility,

body:has(.eo342-customer-marker)
.etx-header,

body:has(.eo342-customer-marker)
.etx-footer{

    display:none!important;
}


/* V33/V34 sonradan başka sidebar oluşturursa gizle */

body:has(.eo342-customer-marker)
.eo33-sidebar:not(.eo342-customer-sidebar){

    display:none!important;
}


body:has(.eo342-customer-marker)
.eo33-appbar{

    display:none!important;
}


/* =====================================================
   MAIN APP
===================================================== */

@media(min-width:981px){

    body:has(.eo342-customer-marker)
    main{

        width:
            calc(100% - 260px)!important;

        max-width:
            none!important;

        min-height:
            100vh!important;

        margin:
            0 0 0 260px!important;

        padding:
            0!important;
    }

}


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

.eo342-customer-sidebar{

    position:fixed;

    z-index:9500;

    left:0;
    top:0;

    width:260px;
    height:100vh;

    display:flex;
    flex-direction:column;

    padding:18px 14px;

    overflow-y:auto;

    background:
        linear-gradient(
            180deg,
            #071e3a 0%,
            #04162b 60%,
            #031225 100%
        );

    border-right:
        1px solid
        var(--eo342-border2);

    box-shadow:
        17px 0 42px
        rgba(0,0,0,.23);

    box-sizing:border-box;
}


.eo342-brand{

    padding:
        5px 8px 18px;

    border-bottom:
        1px solid
        rgba(239,189,88,.20);
}


.eo342-brand img{

    display:block;

    width:185px;
    max-width:100%;

    height:auto;
}


.eo342-brand > span{

    display:block;

    margin-top:15px;

    color:
        var(--eo342-gold);

    font-size:9px;

    font-weight:900;

    letter-spacing:.18em;
}


.eo342-brand > strong{

    display:block;

    margin-top:5px;

    color:#fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:21px;

    font-weight:400;
}


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

.eo342-nav{

    display:grid;

    gap:5px;

    padding:
        15px 0;
}


.eo342-nav a{

    min-height:43px;

    display:grid;

    grid-template-columns:
        32px minmax(0,1fr);

    align-items:center;

    gap:3px;

    padding:
        0 10px;

    border:
        1px solid transparent;

    border-radius:
        9px;

    color:
        #d8e5f2;

    text-decoration:none;

    font-size:12px;

    font-weight:700;

    transition:.15s ease;
}


.eo342-nav i{

    display:grid;

    place-items:center;

    color:
        #72b4ff;

    font-style:normal;

    font-size:16px;
}


.eo342-nav a:hover,
.eo342-nav a.active{

    border-color:
        rgba(239,189,88,.55);

    background:
        linear-gradient(
            90deg,
            rgba(239,189,88,.14),
            rgba(7,34,65,.20)
        );

    color:#fff;

    box-shadow:
        inset 3px 0 0
        var(--eo342-gold);
}


.eo342-side-bottom{

    display:grid;

    gap:6px;

    margin-top:auto;

    padding-top:14px;

    border-top:
        1px solid
        rgba(68,112,157,.28);
}


.eo342-side-bottom a{

    min-height:39px;

    display:flex;

    align-items:center;

    padding:
        0 11px;

    border:
        1px solid
        #2b527c;

    border-radius:
        8px;

    color:
        #a9c0d7;

    background:
        rgba(7,30,58,.52);

    text-decoration:none;

    font-size:10px;

    font-weight:800;
}


/* =====================================================
   TOP BAR
===================================================== */

.eo342-topbar{

    position:sticky;

    z-index:8000;

    top:0;

    min-height:70px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

    padding:
        12px 25px;

    border-bottom:
        1px solid
        #244d77;

    background:
        rgba(3,18,37,.96);

    backdrop-filter:
        blur(16px);

    box-shadow:
        0 10px 28px
        rgba(0,0,0,.13);

    box-sizing:border-box;
}


.eo342-search{

    width:
        min(550px,56%);

    min-height:42px;

    display:grid;

    grid-template-columns:
        40px minmax(0,1fr);

    align-items:center;

    border:
        1px solid
        #315d89;

    border-radius:
        9px;

    background:
        #071d37;
}


.eo342-search > span{

    display:grid;

    place-items:center;

    color:#78b7ff;

    font-size:18px;
}


.eo342-search input{

    width:100%!important;

    min-height:40px!important;

    padding:
        0 12px 0 0!important;

    border:0!important;

    background:
        transparent!important;

    color:#fff!important;

    outline:0!important;

    box-shadow:none!important;
}


.eo342-top-actions{

    display:flex;

    align-items:center;

    gap:9px;
}


.eo342-icon-button{

    position:relative;

    width:42px;
    height:42px;

    display:grid;

    place-items:center;

    border:
        1px solid
        #315d89;

    border-radius:
        9px;

    background:#071d37;

    color:#fff;

    text-decoration:none;
}


.eo342-icon-button b{

    position:absolute;

    right:-5px;
    top:-5px;

    min-width:18px;
    height:18px;

    display:grid;

    place-items:center;

    border-radius:999px;

    background:#eb4854;

    color:#fff;

    font-size:9px;
}


.eo342-profile-button{

    min-width:215px;

    display:grid;

    grid-template-columns:
        39px minmax(0,1fr) 18px;

    align-items:center;

    gap:8px;

    padding:
        4px 9px;

    border:
        1px solid
        #315d89;

    border-radius:
        10px;

    background:
        #071d37;

    color:#fff;

    text-decoration:none;
}


.eo342-avatar{

    width:36px;
    height:36px;

    display:grid;

    place-items:center;

    border:
        1px solid
        var(--eo342-gold);

    border-radius:50%;

    background:
        #0d3157;
}


.eo342-profile-button strong,
.eo342-profile-button small{

    display:block;
}


.eo342-profile-button strong{

    color:#fff;

    font-size:11px;
}


.eo342-profile-button small{

    margin-top:2px;

    color:
        #8ea6bd;

    font-size:9px;
}


.eo342-profile-button em{

    color:
        var(--eo342-gold);

    font-style:normal;
}


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

body:has(.eo342-customer-marker)
.etx-portal-page.etx-customer{

    width:
        min(
            1450px,
            calc(100% - 38px)
        )!important;

    max-width:
        1450px!important;

    margin:
        0 auto!important;

    padding:
        21px 0 48px!important;

    box-sizing:border-box;
}


/* =====================================================
   HERO
===================================================== */

.eo342-hero{

    position:relative;

    overflow:hidden;

    min-height:
        205px!important;

    display:grid!important;

    grid-template-columns:
        minmax(0,1fr) 270px!important;

    align-items:center!important;

    gap:30px!important;

    padding:
        34px 36px!important;

    border:
        1px solid
        #356895!important;

    border-radius:
        17px!important;

    background:
        radial-gradient(
            circle at 86% 43%,
            rgba(239,189,88,.18),
            transparent 10%
        ),
        radial-gradient(
            circle at 86% 45%,
            rgba(50,136,232,.28),
            transparent 31%
        ),
        linear-gradient(
            118deg,
            #0b3157,
            #071d39 62%,
            #06172d
        )!important;

    box-shadow:
        0 20px 48px
        rgba(0,0,0,.18)!important;
}


.eo342-hero::after{

    content:"";

    position:absolute;

    width:410px;
    height:410px;

    right:-60px;
    top:-180px;

    border:
        1px solid
        rgba(107,178,255,.19);

    border-radius:50%;
}


.eo342-hero > *{

    position:relative;

    z-index:2;
}


.eo342-hero .eyebrow{

    color:
        var(--eo342-gold)!important;

    font-size:
        9px!important;

    letter-spacing:
        .18em!important;
}


.eo342-hero h1{

    margin:
        7px 0 9px!important;

    color:#fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        clamp(
            40px,
            4vw,
            57px
        )!important;

    line-height:
        1!important;

    font-weight:
        400!important;
}


.eo342-hero p{

    max-width:
        740px!important;

    margin:0!important;

    color:
        #adc1d5!important;

    font-size:
        13px!important;

    line-height:
        1.6!important;
}


.eo342-hero
.etx-welcome-badge{

    min-height:
        105px;

    display:flex!important;

    flex-direction:column;

    justify-content:center;

    padding:
        18px!important;

    border:
        1px solid
        rgba(239,189,88,.53)!important;

    border-radius:
        13px!important;

    background:
        rgba(4,20,39,.58)!important;
}


.eo342-hero
.etx-welcome-badge b{

    color:
        var(--eo342-gold)!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        27px!important;
}


/* =====================================================
   KPI GRID
===================================================== */

.eo342-kpi-grid{

    display:grid;

    grid-template-columns:
        repeat(
            6,
            minmax(0,1fr)
        );

    gap:10px;

    margin:
        13px 0 17px;
}


.eo342-kpi{

    min-height:
        108px;

    display:grid;

    grid-template-columns:
        43px minmax(0,1fr);

    align-items:center;

    gap:11px;

    padding:
        14px;

    border:
        1px solid
        #315d89;

    border-radius:
        13px;

    background:
        radial-gradient(
            circle at 0 50%,
            rgba(76,157,248,.11),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            #092743,
            #061a32
        );

    color:#fff;

    text-decoration:none;

    box-shadow:
        0 11px 27px
        rgba(0,0,0,.10);

    transition:
        .16s ease;
}


.eo342-kpi:hover{

    transform:
        translateY(-3px);

    border-color:
        var(--eo342-gold);

    box-shadow:
        0 16px 34px
        rgba(0,0,0,.18);
}


.eo342-kpi i{

    width:41px;
    height:41px;

    display:grid;

    place-items:center;

    border:
        1px solid
        rgba(101,177,255,.38);

    border-radius:10px;

    background:
        rgba(38,120,209,.15);

    color:
        #7dbbff;

    font-size:17px;

    font-style:normal;
}


.eo342-kpi strong,
.eo342-kpi b,
.eo342-kpi small{

    display:block;
}


.eo342-kpi strong{

    color:#fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:22px;
}


.eo342-kpi b{

    margin-top:2px;

    color:#f3f7fb;

    font-size:10px;
}


.eo342-kpi small{

    margin-top:3px;

    color:
        #829bb4;

    font-size:9px;
}


/* =====================================================
   SECTION TITLE
===================================================== */

.eo342-section-title{

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    margin:
        0 0 9px;
}


.eo342-section-title span{

    color:
        var(--eo342-gold);

    font-size:
        8px;

    font-weight:
        900;

    letter-spacing:
        .17em;
}


.eo342-section-title h2{

    margin:
        4px 0 0!important;

    color:#fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        23px!important;
}


/* =====================================================
   QUICK ACTIONS
===================================================== */

.eo342-quick-row{

    display:grid!important;

    grid-template-columns:
        repeat(
            5,
            minmax(0,1fr)
        )!important;

    gap:
        10px!important;

    margin:
        0 0 17px!important;
}


.eo342-quick-row a{

    min-height:
        74px!important;

    padding:
        13px!important;

    border:
        1px solid
        #315d89!important;

    border-radius:
        11px!important;

    background:
        linear-gradient(
            145deg,
            #08243f,
            #06192f
        )!important;

    transition:
        .15s ease!important;
}


.eo342-quick-row a:hover{

    transform:
        translateY(-2px)!important;

    border-color:
        var(--eo342-gold)!important;
}


/* =====================================================
   DASHBOARD GRID
===================================================== */

.eo342-dashboard-grid{

    gap:
        12px!important;
}


.eo342-dashboard-grid
.etx-card{

    border:
        1px solid
        #315d89!important;

    border-radius:
        14px!important;

    background:
        linear-gradient(
            145deg,
            #08243f,
            #06192f
        )!important;

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.11)!important;
}


.eo342-dashboard-grid
.etx-card h2{

    color:#fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        20px!important;
}


/* =====================================================
   PROFILE / ACCOUNT CENTER
===================================================== */

.eo342-account{

    margin:
        17px 0;

    padding:
        21px;

    border:
        1px solid
        #315d89;

    border-radius:
        14px;

    background:
        radial-gradient(
            circle at 100% 0,
            rgba(239,189,88,.08),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #08243f,
            #06192f
        );

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


.eo342-account > header{

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:20px;

    margin-bottom:
        14px;
}


.eo342-account > header span{

    color:
        var(--eo342-gold);

    font-size:
        8px;

    font-weight:
        900;

    letter-spacing:
        .17em;
}


.eo342-account > header h2{

    margin:
        5px 0 5px!important;

    color:#fff!important;

    font-family:
        Georgia,
        "Times New Roman",
        serif!important;

    font-size:
        25px!important;
}


.eo342-account > header p{

    margin:0;

    color:
        #8fa8c0;

    font-size:
        11px;
}


.eo342-account > header > a{

    min-height:
        38px;

    display:inline-flex;

    align-items:center;

    padding:
        0 13px;

    border:
        1px solid
        var(--eo342-gold);

    border-radius:
        8px;

    color:
        var(--eo342-gold);

    text-decoration:none;

    font-size:
        10px;

    font-weight:
        900;
}


.eo342-account-grid{

    display:grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );

    gap:
        10px;
}


.eo342-account-grid > a{

    min-height:
        92px;

    display:grid;

    grid-template-columns:
        42px minmax(0,1fr) auto;

    align-items:center;

    gap:
        10px;

    padding:
        14px;

    border:
        1px solid
        #315d89;

    border-radius:
        11px;

    background:
        #071d37;

    color:#fff;

    text-decoration:none;
}


.eo342-account-grid > a:hover{

    border-color:
        var(--eo342-gold);
}


.eo342-account-grid i{

    width:40px;
    height:40px;

    display:grid;

    place-items:center;

    border-radius:
        10px;

    background:
        rgba(63,146,238,.13);

    color:
        #79b9ff;

    font-style:normal;
}


.eo342-account-grid b,
.eo342-account-grid small{

    display:block;
}


.eo342-account-grid b{

    font-size:12px;
}


.eo342-account-grid small{

    margin-top:4px;

    color:
        #899fb6;

    font-size:9px;

    line-height:1.4;
}


.eo342-account-grid em{

    color:
        var(--eo342-gold);

    font-style:normal;

    font-size:10px;

    font-weight:900;
}


/* =====================================================
   SUGGESTIONS
===================================================== */

.eo342-suggestions{

    margin-top:
        18px!important;
}


/* =====================================================
   MOBILE
===================================================== */

@media(max-width:1200px){

    .eo342-kpi-grid{

        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }


    .eo342-quick-row{

        grid-template-columns:
            repeat(3,minmax(0,1fr))!important;
    }

}


@media(max-width:980px){

    body:has(.eo342-customer-marker)
    main{

        width:
            100%!important;

        margin:
            0!important;
    }


    .eo342-customer-sidebar{

        transform:
            translateX(-105%);

        transition:
            transform .2s ease;
    }


    body.eo33-menu-open
    .eo342-customer-sidebar{

        transform:
            translateX(0);
    }


    .eo342-topbar{

        padding-left:
            65px;
    }


    body:has(.eo342-customer-marker)
    .eo33-mobile-toggle{

        display:block!important;
    }


    .eo342-account-grid{

        grid-template-columns:
            1fr;
    }

}


@media(max-width:700px){

    .eo342-topbar{

        position:relative;

        align-items:stretch;

        flex-direction:column;

        padding:
            12px 12px 12px 64px;
    }


    .eo342-search{

        width:100%;
    }


    .eo342-profile-button{

        min-width:
            0;

        flex:1;
    }


    .eo342-hero{

        grid-template-columns:
            1fr!important;

        min-height:
            0!important;

        padding:
            24px 20px!important;
    }


    .eo342-kpi-grid{

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .eo342-quick-row{

        grid-template-columns:
            1fr!important;
    }


    .eo342-account > header{

        align-items:flex-start;

        flex-direction:column;
    }

}


/* ELITA_V34_2_CUSTOMER_REAL_CSS_END */