.navbar-vertical .navbar-nav .nav-link.active {
    background: linear-gradient(90deg, #172b4d 0%, #1a1f37 100%);
    color: #fff;
}
.navbar-vertical .navbar-nav .nav-link.active .nav-link-text,
.navbar-vertical .navbar-nav .nav-link.active i,
.navbar-vertical .navbar-nav .nav-link.active .icon,
.navbar-vertical .navbar-nav .nav-link.active .icon i,
.navbar-vertical .navbar-nav .nav-link.active .text-dark {
    color: #fff !important;
}
.table td, .table th {
    vertical-align: middle;
}
.pagination .page-item.active .page-link {
    color: #fff;
}
.table-search .form-control,
.table-search .btn {
    height: 40px;
}
.table-search .btn-icon {
    display:flex;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    padding:0;
}
.table-search .form-control {
    border-top-left-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
    border: 1px solid #d2d6da;
    border-right: 0;
    border-left: 0;
    padding: 0  0.85rem !important;
    background: #fff;
    box-shadow: none;
}

/* Advanced panel animation */
#advanced-search{
    transition: max-height 240ms ease, opacity 200ms ease;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
}
#advanced-search.open{
    max-height: 800px; /* large enough for content */
    opacity: 1;
}

/* style active advanced button */
.table-search .btn.active{
    background-color:#e9ecef;
}
.table-search .btn {
    border-top-right-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
    padding: 0 0.9rem;
    box-shadow: none;
    border: 1px solid #d2d6da;
}
.table-search .btn:hover {
    background-color: #e9ecef !important;
    border-color: #d2d6da !important;
    transform: translate(0, 0) !important;
}
.table-search .form-control:focus {
    box-shadow: inset 0 0 0 0.1rem rgba(94, 114, 228, 0.15);
    border-right: 0 !important;
    border-left: 0 !important;
}
.booking-badge {
    width: 140px;
    min-height: 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    padding: 6px 8px;
    border-radius: 0.5rem;
    font-size: 0.75rem;
    line-height: 1.1;
    color: #1f2937;
}
.booking-badge label {
    color: inherit;
    font-weight: 600;
}
.form-control-color {
    width: 3rem;
    height: 2.5rem;
    padding: 0.25rem;
    border-radius: 0.5rem;
}
.class-badge {
    width: 140px;
    min-height: 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    padding: 6px 8px;
    border-radius: 0.5rem;
    font-size: 0.75rem;
    line-height: 1.1;
    color: #1f2937;
    text-decoration: none;
}
.table th.day-alt,
.table td.day-alt {
    background-color: #f8f9fa !important;
}
@media (max-width: 576px) {
    .sidenav {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        border-radius: 0 !important;
    }
}
.mail-template-card {
    min-height: 70vh;
}
.mail-template-card .card-body {
    display: flex;
    flex-direction: column;
}
.mail-template-card textarea,
.mail-template-card iframe {
    flex: 1 1 auto;
    min-height: 50vh;
}
.mail-template-card textarea {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    white-space: pre;
}

/* Fix: align "Plan Name" input and its Create button in exercises table
   Scoped to table inputs to avoid global changes. This forces matching
   box sizing, padding and height so the input and button visually match. */
table.table .input-group > #plan_name.form-control,
table.table .input-group > #plan_name.form-control:focus,
table.table .input-group > button.btn.bg-gradient-primary,
table.table .input-group > button.btn.bg-gradient-primary.btn-sm {
    height: calc(2.25rem + 2px);
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
}

/* Button-specific tweaks: ensure same box metrics as input and remove extra margins */
table.table .input-group > button.btn.bg-gradient-primary,
table.table .input-group > button.btn.bg-gradient-primary.btn-sm {
    padding: 0.375rem 0.75rem !important;
    margin: 0 !important;
    line-height: 1.5 !important;
    justify-content: center;
    vertical-align: middle;
}

/* Ensure the input-group is vertically centered inside the table row */
table.table td.align-content-center {
    vertical-align: middle; /* fallback for table layout */
}
table.table td.align-content-center .input-group {
    display: inline-flex; /* keep it inline with surrounding content */
    align-items: center;   /* center children vertically */
    height: auto;
}
