/* =========================================================
   EXAMVEDA GLOBAL THEME
========================================================= */

:root{
    --ev-bg:#fff;
    --ev-page-bg:#f8f9fa;
    --ev-surface:#fff;
    --ev-text:#212529;
    --ev-border:#e5e7eb;
    --ev-hover:#f5f7fa;
    --ev-muted:#6c757d;
    --ev-primary:#0d6efd;
    --ev-accent-soft:rgba(13,110,253,.08);
}

[data-bs-theme="dark"]{
    --ev-bg:#151719;
    --ev-page-bg:#101214;
    --ev-surface:#151719;
    --ev-text:#e9ecef;
    --ev-border:#303338;
    --ev-hover:#22252a;
    --ev-muted:#adb5bd;
    --ev-primary:#6ea8fe;
    --ev-accent-soft:rgba(110,168,254,.10);
}


/* =========================================================
   GLOBAL
========================================================= */

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    background:var(--ev-page-bg);
    color:var(--ev-text);
    transition:
        background-color .2s ease,
        color .2s ease;
}


/* =========================================================
   NAVBAR
========================================================= */

.exam-navbar{
    min-height:64px;
    background:var(--ev-bg);
    border-bottom:1px solid var(--ev-border);
}

.exam-navbar .navbar-brand{
    margin-right:28px;
    display:flex;
    align-items:center;
}

.exam-navbar .navbar-brand img{
    width:auto;
    max-width:170px;
    max-height:42px;
}


/* =========================================================
   LOGO THEME
========================================================= */

.logo-dark{
    display:none;
}

[data-bs-theme="dark"] .logo-light{
    display:none;
}

[data-bs-theme="dark"] .logo-dark{
    display:block;
}


/* =========================================================
   DESKTOP NAVIGATION
========================================================= */

.exam-navbar .nav-link{
    color:var(--ev-text);
    font-size:15px;
    font-weight:500;
    padding:20px 12px;
    white-space:nowrap;
}

.exam-navbar .nav-link:hover{
    color:var(--ev-primary);
}


/* =========================================================
   DESKTOP MEGA MENU
========================================================= */

@media(min-width:992px){

    .mega-dropdown{
        position:static;
    }

    .mega-dropdown:hover>.dropdown-menu{
        display:block;
        margin-top:0;
    }

    .mega-menu{
        position:absolute;
        left:15px;
        right:15px;
        width:auto;
        max-width:none;
        padding:24px;
        background:var(--ev-bg);
        border:1px solid var(--ev-border);
        border-radius:0 0 12px 12px;
        box-shadow:0 15px 40px rgba(0,0,0,.12);
    }

    .mega-group{
        padding:0 20px;
        border-right:1px solid var(--ev-border);
    }

    .mega-group:first-child{
        padding-left:0;
    }

    .mega-group:last-child{
        padding-right:0;
        border-right:0;
    }

}


/* =========================================================
   MEGA MENU CONTENT
========================================================= */

.mega-group-title{
    font-size:12px;
    font-weight:700;
    color:var(--ev-muted);
    text-transform:uppercase;
    letter-spacing:.05em;
    margin-bottom:10px;
}

.mega-link{
    display:block;
    padding:8px 10px;
    margin-left:-10px;
    color:var(--ev-text);
    text-decoration:none;
    font-size:14px;
    border-radius:6px;
}

.mega-link:hover{
    background:var(--ev-hover);
    color:var(--ev-primary);
}


/* =========================================================
   THEME BUTTON
========================================================= */

.ev-theme-button{
    width:38px;
    height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--ev-border);
    border-radius:50%;
    background:var(--ev-bg);
    color:var(--ev-text);
    font-size:17px;
    transition:
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease;
}

.ev-theme-button:hover{
    background:var(--ev-hover);
    color:var(--ev-primary);
}


/* =========================================================
   LOGIN
========================================================= */

.ev-login{
    display:flex;
    align-items:center;
    gap:7px;
    color:var(--ev-text);
    text-decoration:none;
    font-size:15px;
    font-weight:600;
    white-space:nowrap;
}

.ev-login:hover{
    color:var(--ev-primary);
}


/* =========================================================
   USER MENU
========================================================= */

.ev-user-button{
    display:flex;
    align-items:center;
    gap:7px;
    padding:5px 8px;
    border:0;
    background:transparent;
    color:var(--ev-text);
    font-size:15px;
    font-weight:600;
}

.ev-user-button:hover{
    color:var(--ev-primary);
}

.ev-user-icon{
    font-size:23px;
}

.ev-user-dropdown{
    min-width:210px;
    padding:8px;
    background:var(--ev-bg);
    border:1px solid var(--ev-border);
    border-radius:10px;
    box-shadow:0 10px 30px rgba(0,0,0,.15);
}

.ev-user-dropdown .dropdown-item{
    display:flex;
    align-items:center;
    gap:10px;
    color:var(--ev-text);
    padding:10px 12px;
    border-radius:6px;
}

.ev-user-dropdown .dropdown-item:hover{
    background:var(--ev-hover);
    color:var(--ev-primary);
}


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

.exam-offcanvas{
    width:88% !important;
    max-width:420px;
    background:var(--ev-bg);
    color:var(--ev-text);
}


/* =========================================================
   MOBILE MENU TOOLS
========================================================= */

.mobile-menu-tools{
    padding:8px 20px;
    border-bottom:1px solid var(--ev-border);
}

.mobile-tool-button,
.mobile-user-button{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:13px 0;
    border:0;
    background:transparent;
    color:var(--ev-text);
    text-decoration:none;
    font-size:15px;
    font-weight:600;
}

.mobile-tool-button:hover,
.mobile-user-button:hover{
    color:var(--ev-primary);
}

.mobile-tool-left,
.mobile-user-left{
    display:flex;
    align-items:center;
    gap:12px;
}

.mobile-tool-icon{
    width:22px;
    text-align:center;
    font-size:18px;
}

.mobile-user-icon{
    font-size:23px;
}


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

.mobile-section{
    border-bottom:1px solid var(--ev-border);
}

.mobile-section-button{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:17px 20px;
    border:0;
    background:var(--ev-bg);
    color:var(--ev-text);
    text-align:left;
}

.mobile-section-button:hover{
    background:var(--ev-hover);
}


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

.mobile-arrow{
    width:9px;
    height:9px;
    border-right:2px solid var(--ev-muted);
    border-bottom:2px solid var(--ev-muted);
    transform:rotate(45deg);
    transition:transform .2s ease;
}

.mobile-section-button[aria-expanded="true"] .mobile-arrow{
    transform:rotate(225deg);
}


/* =========================================================
   MOBILE MENU CONTENT
========================================================= */

.mobile-section-content{
    background:var(--ev-hover);
}

.mobile-group-title{
    padding:15px 20px 7px;
    color:var(--ev-muted);
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.mobile-link{
    display:block;
    padding:11px 20px 11px 35px;
    color:var(--ev-text);
    text-decoration:none;
    font-size:15px;
}

.mobile-link:hover{
    background:var(--ev-hover);
    color:var(--ev-primary);
}


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

.mobile-home{
    display:block;
    padding:16px 20px;
    color:var(--ev-text);
    text-decoration:none;
    font-weight:600;
    border-bottom:1px solid var(--ev-border);
}

.mobile-home:hover{
    background:var(--ev-hover);
}


/* =========================================================
   MOBILE ASK QUESTION
========================================================= */

.mobile-ask{
    padding:20px;
    border-top:1px solid var(--ev-border);
}


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

@media(max-width:991.98px){

    .exam-navbar{
        min-height:60px;
    }

    .exam-navbar .navbar-brand{
        margin-right:0;
    }

    .exam-navbar .navbar-brand img{
        max-width:150px;
        max-height:38px;
    }

}

@media(max-width:375px){

    .exam-offcanvas{
        width:92% !important;
    }

}


/* =========================================================
   GLOBAL BREADCRUMBS
========================================================= */

.ev-breadcrumb-wrapper{
    width:100%;
    background:var(--ev-bg);
    border-bottom:1px solid var(--ev-border);
}

.ev-breadcrumb{
    min-height:46px;
    display:flex;
    align-items:center;
    padding:.65rem 0;
    font-size:.88rem;
    line-height:1.4;
}

.ev-breadcrumb .breadcrumb-item{
    display:flex;
    align-items:center;
    color:var(--ev-muted);
}

.ev-breadcrumb .breadcrumb-item a{
    color:var(--ev-muted);
    text-decoration:none;
    transition:color .2s ease;
}

.ev-breadcrumb .breadcrumb-item a:hover{
    color:var(--ev-primary);
}

.ev-breadcrumb .breadcrumb-item.active{
    color:var(--ev-text);
    font-weight:500;
}

.ev-breadcrumb .breadcrumb-item+.breadcrumb-item::before{
    color:var(--ev-muted);
    opacity:.65;
}

@media(max-width:767.98px){

    .ev-breadcrumb{
        min-height:42px;
        padding:.55rem 0;
        font-size:.82rem;
        white-space:nowrap;
        overflow-x:auto;
        scrollbar-width:none;
    }

    .ev-breadcrumb::-webkit-scrollbar{
        display:none;
    }

}


/* =========================================================
   GLOBAL HORIZONTAL SCROLL NAVIGATION
========================================================= */

.ev-scroll-nav{
    position:relative;
    width:100%;
    margin:1.5em 0;
}

.ev-scroll-nav-wrapper{
    position:relative;
    width:100%;
}

.ev-scroll-nav-track{
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:none;
    -ms-overflow-style:none;
}

.ev-scroll-nav-track::-webkit-scrollbar{
    display:none;
}


/* Inner navigation must be wider than the screen when required */

.ev-scroll-nav-track .nav{
    display:flex;
    flex-wrap:nowrap;
    gap:.5rem;
    width:max-content;
    min-width:max-content;
    margin:0;
}


/* Navigation Links */

.ev-scroll-nav .nav-link{
    white-space:nowrap;
    color:var(--ev-primary);
    background:var(--ev-bg);
    border:1px solid var(--ev-border);
    border-radius:50rem;
    font-size:.92rem;
    font-weight:500;
    padding:.55rem 1rem;

    transition:
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.ev-scroll-nav .nav-link:hover{
    background:var(--ev-hover);
    color:var(--ev-primary);
}

.ev-scroll-nav .nav-link.active{
    background:var(--ev-primary);
    border-color:var(--ev-primary);
    color:#fff;
    font-weight:600;
    box-shadow:0 .25rem .75rem rgba(13,110,253,.20);
}


/* =========================================================
   HORIZONTAL SCROLL INDICATOR
========================================================= */

.ev-scroll-nav-indicator{
    display:none;
}


@media(max-width:767.98px){

    .ev-scroll-nav-track{
        padding-right:50px;
    }

    .ev-scroll-nav-indicator{
        position:absolute;
        right:0;
        top:0;
        bottom:0;
        width:55px;

        display:flex;
        align-items:center;
        justify-content:flex-end;

        padding-right:8px;

        pointer-events:none;

        background:linear-gradient(
            to right,
            transparent,
            var(--ev-bg) 60%
        );

        color:var(--ev-primary);
    }

    .ev-scroll-nav-indicator i{
        font-size:1rem;
        animation:evScrollNavHint 1.5s ease-in-out infinite;
    }

}


/* =========================================================
   SCROLL HINT ANIMATION
========================================================= */

@keyframes evScrollNavHint{

    0%,
    100%{
        transform:translateX(0);
        opacity:.5;
    }

    50%{
        transform:translateX(4px);
        opacity:1;
    }

}

/* =========================================================
   EXAM NAME / EXAM INTERNAL PAGE
   COMMON CONTENT COMPONENTS
========================================================= */

.exam-hero{
    background:var(--ev-surface);
    color:var(--ev-text);
    border-radius:10px;
    padding:35px;
    margin-bottom:30px;
    box-shadow:0 3px 15px rgba(0,0,0,.05);
}

.exam-logo{
    max-height:140px;
    width:auto;
}

.exam-article{
    background:var(--ev-surface);
    color:var(--ev-text);
    border-radius:10px;
    padding:.5em;
    box-shadow:0 3px 15px rgba(0,0,0,.05);
}

.exam-article img{
    max-width:100%;
    height:auto;
}

.sidebar-card{
    background:var(--ev-surface);
    color:var(--ev-text);
    border-radius:10px;
    box-shadow:0 3px 15px rgba(0,0,0,.05);
}

.section-title{
    margin-top:50px;
    margin-bottom:20px;
    font-weight:700;
    color:var(--ev-text);
}

.sidebar-card .table{
    color:var(--ev-text);
}

.sidebar-card .table td,
.sidebar-card .table th{
    padding:.75rem;
}


/* =========================================================
   EXAM EXPLORE SECTION
========================================================= */

.exam-explore{
    padding:1.5rem;
    border-radius:16px;
    background:var(--ev-accent-soft);
}

.exam-explore-header h2{
    font-weight:700;
    color:var(--ev-text);
}

.exam-topic-card{
    display:block;
    height:100%;
    background:var(--ev-surface);
    color:var(--ev-text);
    border-radius:12px;
    box-shadow:0 3px 15px rgba(0,0,0,.06);
    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.exam-topic-card:hover{
    color:var(--ev-text);
    transform:translateY(-2px);
    box-shadow:0 8px 24px rgba(0,0,0,.10);
}

.exam-topic-card-body{
    min-height:76px;
    padding:1rem 1.15rem;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
}

.exam-topic-exam{
    color:var(--ev-muted);
    font-size:.78rem;
    margin-bottom:2px;
}

.exam-topic-title{
    font-weight:600;
    line-height:1.4;
}

.exam-topic-arrow{
    flex-shrink:0;
    color:var(--ev-primary);
    font-size:1.15rem;
    transition:transform .2s ease;
}

.exam-topic-card:hover .exam-topic-arrow{
    transform:translateX(4px);
}


/* =========================================================
   EXAM PAGE RESPONSIVE
========================================================= */

@media(max-width:767.98px){

    .exam-hero{
        padding:24px 20px;
        border-radius:10px;
    }

    .exam-hero h1{
        font-size:2rem;
    }

    .exam-hero .lead{
        font-size:1rem;
        line-height:1.6;
    }

    .exam-logo{
        max-height:100px;
    }

    .exam-article{
        padding:.25rem;
    }

    .section-title{
        margin-top:35px;
        margin-bottom:15px;
    }

    .exam-explore{
        padding:1rem;
        border-radius:12px;
    }

}


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

.sidebar-card .table{
    margin-bottom:0;
}

.sidebar-card .table th{
    font-weight:600;
}

@media(max-width:575.98px){

    .sidebar-card .table{
        font-size:.9rem;
    }

    .sidebar-card .table td,
    .sidebar-card .table th{
        padding:.6rem;
    }

}



/* =========================================================
   EXAM ORGANIZATION DIRECTORY
========================================================= */

.exam-organization-exams{
    margin-top:2.5rem;
}


/* =========================================================
   SECTION HEADER
========================================================= */

.exam-organization-section-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:1.5rem;
}

.exam-organization-section-heading h2{
    margin:0;
    color:var(--ev-text);
    font-size:1.65rem;
    font-weight:700;
    line-height:1.3;
}

.exam-organization-section-heading p{
    margin:.4rem 0 0;
    color:var(--ev-muted);
    font-size:.92rem;
}

.exam-count{
    flex-shrink:0;
    padding:.4rem .8rem;
    border:1px solid var(--ev-border);
    border-radius:50rem;
    background:var(--ev-bg);
    color:var(--ev-muted);
    font-size:.8rem;
    font-weight:600;
}


/* =========================================================
   EXAM CARD
========================================================= */

.exam-directory-card{
    display:block;

    height:100%;

    background:var(--ev-bg);

    color:var(--ev-text);

    border:1px solid var(--ev-border);

    border-radius:14px;

    overflow:hidden;

    box-shadow:
        0 2px 8px rgba(0,0,0,.035);

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
}


.exam-directory-card:hover{
    color:var(--ev-text);

    transform:translateY(-3px);

    border-color:var(--ev-primary);

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


/* =========================================================
   MAIN CARD AREA
========================================================= */

.exam-directory-main{
    display:flex;

    align-items:center;

    gap:16px;

    padding:20px 20px 14px;
}


/* =========================================================
   LOGO
========================================================= */

.exam-directory-logo{
    width:72px;

    height:72px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    background:var(--ev-hover);

    border:1px solid var(--ev-border);

    border-radius:12px;

    overflow:hidden;
}


.exam-directory-logo img{
    width:100%;

    height:100%;

    object-fit:contain;

    padding:7px;
}


.exam-directory-logo-placeholder{
    width:100%;

    height:100%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:1.5rem;

    font-weight:700;

    color:var(--ev-primary);
}


/* =========================================================
   EXAM INFORMATION
========================================================= */

.exam-directory-info{
    min-width:0;

    flex:1;
}


.exam-directory-title-row{
    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:10px;
}


.exam-directory-title-row h3{
    margin:0;

    color:var(--ev-text);

    font-size:1.15rem;

    font-weight:700;

    line-height:1.35;
}


.exam-directory-title-row i{
    flex-shrink:0;

    color:var(--ev-muted);

    font-size:1rem;

    transition:
        transform .2s ease,
        color .2s ease;
}


.exam-directory-card:hover
.exam-directory-title-row i{

    color:var(--ev-primary);

    transform:translate(2px,-2px);
}


.exam-directory-full-name{
    margin-top:4px;

    color:var(--ev-muted);

    font-size:.8rem;

    line-height:1.4;

    display:-webkit-box;

    -webkit-line-clamp:2;

    -webkit-box-orient:vertical;

    overflow:hidden;
}


/* =========================================================
   META
========================================================= */

.exam-directory-meta{

    display:flex;

    flex-wrap:wrap;

    gap:7px;

    padding:0 20px 14px;
}


.exam-directory-meta span{

    display:inline-flex;

    align-items:center;

    padding:4px 9px;

    background:var(--ev-hover);

    border:1px solid var(--ev-border);

    border-radius:6px;

    color:var(--ev-muted);

    font-size:.72rem;

    font-weight:600;
}


/* =========================================================
   USEFUL LINKS
========================================================= */

.exam-directory-links{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:0;

    margin:0 20px;

    padding:12px 0;

    border-top:1px solid var(--ev-border);

    border-bottom:1px solid var(--ev-border);
}


.exam-directory-links span{

    color:var(--ev-muted);

    font-size:.76rem;

    font-weight:500;

    padding-right:10px;

    margin-right:10px;

    border-right:1px solid var(--ev-border);
}


.exam-directory-links span:last-child{

    border-right:0;

    margin-right:0;

    padding-right:0;
}


/* =========================================================
   CTA
========================================================= */

.exam-directory-cta{

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:14px 20px;

    color:var(--ev-primary);

    font-size:.82rem;

    font-weight:600;
}


.exam-directory-cta i{

    font-size:.95rem;

    transition:transform .2s ease;
}


.exam-directory-card:hover
.exam-directory-cta i{

    transform:translateX(4px);
}


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

@media(max-width:767.98px){

    .exam-organization-section-heading{

        align-items:flex-start;

    }


    .exam-organization-section-heading h2{

        font-size:1.4rem;

    }


    .exam-organization-section-heading p{

        font-size:.84rem;

    }


    .exam-count{

        font-size:.72rem;

    }


    .exam-directory-main{

        padding:16px;

    }


    .exam-directory-logo{

        width:62px;

        height:62px;

        border-radius:10px;

    }


    .exam-directory-title-row h3{

        font-size:1.05rem;

    }


    .exam-directory-meta{

        padding-left:16px;

        padding-right:16px;

    }


    .exam-directory-links{

        margin-left:16px;

        margin-right:16px;

    }


    .exam-directory-cta{

        padding:13px 16px;

    }

}

/* =========================================================
   EXAM ORGANIZATION
   EXPLORE EXAM SECTIONS
========================================================= */

.exam-sections{

    margin-top:3.5rem;

}


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

.exam-sections-header{

    margin-bottom:1.25rem;

}


.exam-sections-header h2{

    color:var(--ev-text);

    font-size:1.65rem;

    font-weight:700;

}


.exam-sections-header p{

    color:var(--ev-muted);

    font-size:.92rem;

}


/* =========================================================
   ACCORDION
========================================================= */

.exam-sections-accordion{

    border:1px solid var(--ev-border);

    border-radius:14px;

    overflow:hidden;

    background:var(--ev-bg);

}


/* =========================================================
   ACCORDION ITEM
========================================================= */

.exam-section-item{

    border:0;

    border-bottom:1px solid var(--ev-border);

    background:var(--ev-bg);

}


.exam-section-item:last-child{

    border-bottom:0;

}


/* =========================================================
   EXAM BUTTON
========================================================= */

.exam-section-button{

    display:flex;

    align-items:center;

    gap:14px;

    padding:15px 20px;

    background:var(--ev-bg);

    color:var(--ev-text);

    box-shadow:none !important;

}


.exam-section-button:not(.collapsed){

    background:var(--ev-hover);

    color:var(--ev-text);

}


.exam-section-button:hover{

    background:var(--ev-hover);

}


/* Remove Bootstrap blue focus */

.exam-section-button:focus{

    box-shadow:none;

}


/* =========================================================
   LOGO
========================================================= */

.exam-section-logo{

    width:48px;

    height:48px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid var(--ev-border);

    border-radius:9px;

    background:var(--ev-bg);

    overflow:hidden;

}


.exam-section-logo img{

    width:100%;

    height:100%;

    object-fit:contain;

    padding:5px;

}


/* =========================================================
   EXAM NAME
========================================================= */

.exam-section-name{

    min-width:0;

    flex:1;

    display:flex;

    flex-direction:column;

}


.exam-section-name strong{

    color:var(--ev-text);

    font-size:1rem;

    line-height:1.4;

}


.exam-section-name small{

    margin-top:2px;

    color:var(--ev-muted);

    font-size:.76rem;

    font-weight:400;

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;

    max-width:500px;

}


/* =========================================================
   SECTION COUNT
========================================================= */

.exam-section-count{

    flex-shrink:0;

    padding:4px 9px;

    border:1px solid var(--ev-border);

    border-radius:50rem;

    background:var(--ev-hover);

    color:var(--ev-muted);

    font-size:.72rem;

    font-weight:600;

}


/* =========================================================
   ACCORDION BODY
========================================================= */

.exam-section-item .accordion-body{

    padding:0;

    background:var(--ev-hover);

    border-top:1px solid var(--ev-border);

}


/* =========================================================
   INTERNAL PAGE LINKS
========================================================= */

.exam-section-links{

    display:grid;

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

    gap:1px;

    background:var(--ev-border);

}


.exam-section-link{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:10px;

    padding:13px 16px;

    background:var(--ev-bg);

    color:var(--ev-text);

    text-decoration:none;

    font-size:.87rem;

    transition:
        background-color .15s ease,
        color .15s ease;

}


.exam-section-link:hover{

    background:var(--ev-hover);

    color:var(--ev-primary);

}


.exam-section-link-name{

    line-height:1.4;

}


.exam-section-link i{

    flex-shrink:0;

    color:var(--ev-muted);

    font-size:.8rem;

    transition:
        transform .15s ease,
        color .15s ease;

}


.exam-section-link:hover i{

    color:var(--ev-primary);

    transform:translateX(3px);

}


/* =========================================================
   VIEW EXAM
========================================================= */

.exam-section-view-exam{

    padding:13px 16px;

    background:var(--ev-bg);

    border-top:1px solid var(--ev-border);

    text-align:right;

}


.exam-section-view-exam a{

    color:var(--ev-primary);

    font-size:.82rem;

    font-weight:600;

}


.exam-section-view-exam a:hover{

    color:var(--ev-primary);

}


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

@media(max-width:767.98px){

    .exam-sections{

        margin-top:2.5rem;

    }


    .exam-sections-header h2{

        font-size:1.4rem;

    }


    .exam-sections-header p{

        font-size:.84rem;

        line-height:1.5;

    }


    .exam-section-button{

        padding:13px 14px;

        gap:10px;

    }


    .exam-section-logo{

        width:42px;

        height:42px;

    }


    .exam-section-name strong{

        font-size:.92rem;

    }


    .exam-section-name small{

        max-width:160px;

    }


    .exam-section-count{

        font-size:.68rem;

        padding:3px 7px;

    }


    .exam-section-links{

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

    }


    .exam-section-link{

        padding:12px;

        font-size:.8rem;

    }


    .exam-section-view-exam{

        text-align:center;

    }

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media(max-width:420px){

    .exam-section-count{

        display:none;

    }


    .exam-section-name small{

        max-width:140px;

    }


    .exam-section-links{

        grid-template-columns:1fr;

    }

}

/* =========================================================
   GLOBAL PAGINATION
========================================================= */

#pagination {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 2rem !important;
    margin-bottom: 2rem !important;
}


/*
|--------------------------------------------------------------------------
| Pagination Container
|--------------------------------------------------------------------------
*/

#pagination > div {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: .35rem;
}


/*
|--------------------------------------------------------------------------
| Pagination Items
|--------------------------------------------------------------------------
*/

#pagination > div > a,
#pagination > div > span {

    min-width: 38px;
    min-height: 38px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: .35rem .65rem;

    color: var(--ev-text);
    background: var(--ev-bg);

    border: 1px solid var(--ev-border);

    border-radius: .5rem;

    text-decoration: none;

    font-size: .9rem;
    font-weight: 500;

    transition:
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;
}


/*
|--------------------------------------------------------------------------
| Hover
|--------------------------------------------------------------------------
*/

#pagination > div > a:hover {

    color: var(--ev-primary);

    background: var(--ev-hover);

    border-color: var(--ev-primary);

    transform: translateY(-1px);

}


/*
|--------------------------------------------------------------------------
| Active Page
|--------------------------------------------------------------------------
*/

#pagination > div > span.active {

    color: #fff;

    background: var(--ev-primary);

    border-color: var(--ev-primary);

    font-weight: 600;

    box-shadow:
        0 .25rem .75rem rgba(13,110,253,.20);

}


/*
|--------------------------------------------------------------------------
| Previous / Next Icons
|--------------------------------------------------------------------------
*/

#pagination > div > a i {

    font-size: 1rem;

}


/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 575.98px) {

    #pagination {

        margin-top: 1.5rem !important;
        margin-bottom: 1.5rem !important;

        overflow-x: auto;

        justify-content: flex-start;

        scrollbar-width: none;

    }

    #pagination::-webkit-scrollbar {
        display: none;
    }


    #pagination > div {

        flex-wrap: nowrap;

        justify-content: flex-start;

        width: max-content;

        padding: 0 .5rem;

    }


    #pagination > div > a,
    #pagination > div > span {

        min-width: 36px;
        min-height: 36px;

        flex-shrink: 0;

        padding: .3rem .55rem;

    }

}