/*
    global stylesheet for website
    this css file contains styles intended for reuse across multiple pages
*/

* {
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
    box-shadow: none;
    box-sizing: border-box;
}

/* root */
:root {
    --eduLithanColorCode: #892068;
}

/* html */
html {
    font-size: 62.5%;
}

/* body */

body {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

body::-webkit-scrollbar {
    display: none;
}

/* main */
main {
    height: 88.6dvh;
    width: 95dvw;
    margin: 6.5rem auto 0;
}

/* form validation style */
form input.active,
form select.active {
    border-bottom: none;
    border: 0.1rem solid red;
    box-shadow: 0 0 0.3rem rgba(255, 0, 0, 0.3);
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
    background-color: var(--eduLithanColorCode);
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-cancel {
    background-color: blueviolet;
}

button.swal2-styled:focus,
button.swal2-styled:active,
button.swal2-styled:hover {
    box-shadow: none !important;
}

/* ===================================== header.php ===================================== */

header nav {
    background: white;
    border-radius: 0.1rem;
    box-shadow: 0 0.2rem 1rem rgb(137, 32, 98, 0.6);
    border: 0.1rem solid rgba(255, 255, 255, 0.3);
}

header nav .navbar-toggler {
    border: 0.1rem solid var(--eduLithanColorCode);
}

header nav .navbar-toggler:focus {
    box-shadow: none;
}

header nav .com_logo {
    width: 15rem;
}

header nav li.nav-item a.nav-link {
    border: 0.1rem solid var(--eduLithanColorCode);
    border-radius: 5rem;
    padding: 0.2rem 0.7rem;
    cursor: pointer;
    font-size: 1.2rem;
    font-weight: bold;
    min-width: 10rem;
    text-align: center;
    margin: 0.5rem;
}

header nav li.nav-item a.nav-link.active {
    background: var(--eduLithanColorCode);
    color: white;
}