/* Global background gradient */
html, body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    background: linear-gradient(135deg, #162447, #1f4068);
    background-attachment: fixed;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Ensure Dash root container stretches */
#react-entry-point, #_dash-app-content {
    min-height: 100%;
}

/* Optional: remove scrollbars in some browsers */
body::-webkit-scrollbar {
    width: 8px;
}
body::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,0.2);
    border-radius: 4px;
}

._dash-tabs {
    margin-top: 1.5rem !important;
}

/* Make "Signed in / Not signed in" text white */
#auth-status-text {
    color: white !important;
}


/* -------------------------------------------------------- */
/* FORCE ALL INPUTS TO 36PX HEIGHT — DASH DATEPICKER FIXES  */
/* -------------------------------------------------------- */

/* Outer container of the datepicker */
.SingleDatePickerInput {
    height: 36px !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
}

/* Wrapper of the text input */
.DateInput {
    height: 36px !important;
    padding: 0 !important;
}

/* The actual <input> field inside the datepicker */
.DateInput_input {
    height: 34px !important;
    line-height: 34px !important;
    padding: 0 10px !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
}

/* Remove unwanted focused border glow */
.DateInput_input__focused {
    border-bottom: 2px solid #1976D2 !important;
}

/* Time input uniform height */
input[type="time"] {
    height: 36px !important;
    line-height: 36px !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
    border-radius: 6px !important;
    border: 1px solid #ccc !important;
    font-size: 14px !important;
}

/* Device dropdown should match 36px height */
.Select-control {
    height: 36px !important;
    min-height: 36px !important;
}

.Select-value-label {
    line-height: 34px !important;
}

/* Ensure the whole Select element respects the 36px size */
.Select--single > .Select-control .Select-value {
    line-height: 34px !important;
}

/* Apply button — same height as inputs */
#custom-range-apply {
    height: 36px !important;
    padding: 0 14px !important; /* horizontal only */
    line-height: 36px !important;
    border-radius: 6px !important;
    box-sizing: border-box !important;
}