/* GMHS Clinical Command Center UI
 * Visual/accessibility layer only. No clinical or persistence logic is changed.
 */
:root {
    --gmhs-primary: #2563eb;
    --gmhs-primary-strong: #1d4ed8;
    --gmhs-accent: #0d9488;
    --gmhs-success: #059669;
    --gmhs-warning: #c2670a;
    --gmhs-danger: #b91c1c;
    --gmhs-surface: #ffffff;
    --gmhs-canvas: #f7fbff;
    --gmhs-border: #d8e3ef;
    --gmhs-text: #0f172a;
    --gmhs-muted: #475569;
    --gmhs-radius: 8px;
    --gmhs-shadow: 0 1px 3px rgba(30, 64, 175, 0.05), 0 8px 22px rgba(30, 64, 175, 0.04);
    --gmhs-shadow-hover: 0 4px 16px rgba(30, 64, 175, 0.10);
    --gmhs-focus: #0d9488;
}

html { color-scheme: light; }

body {
    background: var(--gmhs-canvas);
    color: var(--gmhs-text);
}

.gmhs-skip-link {
    position: fixed;
    z-index: 2000;
    top: 8px;
    left: 8px;
    padding: 10px 14px;
    border-radius: 6px;
    background: #0f172a;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    transform: translateY(-160%);
    transition: transform 120ms ease-out;
}

.gmhs-skip-link:focus { transform: translateY(0); }

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[role="link"]:focus-visible {
    outline: 3px solid var(--gmhs-focus) !important;
    outline-offset: 2px;
}

.gmhs-shell {
    background:
        radial-gradient(circle at 100% 0%, rgba(56, 189, 248, 0.10), transparent 30rem),
        linear-gradient(180deg, #fbfdff 0%, var(--gmhs-canvas) 100%) !important;
}

.gmhs-sidebar {
    background: linear-gradient(180deg, #ffffff 0%, #f6fbff 72%, #f0fdfa 100%) !important;
    border-right: 1px solid #dbeafe !important;
    box-shadow: 4px 0 18px rgba(37, 99, 235, 0.07) !important;
}

.gmhs-sidebar > div:first-child {
    background: #fff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Keep the transparent hospital logo on a clean white plate. */
.gmhs-auth-brand,
.gmhs-sidebar-brand-full,
.gmhs-sidebar-brand-mark {
    isolation: isolate;
}

.gmhs-auth-brand {
    position: relative;
    min-height: 76px;
    padding: 14px 20px !important;
    background: #fff !important;
    border-bottom-color: #e0f2fe !important;
}

.gmhs-auth-brand::after {
    position: absolute;
    right: 18%;
    bottom: -1px;
    left: 18%;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, #5eead4, #60a5fa, transparent);
    content: "";
}

.gmhs-hospital-logo,
.gmhs-auth-brand-logo,
.gmhs-sidebar-brand-full,
.gmhs-sidebar-brand-mark img {
    position: relative;
    z-index: 1;
    opacity: 1 !important;
    filter: none !important;
    mix-blend-mode: normal !important;
}

.gmhs-auth-brand-logo {
    width: min(100%, 292px) !important;
    max-height: 50px !important;
}

.gmhs-sidebar-brand-full {
    padding: 3px 5px;
    border-radius: 7px;
    background: #fff;
}

.gmhs-sidebar-brand-mark {
    border: 1px solid #dbeafe;
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.08) !important;
}

/* Bright, calm authentication surface instead of the legacy dark gradient. */
.auth-bg {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 14% 14%, rgba(45, 212, 191, 0.17), transparent 28rem),
        radial-gradient(circle at 88% 8%, rgba(96, 165, 250, 0.18), transparent 30rem),
        linear-gradient(145deg, #f8fffe 0%, #f5faff 52%, #eef7ff 100%) !important;
}

.auth-bg::before,
.auth-bg::after {
    position: absolute;
    border: 1px solid rgba(125, 211, 252, 0.28);
    border-radius: 999px;
    content: "";
    pointer-events: none;
}

.auth-bg::before {
    top: -11rem;
    right: -8rem;
    width: 28rem;
    height: 28rem;
}

.auth-bg::after {
    bottom: -13rem;
    left: -9rem;
    width: 31rem;
    height: 31rem;
}

.auth-bg > div {
    position: relative;
    z-index: 1;
    border: 1px solid rgba(186, 230, 253, 0.95);
    background: rgba(255, 255, 255, 0.98) !important;
    box-shadow: 0 22px 60px rgba(30, 64, 175, 0.12) !important;
}

.auth-bg form button[type="submit"] {
    background: linear-gradient(100deg, #2563eb 0%, #0d9488 100%) !important;
    box-shadow: 0 7px 18px rgba(37, 99, 235, 0.18) !important;
}

.auth-bg form button[type="submit"]:hover {
    filter: brightness(1.04);
    box-shadow: 0 9px 22px rgba(37, 99, 235, 0.24) !important;
}

.gmhs-sidebar nav button {
    width: calc(100% - 1rem);
    color: #334155 !important;
    border-left-color: transparent !important;
}

.gmhs-sidebar nav button:hover {
    background: #eff6ff !important;
    color: #1e3a8a !important;
}

.gmhs-sidebar nav button[aria-current="page"] {
    background: linear-gradient(90deg, #e0f2fe 0%, #ecfdf5 100%) !important;
    color: #1e3a8a !important;
    border-left-color: var(--gmhs-primary) !important;
    box-shadow: inset 0 0 0 1px #bfdbfe !important;
}

.gmhs-sidebar nav button[aria-current="page"] i {
    color: var(--gmhs-primary) !important;
}

.gmhs-sidebar-copyright {
    color: #475569 !important;
    border-top-color: #e2e8f0 !important;
}

.gmhs-sidebar-copyright span,
.gmhs-sidebar-copyright p { color: #475569 !important; }

.gmhs-header {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-color: var(--gmhs-border) !important;
}

.gmhs-header h1 {
    color: #1e40af !important;
    letter-spacing: .035em !important;
}

.gmhs-main .bg-white.rounded-xl,
.gmhs-main .bg-white.rounded-lg {
    box-shadow: var(--gmhs-shadow) !important;
}

.gmhs-main .bg-white.rounded-xl:hover,
.gmhs-main .bg-white.rounded-lg:hover {
    box-shadow: var(--gmhs-shadow-hover) !important;
}

.gmhs-main table tbody tr:hover {
    background-color: #eff6ff !important;
    box-shadow: inset 3px 0 0 var(--gmhs-primary) !important;
}

.gmhs-main button,
.gmhs-main a[role="button"],
.gmhs-sidebar button {
    transition-duration: 140ms !important;
}

.gmhs-toast-message {
    max-width: min(70vw, 28rem) !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
}

/* Bulletin: keep the duty roster separate from actions and never hide clinical names. */
@media (min-width: 1024px) {
    .gmhs-main.bulletin-view .gmhs-header {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: auto auto;
        align-items: center !important;
        height: auto !important;
        min-height: 88px;
        row-gap: .45rem;
        overflow: visible !important;
        padding-top: .55rem !important;
        padding-bottom: .55rem !important;
    }

    .gmhs-main.bulletin-view .gmhs-header > h1 {
        grid-column: 1;
        grid-row: 1;
        min-width: 0;
    }

    .gmhs-main.bulletin-view .gmhs-header-actions {
        grid-column: 2;
        grid-row: 1;
        margin-left: 1rem !important;
    }

    .gmhs-main.bulletin-view .gmhs-header-duty-slot {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
        min-width: 0;
        margin: 0 !important;
        align-self: stretch;
    }
}

.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-dept-info,
.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-host,
.gmhs-main.bulletin-view .gmhs-dept-info-inline,
.gmhs-main.bulletin-view .gmhs-dept-info-inline .gmhs-shift-host {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-card,
.gmhs-main.bulletin-view .gmhs-dept-info-inline .gmhs-shift-card {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    gap: .35rem .55rem !important;
    padding: .32rem .5rem !important;
}

.gmhs-main.bulletin-view .gmhs-shift-section,
.gmhs-main.bulletin-view .gmhs-shift-group,
.gmhs-main.bulletin-view .gmhs-shift-grid,
.gmhs-main.bulletin-view .gmhs-shift-names {
    min-width: 0 !important;
    max-width: 100% !important;
    flex-wrap: wrap !important;
    white-space: normal !important;
}

.gmhs-main.bulletin-view .gmhs-shift-section {
    flex: 1 1 24rem !important;
}

.gmhs-main.bulletin-view .gmhs-shift-names {
    flex: 1 1 12rem !important;
    overflow: visible !important;
}

.gmhs-main.bulletin-view .gmhs-shift-chip {
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
    line-height: 1.2 !important;
}

/* Administrative positions: show complete doctor and nurse labels. */
.gmhs-main.bulletin-view .gmhs-assignment-display-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)) !important;
    align-items: stretch !important;
    gap: .35rem !important;
    overflow: visible !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-display-tile {
    display: grid !important;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    min-height: 44px !important;
    height: auto !important;
    overflow: visible !important;
    border-color: #dbeafe !important;
    box-shadow: 0 1px 2px rgba(30, 64, 175, .06) !important;
}

/* Ô Code Blue to gấp đôi kích thước chiều ngang */
.gmhs-tile-code-blue,
.gmhs-assignment-display-tile.gmhs-tile-code-blue,
.gmhs-main.bulletin-view .gmhs-assignment-display-tile.gmhs-tile-code-blue {
    grid-column: span 2 !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-display-tile.gmhs-tile-code-blue {
    grid-template-columns: minmax(75px, auto) minmax(0, 1fr) !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-display-tile.gmhs-tile-code-blue .gmhs-assignment-room {
    flex: 0 0 auto !important;
    min-width: 70px !important;
    max-width: 90px !important;
    width: auto !important;
    white-space: nowrap !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-display-tile.gmhs-tile-code-blue .gmhs-assignment-person {
    flex: 1 1 auto !important;
    width: auto !important;
    justify-content: flex-start !important;
    padding-left: .5rem !important;
    padding-right: .5rem !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-display-tile.gmhs-tile-code-blue .gmhs-assignment-person-label {
    white-space: nowrap !important;
    text-align: left !important;
    font-size: clamp(0.92rem, 1.05vw, 1.12rem) !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-room,
.gmhs-main.bulletin-view .gmhs-assignment-person {
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: .32rem .45rem !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-room {
    border-right: 1px solid #e2e8f0;
    border-bottom: 0 !important;
    background: linear-gradient(135deg, #faf5ff 0%, #f5f3ff 100%) !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-person {
    justify-content: flex-start !important;
    background: #ffffff !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-room-label,
.gmhs-main.bulletin-view .gmhs-assignment-person-label {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-room-label {
    color: #334155 !important;
    font-size: .88rem !important;
    line-height: 1.22 !important;
    letter-spacing: .01em;
}

.gmhs-main.bulletin-view .gmhs-assignment-person-label {
    font-size: clamp(1rem, 1.05vw, 1.12rem) !important;
    line-height: 1.25 !important;
    text-align: left !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-person-label.text-blue-700 {
    color: #1d4ed8 !important;
}

.gmhs-main.bulletin-view .gmhs-assignment-person-label.text-teal-700 {
    color: #0f766e !important;
}

/* Reference colors: slate positions, blue doctors, teal nurses. */
.gmhs-main.bulletin-view .gmhs-doctor-assignment-section .gmhs-assignment-person-label {
    color: #1d4ed8 !important;
}

.gmhs-main.bulletin-view .gmhs-nurse-assignment-section .gmhs-assignment-person-label {
    color: #0f766e !important;
}

.gmhs-main.bulletin-view .gmhs-doctor-assignment-section .gmhs-assignment-display-tile,
.gmhs-main.bulletin-view .gmhs-nurse-assignment-section .gmhs-assignment-display-tile {
    border-left-width: 1px !important;
    border-color: #e2e8f0 !important;
    background: #ffffff !important;
}

.gmhs-main.bulletin-view .gmhs-doctor-assignment-section .gmhs-assignment-room,
.gmhs-main.bulletin-view .gmhs-nurse-assignment-section .gmhs-assignment-room {
    background: #f8fafc !important;
}

@media (max-width: 639px) {
    /* Compact read-only roster; retain wrapping and normal page scrolling. */
    .gmhs-main.bulletin-view .gmhs-daily-body {
        padding: 4px !important;
    }
    .gmhs-main.bulletin-view .gmhs-assignment-display-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 3px !important;
        padding: 3px !important;
    }
    .gmhs-main.bulletin-view .gmhs-doctor-assignment-section .gmhs-assignment-display-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
    .gmhs-main.bulletin-view .gmhs-assignment-display-tile {
        grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr);
        min-height: 32px !important;
        border-radius: 4px !important;
        box-shadow: none !important;
    }
    .gmhs-main.bulletin-view .gmhs-doctor-assignment-section .gmhs-assignment-display-tile {
        grid-template-columns: minmax(0, 1fr);
        align-content: start;
    }
    .gmhs-main.bulletin-view .gmhs-assignment-room,
    .gmhs-main.bulletin-view .gmhs-assignment-person {
        padding: 2px 3px !important;
    }
    .gmhs-main.bulletin-view .gmhs-doctor-assignment-section .gmhs-assignment-room {
        border-right: 0;
    }
    .gmhs-main.bulletin-view .gmhs-assignment-room-label,
    .gmhs-main.bulletin-view .gmhs-assignment-person-label {
        font-size: 12px !important;
        line-height: 1.15 !important;
        letter-spacing: normal;
    }
    .gmhs-main.bulletin-view .gmhs-daily-date-input {
        width: 132px !important;
        min-width: 132px !important;
        font-size: 14px !important;
    }
}

/* Improve small action controls without making dense clinical tables oversized. */
.gmhs-alert-button,
.gmhs-password-button,
.gmhs-logout-button,
.gmhs-toast-close {
    min-width: 40px !important;
    min-height: 40px !important;
}

@media (max-width: 767px) {
    .gmhs-header { min-height: 56px; }

    .gmhs-main button:not(.gmhs-surgery-case-card),
    .gmhs-main a[role="button"],
    .gmhs-sidebar button {
        min-height: 44px;
    }

    .gmhs-main input:not([type="checkbox"]):not([type="radio"]),
    .gmhs-main select,
    .gmhs-main textarea {
        min-height: 44px;
        font-size: 16px !important;
    }

    .gmhs-main.bulletin-view .gmhs-create-button:not(.gmhs-notice-create-button),
    .gmhs-main.bulletin-view .gmhs-alert-button,
    .gmhs-main.bulletin-view .gmhs-password-button,
    .gmhs-main.bulletin-view .gmhs-logout-button {
        min-width: 44px !important;
        min-height: 44px !important;
        width: 44px !important;
        height: 44px !important;
    }

    .gmhs-header h1 { font-size: 14px !important; }

    .auth-bg { padding: 16px !important; }

    .gmhs-auth-brand {
        min-height: 70px;
        padding: 12px 18px !important;
    }
}

/* Header refinement: one-line duty roster, with account actions in a dropdown. */
@media (min-width: 1024px) {
    .gmhs-main.bulletin-view .gmhs-header {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        height: auto !important;
        min-height: 56px;
        overflow: visible !important;
        padding-top: .45rem !important;
        padding-bottom: .45rem !important;
    }

    .gmhs-main.bulletin-view .gmhs-header-duty-slot {
        display: flex !important;
        flex: 1 1 auto !important;
        width: auto !important;
        margin: 0 .35rem !important;
    }
}

.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-dept-info,
.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-host {
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-card,
.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-section,
.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-group,
.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-grid,
.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-names {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}

.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-card {
    width: max-content !important;
    min-width: 100% !important;
    align-items: center !important;
    padding: .15rem .3rem !important;
}

.gmhs-main.bulletin-view .gmhs-header-duty-slot .gmhs-shift-section {
    flex: 0 0 auto !important;
}

.gmhs-main.bulletin-view .gmhs-dept-info-inline .gmhs-shift-host {
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

.gmhs-main.bulletin-view .gmhs-dept-info-inline .gmhs-shift-card,
.gmhs-main.bulletin-view .gmhs-dept-info-inline .gmhs-shift-section,
.gmhs-main.bulletin-view .gmhs-dept-info-inline .gmhs-shift-group,
.gmhs-main.bulletin-view .gmhs-dept-info-inline .gmhs-shift-grid,
.gmhs-main.bulletin-view .gmhs-dept-info-inline .gmhs-shift-names {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}

.gmhs-main.bulletin-view .gmhs-dept-info-inline .gmhs-shift-card {
    display: flex !important;
    width: max-content !important;
    min-width: 100% !important;
}

.gmhs-account-menu { z-index: 170; }

/* Account belongs to the persistent sidebar, including the pain module. */
.gmhs-sidebar-account {
    flex-shrink: 0;
    margin: 8px;
}
.gmhs-sidebar .gmhs-sidebar-account .gmhs-user-summary {
    width: 100%;
    max-width: none;
    min-height: 48px;
    padding: 10px;
    gap: 8px;
    color: #0f172a;
    box-shadow: none;
}
.gmhs-sidebar-account .gmhs-account-avatar {
    font-size: 24px;
    color: #0f766e;
    flex-shrink: 0;
}
.gmhs-sidebar-account .gmhs-account-identity {
    flex: 1;
    align-items: flex-start;
    gap: 4px;
}
.gmhs-sidebar-account .gmhs-account-identity span:first-child {
    max-width: 100% !important;
    white-space: normal;
    overflow-wrap: anywhere;
    font-size: 13px;
    line-height: 1.3;
}
.gmhs-sidebar-account .gmhs-account-dropdown {
    position: absolute !important;
    top: auto !important;
    bottom: calc(100% + 8px);
    left: 0;
    right: auto !important;
    width: 224px;
    max-width: calc(100vw - 32px);
    max-height: 50vh;
    overflow-y: auto;
}
.gmhs-sidebar-account .gmhs-account-dropdown button { min-height: 44px; }
.gmhs-sidebar-account[data-expanded="false"] .gmhs-account-identity,
.gmhs-sidebar-account[data-expanded="false"] .fa-chevron-down { display: none; }
.gmhs-sidebar-account[data-expanded="false"] .gmhs-user-summary { justify-content: center; }

.gmhs-account-menu .gmhs-user-summary {
    min-height: 40px;
    cursor: pointer;
}

.gmhs-account-menu .gmhs-user-summary:focus-visible,
.gmhs-account-dropdown button:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .3);
    outline-offset: 2px;
}

.gmhs-notice-create-button,
.gmhs-main.bulletin-view .gmhs-notice-create-button {
    width: auto !important;
    height: auto !important;
    min-width: 72px !important;
    min-height: 30px !important;
    padding: .3rem .55rem !important;
    border-radius: .45rem !important;
    font-size: .75rem !important;
    line-height: 1.2 !important;
    display: inline-flex;
    flex: 0 0 auto;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
}

@media (max-width: 767px) {
    .gmhs-main.bulletin-view .gmhs-notice-create-button {
        min-width: 76px !important;
        min-height: 44px !important;
    }
}

.gmhs-notice-inline-actions {
    position: relative;
    z-index: 2;
    overflow: visible;
    vertical-align: middle;
}

.gmhs-notice-inline-actions button {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

.gmhs-notice-inline-actions .gmhs-pin-action {
    border: 0 !important;
    background-color: transparent;
    box-shadow: none !important;
}

.gmhs-notice-inline-actions button:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .28);
    outline-offset: 1px;
}

@media (max-width: 639px) {
    .gmhs-account-menu .gmhs-user-summary {
        max-width: 108px;
        padding-left: .5rem;
        padding-right: .5rem;
    }

    .gmhs-account-menu .gmhs-user-summary span span:first-child {
        max-width: 76px;
    }

    .gmhs-account-dropdown {
        position: fixed !important;
        top: 58px !important;
        right: 8px !important;
    }

    .gmhs-notice-create-button {
        min-width: 76px !important;
        min-height: 36px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

@media print {
    .gmhs-skip-link { display: none !important; }
}