/* JO Visitor Counter - Hospital Putrajaya Footer */
.visitor-counter-custom {
    color: #ffffff !important;
    font-family: Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #780000;
}

.visitor-counter-custom a {
    color: #ffffff !important;
    text-decoration: none !important;
    background-color: #780000 !important;
}

.visitor-counter-custom span {
    color: #0a100d !important;
    background-color: #780000 !important;
}

.visitor-counter-custom li {
    background-color: #780000 !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

/* Hide metadata in Smart Search results */
.com-finder__results .result__taxonomy {
    display: none !important;
}

/* ==============================
   STAFF DIRECTORY SLIDER
   ============================== */

.directory-slider {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
}

/* Hide radio buttons */
.directory-slider > input[type="radio"] {
    display: none;
}

/* Hide all slides */
.directory-slide {
    display: none;
}

/* Show selected slide */

#slide1:checked ~ .slide-1 {
    display: block;
}

#slide2:checked ~ .slide-2 {
    display: block;
}

#slide3:checked ~ .slide-3 {
    display: block;
}

#slide4:checked ~ .slide-4 {
    display: block;
}


/* TITLE */

.directory-slide h2 {
    color: #c00000;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin: 20px 0;
}


/* TABLE */

.directory-slide table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 auto;
}

.directory-slide th {
    padding: 8px;
    border: 1px solid #cccccc;
    background-color: #8d0801;
    color: #ffffff;
    text-align: center;
}

.directory-slide td {
    padding: 10px;
    border: 1px solid #cccccc;
}


/* BUTTONS */

.directory-buttons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 25px 0;
}

.directory-buttons label {
    background-color: #8d0801;
    color: #ffffff;
    padding: 10px 16px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    text-align: center;
}

.directory-buttons label:hover {
    background-color: #c00000;
}


/* ACTIVE BUTTON */

#slide1:checked ~ .directory-buttons label[for="slide1"],
#slide2:checked ~ .directory-buttons label[for="slide2"],
#slide3:checked ~ .directory-buttons label[for="slide3"],
#slide4:checked ~ .directory-buttons label[for="slide4"] {
    background-color: #c00000;
}


/* MOBILE */

/* =========================================
   HAMBURGER ICON - MAKE IT VISIBLE
   ========================================= */

@media (max-width: 768px) {

    .container-header .navbar-toggler {
        background-color: #800000 !important;
        border: 2px solid #800000 !important;
        color: #ffffff !important;
        width: 50px;
        height: 45px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        z-index: 1000;
    }

    .container-header .navbar-toggler-icon {
        display: block !important;
        width: 25px;
        height: 25px;
        background-image: none !important;
        position: relative;
    }

    .container-header .navbar-toggler-icon::before {
        content: "☰";
        color: #ffffff !important;
        font-size: 28px;
        line-height: 25px;
        font-weight: bold;
    }
}

/* =========================================
   ACCESSIBILITY - ALL TEXT
   ========================================= */

html {
    --accessibility-font-scale: 1;
}


/* SMALL */

body.accessibility-small {
    font-size: 85% !important;
}


/* NORMAL */

body.accessibility-normal {
    font-size: 100% !important;
}


/* LARGE */

body.accessibility-large {
    font-size: 115% !important;
}


/* EXTRA LARGE */

body.accessibility-xlarge {
    font-size: 130% !important;
}


/* VERY LARGE */

body.accessibility-xxlarge {
    font-size: 150% !important;
}


/* Make text-based elements follow the body size */

body.accessibility-small *,
body.accessibility-normal *,
body.accessibility-large *,
body.accessibility-xlarge *,
body.accessibility-xxlarge * {
    font-size: inherit;
}