/**
 * local-overrides.css
 * Overrides and additions for the standalone offline clone.
 * Adds btn-filled-custom / btn-outline-custom, and fixes local path references.
 */

/* ===== Navigation Buttons ===== */
.btn-filled-custom {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 54px;
    padding: 0 30px;
    background: #006080;
    color: #FFFFFF !important;
    border: none;
    border-radius: 5px;
    font-weight: 500;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 0.2s;
    min-width: 120px;
}
.btn-filled-custom:hover {
    background: #004d66;
}
.btn-filled-custom:disabled {
    background: #CCCCCC;
    cursor: not-allowed;
}

.btn-outline-custom {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 54px;
    padding: 0 30px;
    background: #FFFFFF;
    color: #006080 !important;
    border: 1px solid #006080;
    border-radius: 5px;
    font-weight: 500;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s;
    min-width: 120px;
}
.btn-outline-custom:hover {
    background: #EBF9FD;
}

/* ===== Group button responsive for standalone ===== */
.div-group-button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 20px;
    margin-top: 30px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}
.div-group-button button {
    margin-right: 0;
}

/* ===== div-input-container fix ===== */
.div-input-container {
    position: relative;
}

/* ===== Stage line override ===== */
.div-new-appointment .div-stage .div-line .hr {
    border-top: 2px dashed #006080;
    opacity: 1;
}
.div-new-appointment .div-stage .div-line .hr.inactive {
    opacity: 0.3;
}

/* ===== Hidden utility ===== */
.hidden {
    display: none !important;
}

/* ===== Booking complete icon area ===== */
.div-booking-complete-page .icon-completed {
    width: 80px;
    height: 80px;
}

/* ===== Calendar area ===== */
.div-calendar {
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    padding: 20px;
}

/* ===== Page content layout ===== */
.page-content-container {
    min-height: calc(100vh - 140px);
}

/* ===== Selectpicker width fix ===== */
.bootstrap-select {
    width: 100% !important;
}

/* ===== Header nav active styles ===== */
.div-header-page .div-option-language a.active,
.div-header-page .div-option-size a.active {
    color: #006080;
    font-weight: 600;
}

/* ===== Dialog overlay ===== */
.div-dialog-container:not(.hidden) {
    display: flex;
}

/* ===== Mobile: btn-custom (homepage) ===== */
@media(max-width:599px) {
    .div-group-button button.btn-custom {
        width: 45%;
        height: 160px;
    }
}