/* =================================================
   York University Bootstrap 5 Theme
   Based on YorkU brand guidelines
   ================================================= */

/* --- Core Brand Tokens -------------------------------- */
:root {
    --yorku-red:         #c8102e;
    --yorku-red-dark:    #a50d26;
    --yorku-burgundy:    #8c1d40;
    --yorku-burgundy-dk: #6e1531;
    --yorku-light-bg:    #fcf7f8;
    --yorku-border:      #e3d9dc;
    --yorku-navbar-bg:   #c8102e;

    /* Override Bootstrap CSS custom properties */
    --bs-primary:              #c8102e;
    --bs-primary-rgb:          200, 16, 46;
    --bs-secondary:            #8c1d40;
    --bs-secondary-rgb:        140, 29, 64;
    --bs-link-color:           #c8102e;
    --bs-link-color-rgb:       200, 16, 46;
    --bs-link-hover-color:     #8c1d40;
    --bs-link-hover-color-rgb: 140, 29, 64;
    --bs-body-bg:              #fcf7f8;
    --bs-body-font-family:     'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* --- Body & Typography -------------------------------- */
body {
    background-color: #ffffff;
}

h1, h2, h3, h4 {
    color: var(--yorku-burgundy);
}

a {
    color: var(--yorku-red);
    text-decoration: none;
}

a:hover {
    color: var(--yorku-burgundy);
    text-decoration: underline;
}

/* Content links inside the page body get an underline; interactive
   controls (.btn, .nav-link, etc.) are reset below. */
main a:not(.btn):not(.nav-link):not(.navbar-brand):not(.york-logo-link) {
    text-decoration: underline;
}

main a:not(.btn):not(.nav-link):not(.navbar-brand):not(.york-logo-link):hover {
    text-decoration: underline;
    color: var(--yorku-burgundy);
}

/* Ensure buttons rendered as anchors are never underlined */
a.btn, a.btn:hover, a.btn:focus {
    text-decoration: none;
}

/* --- YorkU Header (Logo + Auth Bar) ------------------- */
#york-header {
    background-color: #ffffff;
    border-bottom: 3px solid var(--yorku-red);
    padding: 0.35rem 0;
}

#york-logo-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.york-logo-link {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    border-bottom: none;
}

.york-logo-link:hover {
    border-bottom: none;
    opacity: 0.85;
}

.york-logo-link img {
    height: 38px;
    width: auto;
    display: block;
}

.york-logo-text {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--yorku-red);
    letter-spacing: 1px;
}

/* --- App Title Bar ------------------------------------ */
#york-title-bar {
    background-color: var(--yorku-burgundy);
    padding: 0.35rem 0;
}

#york-title-bar h1 {
    color: #ffffff;
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0;
    line-height: 1.2;
}

/* --- Horizontal Navbar -------------------------------- */
.york-navbar {
    background-color: var(--yorku-navbar-bg) !important;
    border-radius: 0;
    padding-top: 0;
    padding-bottom: 0;
}

.york-navbar .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.9) !important;
    padding: 0.5rem 0.9rem;
    font-size: 0.88rem;
    font-weight: 600;
    border-bottom: none;
    border-top: 2px solid transparent;
    transition: background-color 0.15s ease;
}

.york-navbar .navbar-nav .nav-link:hover {
    color: #ffffff !important;
    background-color: rgba(0, 0, 0, 0.15);
    border-bottom: none;
}

.york-navbar .navbar-nav .nav-link.active {
    color: #ffffff !important;
    background-color: rgba(0, 0, 0, 0.2);
    border-top-color: #ffffff;
    font-weight: 600;
    border-bottom: none;
}

.york-navbar .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.5);
    margin: 0.2rem 0;
}

.york-navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* dropdown behavior + styling */
.york-navbar .dropdown-menu {
    border-radius: 0;
    border-color: #d9d9d9;
    box-shadow: 0 0.35rem 0.75rem rgba(0, 0, 0, 0.12);
    min-width: 14rem;
}

.york-navbar .dropdown-item {
    font-size: 0.9rem;
    font-weight: 400;
    padding: 0.45rem 0.9rem;
}

.york-navbar .dropdown-item:hover,
.york-navbar .dropdown-item:focus {
    background-color: rgba(200, 16, 46, 0.12);
    color: #8c1d40;
}

@media (min-width: 768px) {
    .york-hover-dropdown:hover > .dropdown-menu {
        display: block;
        margin-top: 0;
    }
}

/* mobile: stack nav items */
@media (max-width: 767.98px) {
    .york-navbar .navbar-nav .nav-link {
        padding: 0.65rem 1rem;
        border-top: none;
        border-left: 3px solid transparent;
    }

    .york-navbar .navbar-nav .nav-link.active {
        border-top-color: transparent;
        border-left-color: #ffffff;
    }
}

/* --- Page Content ------------------------------------- */
.page-content {
    padding-top: 0.85rem;
    padding-bottom: 1.5rem;
}

main h1 {
    font-size: 1.2rem;
    line-height: 1.2;
    margin-bottom: 0.45rem;
    flex: 1 1 auto;
    min-width: 0;
}

.workflow-page-header {
    padding-bottom: 0.35rem;
    border-bottom: 1px solid #dee2e6;
}

.workflow-page-header .text-muted {
    font-size: 1rem;
    line-height: 1.2;
    margin-top: 0.05rem;
}

@media (max-width: 767.98px) {
    main h1 {
        font-size: 1.1rem;
    }
}

.page-note,
.page-note p,
.page-note span,
.page-note em,
.page-note strong {
    color: #0a4a8a !important;
    font-style: italic;
    font-weight: 400 !important;
}

.page-note {
    margin-bottom: 0.75rem;
}

.page-note-label {
    color: #0a4a8a !important;
    font-style: normal;
    font-weight: 700 !important;
}

.workflow-important-notice {
    border: 1px solid #f1e5be;
    background-color: #fff8e5;
    color: #946c20;
    padding: 0.75rem 1rem;
    margin-bottom: 0.85rem;
    line-height: 1.35;
}

.workflow-important-notice-label {
    font-weight: 700;
}

/* --- Compact Content Density --------------------------- */
main p,
main .text-muted {
    margin-bottom: 0.55rem;
    line-height: 1.35;
}

main p.text-muted,
main .text-muted.page-note,
main p[class*="note" i] {
    color: #0a4a8a !important;
    font-style: italic;
    font-weight: 400 !important;
}

main .form-label {
    margin-bottom: 0.2rem;
    font-size: 0.95rem;
}

main .form-control,
main .form-select,
main .btn {
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
    font-size: 0.95rem;
}

main .form-control,
main .form-select {
    min-height: calc(1.5em + 0.6rem + 2px);
}

main .alert {
    padding: 0.55rem 0.75rem;
    margin-bottom: 0.75rem;
}

main .table {
    margin-bottom: 0.65rem;
}

main .table > :not(caption) > * > * {
    padding: 0.38rem 0.5rem;
    line-height: 1.25;
}

/* --- Buttons ------------------------------------------ */
.workflow-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    line-height: 1;
}

.workflow-icon-btn svg {
    width: 1rem;
    height: 1rem;
}

.workflow-icon-btn .bi {
    font-size: 1rem;
    line-height: 1;
}

.btn-primary {
    --bs-btn-color:              #fff;
    --bs-btn-bg:                 var(--yorku-red);
    --bs-btn-border-color:       var(--yorku-red);
    --bs-btn-hover-bg:           var(--yorku-red-dark);
    --bs-btn-hover-border-color: var(--yorku-red-dark);
    --bs-btn-active-bg:          #8c0b1f;
    --bs-btn-active-border-color:#8c0b1f;
    --bs-btn-focus-shadow-rgb:   200, 16, 46;
}

.btn-secondary {
    --bs-btn-color:              #fff;
    --bs-btn-bg:                 var(--yorku-burgundy);
    --bs-btn-border-color:       var(--yorku-burgundy);
    --bs-btn-hover-bg:           var(--yorku-burgundy-dk);
    --bs-btn-hover-border-color: var(--yorku-burgundy-dk);
}

.btn-outline-primary {
    --bs-btn-color:           var(--yorku-red);
    --bs-btn-border-color:    var(--yorku-red);
    --bs-btn-hover-color:     #fff;
    --bs-btn-hover-bg:        var(--yorku-red);
    --bs-btn-hover-border-color: var(--yorku-red);
    --bs-btn-active-bg:       var(--yorku-red);
}

.btn-outline-danger {
    --bs-btn-color:           var(--yorku-red);
    --bs-btn-border-color:    var(--yorku-red);
    --bs-btn-hover-color:     #fff;
    --bs-btn-hover-bg:        var(--yorku-red);
    --bs-btn-hover-border-color: var(--yorku-red);
    --bs-btn-active-bg:       var(--yorku-red);
}

/* --- Focus / Accessibility ----------------------------- */
.btn:focus, .btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.25rem var(--yorku-red);
}

/* --- Cards -------------------------------------------- */
.card-header {
    background-color: var(--yorku-burgundy);
    color: #ffffff;
    border-bottom-color: var(--yorku-burgundy-dk);
}

.card-header h4, .card-header h5 {
    color: #ffffff;
    margin: 0;
}

/* --- Tables ------------------------------------------- */
.table > thead {
    background-color: var(--yorku-burgundy);
    color: #ffffff;
}

.table > thead > tr > th {
    background-color: var(--yorku-burgundy) !important;
    border-color: var(--yorku-burgundy-dk);
    color: #ffffff !important;
}

/* --- Deterministic Grid Header Contrast ---------------- */
.table thead th.ddg-static-header,
.ddg-static-header {
    color: #ffffff !important;
}

/* --- Badges ------------------------------------------- */
.badge.bg-primary {
    background-color: var(--yorku-red) !important;
}

.badge.bg-secondary {
    background-color: var(--yorku-burgundy) !important;
}

/* --- Alerts ------------------------------------------- */
.alert-primary {
    --bs-alert-color:        #6e0919;
    --bs-alert-bg:           #f8d7db;
    --bs-alert-border-color: #f1b0b7;
}

/* --- York Jumbotron (Bootstrap 5 replacement) --------- */
.york-jumbotron {
    background: linear-gradient(135deg, var(--yorku-red) 0%, var(--yorku-burgundy) 100%);
    color: #ffffff;
    padding: 2.5rem 2rem;
    border-radius: 0.375rem;
    margin-bottom: 1.5rem;
}

.york-jumbotron h2,
.york-jumbotron h3 {
    color: #ffffff;
}

/* --- Page Header divider (Bootstrap 3 style) ---------- */
.page-header {
    padding-bottom: 0.35rem;
    margin: 1.1rem 0 0.65rem;
    border-bottom: 1px solid var(--yorku-border);
}

/* --- Footer ------------------------------------------- */
.york-footer {
    background-color: #f5f5f5;
    border-top: 1px solid var(--yorku-border);
    padding: 0.6rem 0;
    font-size: 0.82rem;
    color: #666;
    text-align: center;
    margin-top: 1.25rem;
}

/* --- User Menu Styles --------------------------------- */
#york-logo-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.york-auth-buttons {
    position: relative;
}

.york-user-menu {
    position: relative;
    display: inline-block;
}

.york-user-menu-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #1f2937;
    border: 1px solid #d1d5db;
    background-color: #ffffff;
    text-decoration: none;
}

.york-user-menu-toggle:hover,
.york-user-menu:hover .york-user-menu-toggle,
.york-user-menu:focus-within .york-user-menu-toggle {
    color: #111827;
    background-color: #f3f4f6;
    border-color: #9ca3af;
}

.york-user-icon-toggle {
    padding: 0.32rem 0.55rem;
    gap: 0.35rem;
}

.york-login-toggle {
    font-size: 0.92rem;
    font-weight: 600;
    padding: 0.32rem 0.7rem;
    gap: 0.35rem;
}

.york-user-icon {
    width: 1.05rem;
    height: 1.05rem;
    display: block;
}

.york-user-initials {
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.02em;
}

.york-login-icon {
    width: 1rem;
    height: 1rem;
    display: block;
    flex-shrink: 0;
}

.york-logout-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.york-logout-icon {
    width: 0.95rem;
    height: 0.95rem;
    display: block;
    flex-shrink: 0;
}

.york-user-caret,
.york-user-menu-caret {
    font-size: 0.75rem;
    line-height: 1;
}

.york-user-menu-panel {
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 11rem;
    background-color: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.15);
    padding: 0.5rem;
    z-index: 1050;
    display: none;
}

.york-user-menu:hover .york-user-menu-panel,
.york-user-menu:focus-within .york-user-menu-panel {
    display: block;
}

.york-user-menu-links {
    min-width: 13rem;
    padding: 0.35rem;
}

.york-user-menu-header {
    padding: 0.4rem 0.75rem 0.2rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: #111827;
    white-space: nowrap;
}

.york-user-menu-link {
    display: block;
    padding: 0.55rem 0.75rem;
    border-radius: 0.3rem;
    color: #1f2937;
    text-decoration: none;
    font-size: 0.95rem;
    line-height: 1.2;
}

.york-user-menu-link + .york-user-menu-link {
    margin-top: 0.2rem;
}

.york-user-menu-divider {
    margin: 0.35rem 0;
    border: 0;
    border-top: 1px solid #e5e7eb;
}

.york-user-menu-link:hover,
.york-user-menu-link:focus {
    background-color: #f3f4f6;
    color: #111827;
    text-decoration: none;
}