/** do not delete - placeholder file to be used if no custom-style.css file is provided */
/** Libre Variable Overrides **/
:root {
    --color-lines: #a6a6a6;
    --reservable: #ffffff;
    --unreservable: #CF9D9B;
    --reserved: #408AD2;
    --reservedMine: #6F9BAE;
    --reservedParticipating: #875cae;
    --reservedPending: #f2dfbf;
    --pasttime: #bdbdbd;
    --hiliteReservation: #70A42C;
    --bs-body-color: #464d53;
}

[data-bs-theme="default"] {

    --background-image: url('../img/backgrounds/login-background-container-image.png');

    /* Colors */
    --primary: #70A42C;
    --primary-hover: #5b8621;
    --primary-disabled: #b1c09d;
    --text-color-btn: #ffffff;
    --secondary: #248D9F;
    --secondary-hover: #147283;
    --primary-disabled: #97a4a7;
    --color-danger: #c74040;

    /** Navbar Color **/
    --navbar-top-color: #fff;
    --navbar-link-color: #333333;

    /** Navbar Color **/
    --main-text: #3B3E35;
    --bs-secondary-bg: #D0D0D0;
    --color-text-body: #272727;

    /** Neutral Color **/
    --color-neutral-white: #ffffff;
    --color-neutral-dark: #4f5347;
    --color-neutral-border: #D0D0D0;

    /** Background Colors **/
    --color-background: #eeeff0;


    /* Component Colors */
    --color-background-accordian-header: F8F9FA;

    /* Typography */
    --font-family-nav: "Nunito Sans";
    --font-size-nav: 12px;
    --font-weight-nav: 700;

    --font-family-heading: "Poppins";
    --font-size-h1: 30px;
    --font-weight-h1: 700;
    --font-size-h2: 22px;
    --font-weight-h2: 600;
    --font-size-label: 14px;
    --font-weight-label: 700;
    --font-size-modal-h2: 30px;
    --font-weight-modal-h2: 600;

    --font-family-input: "Roboto";
    --font-size-input: 16px;
    --font-weight-input: 400;

    /* Spacing */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-6: 24px;
    --space-8: 32px;
}

/************************************
*
*  Typography
*
************************************/

/* Body/Heading/H1 — Poppins Bold 30px */
.text-h1 {
    font-family: var(--font-family-heading), sans-serif;
    font-size: var(--font-size-h1);
    font-weight: var(--font-weight-h1);
    line-height: 1;
    letter-spacing: 0;
}

/* Body/Heading/H2 Panel — Poppins SemiBold 22px */
.text-h2 {
    font-family: var(--font-family-heading), sans-serif;
    font-size: var(--font-size-h2);
    font-weight: var(--font-weight-h2);
    line-height: 1;
    letter-spacing: 0;
}

/* Modal/Heading/H2 — Poppins SemiBold 30px */
.text-modal-h2 {
    font-family: var(--font-family-heading), sans-serif;
    font-size: var(--font-size-modal-h2);
    font-weight: var(--font-weight-modal-h2);
    line-height: 1;
    letter-spacing: 0;
}

/* Body/Label — Poppins Bold 14px */
.text-label {
    font-family: var(--font-family-heading), sans-serif;
    font-size: var(--font-size-label);
    font-weight: var(--font-weight-label);
    line-height: 1;
    letter-spacing: 0;
}

/* Navigation/Text — Nunito Sans Bold 12px */
.text-nav {
    font-family: var(--font-family-nav), sans-serif;
    font-size: var(--font-size-nav);
    font-weight: var(--font-weight-nav);
    line-height: 1;
    letter-spacing: 0;
}

/* Input/Placeholder — Roboto Regular 16px */
.text-input {
    font-family: var(--font-family-input), sans-serif;
    font-size: var(--font-size-input);
    font-weight: var(--font-weight-input);
    line-height: 1;
    letter-spacing: 0;
}

.link-primary {
    color: var(--secondary) !important;
}

/************************************
*
*  Navigation Primary
*
************************************/
.nav-top {
    background: var(--navbar-top-color);
}

.navbar-nav .link-primary {
    color: var(--navbar-link-color) !important;
}

/************************************
*
*  Accordian
*
************************************/

.accordion-item {
    border-radius: var(--space-4);
    border: 1px solid var(--color-neutral-border);
    margin-bottom: var(--space-5);
}

.accordion-header .accordion-button {
    font-family: var(--font-family-heading), sans-serif;
    font-size: var(--font-size-h2);
    font-weight: var(--font-weight-h2);
    line-height: 1;
    letter-spacing: 0;
}

.accordion-button.collapsed {
    background: var(--color-background-accordian-header) !important;
    color: var(--main-text) !important;
}

.accordion-button:not(.collapsed) {
    background: var(--color-background-accordian-header) !important;
    color: var(--main-text) !important;
}

.accordion-button:hover {
    background: var(--bs-secondary-bg);
    color: var(--main-text) !important;
}

.accordion-header {
    background: var(--bs-secondary-bg);
    color: var(--main-text) !important;
}

.accordion-header:has(.accordion-icon-container.collapsed) {
    background: #ffffff;
    color: var(--main-text) !important;
}

.accordion-header:hover {
    background: var(--bs-secondary-bg) !important;
    color: var(--primary) !important;
}

.accordion-footer button {
    min-width: 150px;
}


/************************************
*
*  Login Page
*
************************************/
body:has(#page-login) {
    background-color: #eeeff0;
}

#login-page-wrap {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

#forgotbox {
    background-color: #eeeff0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.login-client-header {
    text-align: center;
    border-radius: 50%;
    border: 5px solid #565656;
    margin: 0 auto 1rem;
    width: 110px;
    height: 110px;
    overflow: hidden;
    background: #fff;
    flex-shrink: 0;
}

.login-client-header img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.login-client-name {
    font-size: 1.1rem;
    color: #4d4d4d;
    margin-bottom: 1.5rem;
    text-align: center;
}

.login-card {
    max-width: 512px;
    width: 100%;
    border-radius: 8px !important;
    box-shadow: 0 4px 7px rgba(0, 0, 0, 0.15) !important;
    border: none !important;
    z-index: 2;
}

.login-card::before {
    content: '';
    z-index: 1;
    background: var(--background-image) center center no-repeat;
    background-size: contain;
    position: absolute;
    top: -20px;
    bottom: -20px;
    left: -20px;
    right: -20px;
}

.login-card .card-body {
    z-index: 2;
    background: #fff;
    background: var(--bs-card-bg);
}

.login-alphacility-logo {
    max-width: 350px;
    display: block;
    margin: 1.5rem auto 2.5rem;
}

.login-label {
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: 4px;
    display: block;
}

.login-input {
    border: 1px solid #919191 !important;
    border-radius: 8px !important;
    height: 40px;
}

.login-input:focus {
    border-color: #8cc63f !important;
    box-shadow: 0 0 0 0.2rem rgba(140, 198, 63, 0.25) !important;
}

.login-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.login-meta-row .link-primary {
    color: #4e7b13 !important;
    font-size: 0.95rem;
}

.login-btn-signin {
    background-color: #8cc63f !important;
    border-color: #8cc63f !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-weight: 600;
}

.login-btn-signin:hover {
    background-color: #70a42c !important;
    border-color: #70a42c !important;
}

.login-register-row {
    text-align: center;
    margin: 0.75rem 0;
    font-size: 0.95rem;
    color: #4d4d4d;
}

.login-register-row a {
    color: #4e7b13 !important;
    font-weight: 600;
}

.login-divider {
    border-color: #d8d8d8;
    margin: 0.75rem 0;
}

.login-social-btn {
    width: 100%;
    background: #fff;
    border: 1px solid #d8d8d8;
    border-radius: 8px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 600;
    color: #333;
    text-decoration: none;
}

.login-social-btn:hover {
    background: #f5f5f5;
    color: #333;
}

.login-social-secondary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    margin-top: 0.5rem;
}

.login-change-language {
    text-align: center;
    margin-top: 0.25rem;
}

.login-change-language .link-primary {
    color: #4e7b13 !important;
}

.login-copyright {
    text-align: center;
    font-size: 0.9rem;
    color: #4d4d4d;
    margin-top: 1rem;
}


/************************************
*
*  Footer
*
************************************/
#global-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--color-neutral-white);
    border-top: 1px solid var(--bs-secondary-bg);
    padding: 0 var(--space-4);
    height: 58px;
}

.footer-logo {
    height: 28px;
    width: auto;
    display: block;
}

.footer-logo-link {
    display: flex;
    align-items: center;
}

.footer-copyright {
    font-family: var(--font-family-nav), sans-serif;
    font-size: var(--font-size-nav);
    font-weight: var(--font-weight-nav);
    color: var(--color-text-body);
    white-space: nowrap;
}

/************************************
*
*  General Applied Styles
*
************************************/
body {
    background: var(--color-background);
    min-height: 100vh;
}

#main {
    background: var(--color-background);
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 1.5rem 1rem;
}

/************************************
*
*  Calendar
*
************************************/

.fc-view-container {
    background-color: #fff;
}