/* small styles for slot rows */
.slot-row input[type="radio"] { transform: scale(1.1); }
.slot-row { cursor: pointer; padding:8px 10px; border:1px solid #f0f0f0; border-radius:5px; }
/* Make modal centered, white and responsive */
#phlebModal .modal-dialog {
    max-width: 50%;          /* Desktop width */
    margin: auto;            /* Center horizontally */
}

#phlebModal .modal-content {
    background: #ffffff;     /* White background */
    border-radius: 12px;
    padding: 5px;
	height:350px;
}

/* Center modal vertically */
#phlebModal .modal-dialog {
    display: flex;
    align-items: center;
    min-height: calc(100vh - 40px);
}
#phlebModal .modal-footer {
    justify-content: flex-start !important;
	border:0px !important;
}
#phlebModal button{
	border-radius: 5px !important; 
}
#phlebModal input[type="radio"], #phlebModal input[type="checkbox"]  {
    width: 15px !important;
    height: 13px !important;
    transform: scale(1) !important; /* keep shape proportional */
    accent-color: #007bff !important; /* Bootstrap blue (optional) */
    cursor: pointer !important;
    margin-right: 8px !important;
}

#phlebModal input[type="text"]{
	display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

/* Mobile responsive: full width on small screens */
@media (max-width: 768px) {
	#phlebModal .modal-dialog {
        display: block !important;       /* override flex centering */
        margin: 50px auto 20px auto;     /* top margin 50px, bottom 20px */
        max-width: 95%;
		margin-top:60px;
    }

    #phlebModal .modal-content {
        height: auto;                    /* auto adjust to content */
        max-height: none;                /* remove fixed max-height */
        overflow: visible;               /* no unnecessary scroll */
    }	
}


