/* Read-only form fields - Bootstrap only grays out :disabled, not
   [readonly], so a readonly text input otherwise looks identical to an
   editable one. */
.form-control[readonly] {
    background-color: var(--bs-secondary-bg);
    opacity: 1;
}

.readonly-icon {
    font-size: .75rem;
    color: var(--bs-secondary-color);
    vertical-align: middle;
}

.consultation-time-select {
    min-width: 4.5rem;
}

.notice {
    max-width: 100%;
    box-shadow: 0 4px 6px 0 rgba(0,0,0,0.2),5px 5px 10px 0 rgba(0,0,0,0.19);
}

@media (min-width: 768px) { 
    .notice {
      max-width: 50%;
    }
}

@media (min-width: 992px) { 
    .notice {
      max-width: 40%;
    }
}

@media (min-width: 1200px) { 
    .notice {
      max-width: 35%;
    }
}

@media (min-width: 1400px) { 
    .notice {
      max-width: 25%;
    }
}