/* ==========================================================================
   Clinical record form — structural / behavioural CSS
   --------------------------------------------------------------------------
   Lifted out of the 607-line inline <style> block that used to live in
   views/clinical-record/_form.php.

   Everything to do with LOOK (panels, headings, buttons, inputs, labels,
   badges, alerts, quick-nav, print, responsive) has been removed — that is
   now web/css/celt-theme.css. What is left here is layout, stacking context
   and behaviour that the theme does not own.

   The removed rules were the source of the old appearance: eleven sections
   coloured with four unrelated Bootstrap gradients (purple #667eea→#764ba2,
   teal #17a2b8, green #2ecc71, orange #f39c12) plus !important overrides
   that fought the Bootstrap 3 / Bootstrap 4 stylesheets against each other.
   ========================================================================== */

/* --- Record choice overlay (no Bootstrap modal JS required) -------------- */
.record-action-overlay {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(15, 23, 42, 0.55);
    overflow-y: auto;
}

.record-action-overlay.is-open { display: flex !important; }

.record-action-overlay-content {
    position: relative;
    width: 100%;
    max-width: 520px;
    background: #fff;
    border-radius: var(--celt-radius, 8px);
    box-shadow: 0 20px 50px rgba(11, 34, 66, 0.25);
    padding: 22px 24px 18px;
    z-index: 1;
}

.record-action-overlay-content .close {
    position: absolute;
    right: 12px;
    top: 8px;
    font-size: 28px;
    font-weight: 300;
    opacity: 0.6;
    background: none;
    border: 0;
    cursor: pointer;
}

.record-action-overlay-title {
    margin-top: 0;
    margin-bottom: 14px;
    padding-right: 28px;
    font-size: 1.1rem;
    font-weight: 650;
}

.record-action-summary { margin-bottom: 12px; line-height: 1.5; }
.record-action-help    { margin-bottom: 18px; font-size: 0.86rem; line-height: 1.5; }

/* --- Stacking context ---------------------------------------------------
   Dropdowns and the datepicker popup must escape their containers, and must
   sit above the sticky section-navigation rail. */
.clinical-record-form,
.clinical-record-form .enhanced-form,
.clinical-record-form .panel,
.clinical-record-form .panel-body,
.clinical-record-form .subsection-panel,
.clinical-record-form .patient-type-panel,
.clinical-record-form .alert-container {
    overflow: visible !important;
}

.clinical-record-form .dropdown-menu,
.clinical-record-form .datepicker-dropdown,
.clinical-record-form .bootstrap-datetimepicker-widget.dropdown-menu,
.kv-datepicker .dropdown-menu,
.datepicker-dropdown,
.datetimepicker {
    z-index: 9000 !important;
}

/* --- Patient search block ----------------------------------------------- */
.search-container {
    background: var(--celt-surface-2, #f7f9fd);
    padding: 16px;
    border-radius: var(--celt-radius, 8px);
    border: 1px solid var(--celt-hairline, #e3e8f0);
}

.search-button-container { margin-top: 12px; }
.search-btn { width: 100%; }

.search-results {
    max-height: 300px;
    overflow-y: auto;
    margin-top: 15px;
}

.search-results .alert { margin-bottom: 12px; }

/* --- Section spacing ----------------------------------------------------- */
.form-section { scroll-margin-top: 130px; }

/* --- Controls that need a larger hit area -------------------------------- */
.clinical-record-form input[type="checkbox"],
.clinical-record-form input[type="radio"] {
    transform: scale(1.25);
    transform-origin: left center;
    vertical-align: middle;
    margin-right: 6px;
}

/* --- Busy indicator ------------------------------------------------------ */
.glyphicon-spin { animation: spin 1s infinite linear; }

@keyframes spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .glyphicon-spin { animation: none; }
}

/* --- Keep the debug toolbar off this page -------------------------------- */
.yii-debug-toolbar,
.debug-toolbar,
[class*="yii-debug"] { display: none !important; }