@media (min-width: 1400px) {
    .content-page {
        padding: 10px 0px 0px 0px;
    }

    .footer {
        margin: auto 0px 0px;
    }
}

/* ================================
   Font Size Utility Classes
   Range: 10px to 50px
   ================================= */
.fs-10 {
    font-size: 10px;
}

.fs-11 {
    font-size: 11px;
}

.fs-12 {
    font-size: 12px;
}

.fs-13 {
    font-size: 13px;
}

.fs-14 {
    font-size: 14px;
}

.fs-15 {
    font-size: 15px;
}

.fs-16 {
    font-size: 16px;
}

.fs-17 {
    font-size: 17px;
}

.fs-18 {
    font-size: 18px;
}

.fs-19 {
    font-size: 19px;
}

.fs-20 {
    font-size: 20px;
}

.fs-21 {
    font-size: 21px;
}

.fs-22 {
    font-size: 22px;
}

.fs-23 {
    font-size: 23px;
}

.fs-24 {
    font-size: 24px;
}

.fs-25 {
    font-size: 25px;
}

.fs-26 {
    font-size: 26px;
}

.fs-27 {
    font-size: 27px;
}

.fs-28 {
    font-size: 28px;
}

.fs-29 {
    font-size: 29px;
}

.fs-30 {
    font-size: 30px;
}

.fs-31 {
    font-size: 31px;
}

.fs-32 {
    font-size: 32px;
}

.fs-33 {
    font-size: 33px;
}

.fs-34 {
    font-size: 34px;
}

.fs-35 {
    font-size: 35px;
}

.fs-36 {
    font-size: 36px;
}

.fs-37 {
    font-size: 37px;
}

.fs-38 {
    font-size: 38px;
}

.fs-39 {
    font-size: 39px;
}

.fs-40 {
    font-size: 40px;
}

.fs-41 {
    font-size: 41px;
}

.fs-42 {
    font-size: 42px;
}

.fs-43 {
    font-size: 43px;
}

.fs-44 {
    font-size: 44px;
}

.fs-45 {
    font-size: 45px;
}

.fs-46 {
    font-size: 46px;
}

.fs-47 {
    font-size: 47px;
}

.fs-48 {
    font-size: 48px;
}

.fs-49 {
    font-size: 49px;
}

.fs-50 {
    font-size: 50px;
}

/* ================================
   Font Weight Utility Classes
   Range: 100 to 900
   ================================= */

.fw-100 {
    font-weight: 100;
}

.fw-200 {
    font-weight: 200;
}

.fw-300 {
    font-weight: 300;
}

.fw-400 {
    font-weight: 400;
}

.fw-500 {
    font-weight: 500;
}

.fw-600 {
    font-weight: 600;
}

.fw-700 {
    font-weight: 700;
}

.fw-800 {
    font-weight: 800;
}

.fw-900 {
    font-weight: 900;
}

/* Optional Common Aliases */
.fw-normal {
    font-weight: 400;
}

.fw-medium {
    font-weight: 500;
}

.fw-semibold {
    font-weight: 600;
}

.fw-bold {
    font-weight: 700;
}

.fw-bolder {
    font-weight: 900;
}

/* Toastr Notification Fix for Light / Dark Mode Visibility */
#toast-container > div,
.toast {
    opacity: 1 !important;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3), 0 8px 10px -6px rgba(0, 0, 0, 0.2) !important;
    border-radius: 10px !important;
    color: #ffffff !important;
    font-weight: 500 !important;
    padding: 14px 14px 14px 50px !important;
}

#toast-container > .toast-error,
.toast.toast-error {
    background-color: #dc2626 !important;
    border: 1px solid #b91c1c !important;
}

#toast-container > .toast-success,
.toast.toast-success {
    background-color: #059669 !important;
    border: 1px solid #047857 !important;
}

#toast-container > .toast-info,
.toast.toast-info {
    background-color: #2563eb !important;
    border: 1px solid #1d4ed8 !important;
}

#toast-container > .toast-warning,
.toast.toast-warning {
    background-color: #d97706 !important;
    border: 1px solid #b45309 !important;
}

#toast-container .toast-message,
#toast-container .toast-title,
.toast .toast-message,
.toast .toast-title {
    color: #ffffff !important;
    opacity: 1 !important;
    text-shadow: none !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
}

#toast-container .toast-title,
.toast .toast-title {
    font-weight: 700 !important;
    font-size: 14px !important;
    margin-bottom: 3px !important;
}

.toast-close-button {
    color: #ffffff !important;
    opacity: 0.85 !important;
    text-shadow: none !important;
}

.toast-close-button:hover {
    opacity: 1 !important;
}

/* ================================
   Bootstrap Scrollable Modal & Form Flex Fix
   Ensures modal body scrolls smoothly and footer buttons stay visible on small screen PCs
   ================================= */
.modal-dialog-scrollable {
    max-height: calc(100vh - 2rem) !important;
}

@media (min-width: 576px) {
    .modal-dialog-scrollable {
        max-height: calc(100vh - 3.5rem) !important;
    }
}

.modal-dialog-scrollable .modal-content {
    max-height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

.modal-dialog-scrollable .modal-content > form,
.modal-dialog-scrollable .modal-content form.modal-form-flex {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    flex: 1 1 auto !important;
}

.modal-dialog-scrollable .modal-header,
.modal-dialog-scrollable .modal-footer {
    flex-shrink: 0 !important;
}

.modal-dialog-scrollable .modal-body {
    overflow-y: auto !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 160px) !important;
}

/* ================================
   iOS Safe Area Inset Support (iPhone Notch & Status Bar)
   ================================= */
@supports (padding-top: env(safe-area-inset-top)) {
    .app-topbar {
        padding-top: env(safe-area-inset-top, 0px) !important;
        height: calc(70px + env(safe-area-inset-top, 0px)) !important;
    }

    body {
        padding-top: env(safe-area-inset-top, 0px);
        padding-bottom: env(safe-area-inset-bottom, 0px);
        padding-left: env(safe-area-inset-left, 0px);
        padding-right: env(safe-area-inset-right, 0px);
    }

    .content-page {
        margin-top: env(safe-area-inset-top, 0px);
    }
}