/**
 * PARS Medicine Unified Design System
 * Consolidated from index.php inline styles
 * Version: 2.0.0
 * Date: 2026-02-09
 * 
 * This file contains all unified theme CSS previously inline in index.php.
 * It provides the canonical design tokens and component styles for the
 * Pars Medicine website across all subdomains.
 */

/* ===== PARS MEDICINE UNIFIED DESIGN SYSTEM ===== */
:root {
    /* === PARS MEDICINE UNIFIED DESIGN SYSTEM === */
    --pars-primary: #0066cc;
    --pars-secondary: #00a859;
    --pars-accent: #17a2b8;
    --pars-dark: #1a252f;
    --pars-darker: #151d25;
    --pars-medical: #c0392b;
    --pars-purple: #6f42c1;
    --pars-orange: #e65100;

    /* Legacy compatibility (matches template.css) */
    --pars-red: #c0392b;
    --pars-red-dark: #a93226;
    --pars-red-light: #e74c3c;
    --pars-blue: #0066cc;
    --pars-blue-dark: #004d99;
    --pars-blue-light: #3399ff;
    --primary-color: #0066cc;
    --secondary-color: #00a859;
    --accent-color: #17a2b8;
    --dark-color: #1a252f;
    --light-color: #f8f9fa;
    --text-color: #1f2937;
    --border-color: #e2e8f0;
    --shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

body { font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; margin: 0; background: #f4f6f9; }

/* Main Navigation */
.pars-navbar {
    background: var(--pars-dark);
    padding: 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.15);
    position: relative;
    z-index: 1040;
}
.pars-navbar .container-fluid {
    max-width: 100%;
    overflow: visible;
}
.pars-navbar .navbar-collapse {
    flex-wrap: nowrap;
    justify-content: flex-end;
}
.pars-navbar .navbar-nav {
    flex: 0 1 auto;
    margin-left: auto;
}
.pars-navbar .navbar-brand {
    color: white !important;
    font-weight: 700;
    font-size: 1.4rem;
    padding: 15px 0;
    flex-shrink: 0;
    margin-right: 20px;
}
.pars-navbar .navbar-brand .brand-pars { color: #ffffff; font-weight: 800; letter-spacing: 1px; }
.pars-navbar .navbar-brand .brand-medicine { color: var(--pars-secondary); font-weight: 600; letter-spacing: 0.5px; }

/* Mega Menu */
.pars-navbar .nav-link {
    color: rgba(255,255,255,0.9) !important;
    padding: 18px 16px !important;
    font-weight: 500;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    border-bottom: 3px solid transparent;
    transition: all 0.2s;
}
.pars-navbar .nav-link:hover,
.pars-navbar .nav-link.active {
    color: white !important;
    background: rgba(255,255,255,0.05);
    border-bottom-color: var(--pars-secondary);
}

.pars-navbar .dropdown-menu {
    border: none;
    border-radius: 0;
    box-shadow: 0 10px 40px rgba(0,0,0,0.25);
    padding: 0;
    min-width: 250px;
    margin-top: 0;
    background: #ffffff !important;
    z-index: 9999 !important;
    isolation: isolate;
}

/* Regular dropdowns need relative positioning */
.pars-navbar .nav-item.dropdown {
    position: relative;
}

/* Mega menu items need static for full-width dropdown */
.pars-navbar .nav-item.dropdown.has-mega-menu {
    position: static;
}

/* Small mega menus: relative positioning instead of static (1-2 columns) */
.pars-navbar .nav-item.dropdown.has-mega-menu.mega-cols-1,
.pars-navbar .nav-item.dropdown.has-mega-menu.mega-cols-2 {
    position: relative !important;
}

/* Column-count-based mega menu sizing */
.mega-menu.mega-cols-1 {
    width: auto;
    min-width: 240px;
    max-width: 320px;
    padding: 15px 20px;
}
.mega-menu.mega-cols-2 {
    width: auto;
    min-width: 420px;
    max-width: 560px;
    padding: 20px 25px;
}
.mega-menu.mega-cols-3 {
    width: auto;
    min-width: 560px;
    max-width: 780px;
}

/* Let columns fill naturally in small mega menus */
.mega-menu.mega-cols-1 .row > [class*="col-"],
.mega-menu.mega-cols-2 .row > [class*="col-"] {
    flex: 1 1 auto;
    max-width: none;
}

/* Right-align dropdowns for nav items near the right edge */
.pars-navbar .nav-item.has-mega-menu.mega-cols-1:nth-last-child(-n+3) > .mega-menu,
.pars-navbar .nav-item.has-mega-menu.mega-cols-2:nth-last-child(-n+3) > .mega-menu {
    left: auto;
    right: 0;
}

/* Make sure non-mega dropdowns stay within bounds */
.pars-navbar .dropdown-menu:not(.mega-menu) {
    min-width: 250px;
    max-width: 300px;
}

/* Mega Menu Panels */
.mega-menu {
    width: 100%;
    left: 0;
    padding: 25px 30px;
    background: #ffffff !important;
    position: absolute;
    z-index: 9999 !important;
    opacity: 1 !important;
    isolation: isolate;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
    box-shadow: 0 10px 40px rgba(0,0,0,0.2) !important;
}

.mega-menu * {
    background: inherit;
}

.mega-menu .row {
    background: #ffffff !important;
}
.mega-menu h6 {
    color: var(--pars-dark);
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--pars-primary);
}
.mega-menu ul { list-style: none; padding: 0; margin: 0; }
.mega-menu ul li a {
    display: block;
    padding: 6px 0;
    color: #495057;
    text-decoration: none;
    font-size: 14px;
    transition: all 0.2s;
}
.mega-menu ul li a:hover { color: var(--pars-primary); padding-left: 5px; }
.mega-menu ul li a i { margin-right: 8px; width: 16px; color: var(--pars-secondary); }

.mega-menu .row {
    display: flex;
    flex-wrap: nowrap;
    margin: 0 -15px;
    gap: 0;
}
.mega-menu .row > [class*="col-"] {
    padding: 0 15px;
    flex: 0 0 25%;
    max-width: 25%;
    overflow: visible;
}
.mega-menu .row > [class*="col-"] > h6 {
    white-space: nowrap;
    overflow: visible;
    text-overflow: ellipsis;
}
.mega-menu .row > [class*="col-"] > ul {
    max-height: none;
}
.mega-menu .row > [class*="col-"] > ul > li {
    white-space: nowrap;
    overflow: visible;
    text-overflow: ellipsis;
}
.mega-menu .row > [class*="col-"] > ul > li > a {
    white-space: nowrap;
    overflow: visible;
    text-overflow: ellipsis;
    display: block;
}

.mega-menu .featured-box {
    background: linear-gradient(135deg, var(--pars-primary), #004d99);
    color: white;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
}
.mega-menu .featured-box h5 { margin-bottom: 10px; }
.mega-menu .featured-box .btn { background: white; color: var(--pars-primary); border: none; }

/* Regular Dropdown */
.dropdown-menu .dropdown-item {
    padding: 10px 20px;
    font-size: 14px;
    border-left: 3px solid transparent;
}
.dropdown-menu .dropdown-item:hover {
    background: #f8f9fa;
    border-left-color: var(--pars-primary);
}
.dropdown-menu .dropdown-header {
    background: #f8f9fa;
    font-weight: 600;
    color: var(--pars-dark);
    padding: 10px 20px;
    font-size: 12px;
    text-transform: uppercase;
}
.dropdown-divider { margin: 0; }

/* Auth Area in Navbar */
.pars-nav-auth { display: flex; align-items: center; gap: 10px; flex-shrink: 0; margin-left: 20px; padding-right: 15px; }
.pars-nav-auth .btn-signin { background: var(--pars-secondary); color: white; border: none; padding: 8px 20px; font-size: 13px; font-weight: 600; border-radius: 4px; text-decoration: none; white-space: nowrap; transition: all 0.2s; }
.pars-nav-auth .btn-signin:hover { background: #009148; transform: translateY(-1px); }

/* User Logged In */
.user-logged-in {
    display: flex;
    align-items: center;
    gap: 8px;
    color: white;
    flex-wrap: nowrap;
    flex-shrink: 0;
}
.user-logged-in .user-name {
    font-weight: 600;
    color: #f39c12;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.user-logged-in .btn-sm { 
    font-size: 10px; 
    padding: 4px 8px; 
    white-space: nowrap;
    flex-shrink: 0;
}
.user-logged-in .btn-outline-light { border-color: rgba(255,255,255,0.7); }
.user-logged-in .btn-outline-info { background: #3498db; color: white; border: none; }
.user-logged-in .btn-outline-danger { background: #e74c3c; color: white; border: none; }

/* Main Content */
.main-content { padding: 30px 0; min-height: 60vh; position: relative; z-index: 1; }

/* Center the quick access buttons */
.pars-quick-access {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
    margin: 0 auto 40px !important;
    max-width: 800px !important;
}
.pars-hero-section + .pars-quick-access {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Ensure hero/main-top doesn't overlap menus */
.main-top, .hero-section, [class*="hero"] {
    position: relative;
    z-index: 1;
}

/* Force dropdowns above everything */
.navbar .dropdown.show .dropdown-menu,
.pars-navbar .dropdown.show .dropdown-menu {
    z-index: 9999 !important;
}

/* Footer */
.pars-footer { background: var(--pars-dark); color: #9ca3af; padding: 20px 0; font-size: 13px; }
.pars-footer a { color: #d1d5db !important; text-decoration: none; }
.pars-footer a:hover { color: #ffffff !important; text-decoration: underline; }
.pars-footer .footer-main { text-align: center; }
.pars-footer .footer-copy { margin-bottom: 6px; color: #9ca3af; }
.pars-footer .footer-links { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }
.pars-footer .footer-links .sep { color: #4b5563; }

/* Cards & Boxes */
.card { border: none; box-shadow: 0 2px 10px rgba(0,0,0,0.08); border-radius: 8px; }
.card-header { background: var(--pars-primary); color: white; font-weight: 600; }

/* Responsive */
@media (max-width: 991px) {
    .mega-menu { position: static; width: 100%; }
    .pars-navbar .nav-link { padding: 12px 15px !important; border-bottom: none; }
    .pars-nav-auth { margin-left: 0; padding: 10px 15px; }
}

@media (max-width: 768px) {
    .pars-quick-access {
        grid-template-columns: 1fr !important;
        max-width: 100% !important;
    }
    .pars-hero-section {
        padding: 20px 15px !important;
    }
}


/* === Top Utility Bar === */
.pars-topbar {
    background: var(--pars-darker);
    color: #9ca3af;
    font-size: 12px;
    padding: 4px 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}
.pars-topbar a { color: #d1d5db; text-decoration: none; }
.pars-topbar a:hover { color: #ffffff; }

/* === Banner Position === */
.pars-banner { position: relative; z-index: 1; }

/* === Unified Auth/Services Bar === */
.pars-auth-bar {
    background: linear-gradient(135deg, #0d1b2a 0%, #1b2838 50%, #0d1b2a 100%);
    border-bottom: 1px solid rgba(0,102,204,0.3);
    padding: 0;
    font-size: 13px;
    position: relative;
    z-index: 1039;
}
.auth-bar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 42px;
    gap: 16px;
}
.auth-bar-services {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
    overflow-x: auto;
}
.auth-bar-services::-webkit-scrollbar { height: 0; }
.auth-bar-services .service-link {
    color: rgba(255,255,255,0.75) !important;
    text-decoration: none !important;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    border-radius: 3px;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 5px;
}
.auth-bar-services .service-link:hover {
    color: #ffffff !important;
    background: rgba(0,102,204,0.25);
}
.auth-bar-services .service-link i {
    font-size: 11px;
    color: var(--pars-secondary);
}
.auth-bar-login {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
.auth-welcome {
    color: #f39c12;
    font-weight: 600;
    font-size: 12px;
    white-space: nowrap;
}
.auth-welcome i { color: var(--pars-secondary); margin-right: 4px; }
.auth-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 4px;
    text-decoration: none !important;
    white-space: nowrap;
    transition: all 0.2s;
    border: none;
    cursor: pointer;
}
.auth-btn-signin {
    background: var(--pars-primary);
    color: #ffffff !important;
}
.auth-btn-signin:hover { background: #0055aa; color: #fff !important; transform: translateY(-1px); }
.auth-btn-register {
    background: transparent;
    color: rgba(255,255,255,0.85) !important;
    border: 1px solid rgba(255,255,255,0.3);
}
.auth-btn-register:hover { background: rgba(255,255,255,0.1); color: #fff !important; }
.auth-btn-portal {
    background: rgba(0,168,89,0.2);
    color: var(--pars-secondary) !important;
    border: 1px solid rgba(0,168,89,0.4);
}
.auth-btn-portal:hover { background: var(--pars-secondary); color: #fff !important; }
.auth-btn-logout {
    background: rgba(231,76,60,0.15);
    color: #e74c3c !important;
    border: 1px solid rgba(231,76,60,0.3);
    font-family: inherit;
}
.auth-btn-logout:hover { background: #e74c3c; color: #fff !important; }

@media (max-width: 991px) {
    .auth-bar-inner { flex-direction: column; padding: 6px 0; gap: 4px; }
    .auth-bar-services { width: 100%; justify-content: flex-start; padding: 0 4px; }
    .auth-bar-login { width: 100%; justify-content: center; }
}
@media (max-width: 768px) {
    .auth-bar-services .service-link { padding: 6px 8px; font-size: 11px; }
}

/* === HOMEPAGE FIXES === */

    /* HIDE article info on homepage - AGGRESSIVE targeting */
.article-info,
dl.article-info,
.article-info-term,
dd.createdby,
dd.category-name,
dd.create,
dd.published,
.com-content-article dl.article-info {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Center the 4 quick access buttons */
.pars-quick-access {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center !important;
    gap: 20px;
    margin: 0 auto 30px !important;
    max-width: 700px;
}
.pars-quick-access a {
    flex: 0 0 auto;
    min-width: 150px;
}
    /* Text Contrast Fixes */
body, .main-content { color: #1f2937; }
.text-muted { color: #4b5563 !important; }
p, li { color: #374151; }
h1, h2, h3, h4, h5, h6 { color: #111827; }

/* ==================== TEXT CONTRAST & READABILITY FIXES ==================== */
/* Added: 2026-01-26 - Fix blue background text contrast and hover states */

/* Blue background sections - ensure white text with good contrast */
[style*="background: #0066cc"],
[style*="background:#0066cc"],
[style*="background: linear-gradient"][style*="#0066cc"],
[style*="background: #1e3a8a"],
[style*="background:#1e3a8a"],
[style*="background: linear-gradient"][style*="#1e3a8a"],
[style*="background: #004d99"],
[style*="background:#004d99"],
.bg-primary,
.bg-dark,
[class*="bg-blue"],
[style*="background: #0066cc"],
[style*="background:#0066cc"] {
    color: #ffffff !important;
}

[style*="background: #0066cc"] *,
[style*="background:#0066cc"] *,
[style*="background: #1e3a8a"] *,
[style*="background:#1e3a8a"] *,
[style*="background: #004d99"] *,
[style*="background:#004d99"] *,
.bg-primary *,
.bg-dark * {
    color: #ffffff !important;
}

/* Fix text on dark/blue gradient backgrounds */
[style*="linear-gradient"][style*="#1e3a8a"] h1,
[style*="linear-gradient"][style*="#1e3a8a"] h2,
[style*="linear-gradient"][style*="#1e3a8a"] p,
[style*="linear-gradient"][style*="#0066cc"] h1,
[style*="linear-gradient"][style*="#0066cc"] h2,
[style*="linear-gradient"][style*="#0066cc"] p {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

/* Links on blue backgrounds - use light colors with good hover contrast */
[style*="background: #0066cc"] a,
[style*="background:#0066cc"] a,
[style*="background: #1e3a8a"] a,
[style*="background:#1e3a8a"] a,
.bg-primary a,
.bg-dark a {
    color: #93c5fd !important; /* Light blue - 4.5:1+ contrast ratio */
    text-decoration: underline;
}

[style*="background: #0066cc"] a:hover,
[style*="background:#0066cc"] a:hover,
[style*="background: #1e3a8a"] a:hover,
[style*="background:#1e3a8a"] a:hover,
.bg-primary a:hover,
.bg-dark a:hover {
    color: #ffffff !important;
    text-decoration: none;
}

/* Buttons on blue backgrounds - high contrast */
[style*="background: #0066cc"] .btn,
[style*="background:#0066cc"] .btn,
[style*="background: #1e3a8a"] .btn,
[style*="background:#1e3a8a"] .btn {
    background: #ffffff !important;
    color: #0066cc !important;
    border: 2px solid #ffffff !important;
    font-weight: 600;
}

[style*="background: #0066cc"] .btn:hover,
[style*="background:#0066cc"] .btn:hover,
[style*="background: #1e3a8a"] .btn:hover,
[style*="background:#1e3a8a"] .btn:hover {
    background: #f0f9ff !important;
    color: #004d99 !important;
    transform: translateY(-2px);
}

/* Fix hover states for navigation links */
.pars-navbar .nav-link:hover,
.pars-navbar .nav-link:focus {
    color: #ffffff !important;
    background: rgba(255,255,255,0.15) !important;
}

/* Fix dropdown menu hover - ensure readable */
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
    background-color: #e2e8f0 !important;
    color: #0066cc !important;
}

/* Mega menu links - ensure proper contrast */
.mega-menu ul li a {
    color: #374151 !important;
}

.mega-menu ul li a:hover {
    color: #0066cc !important;
    background-color: #f0f9ff;
}

/* Card header text on colored backgrounds */
.card-header {
    color: #ffffff !important;
}

.card-header * {
    color: #ffffff !important;
}

/* Fix sidebar card text on blue gradient backgrounds */
.card[style*="linear-gradient"] *,
.card[style*="background: #1a365d"] * {
    color: #ffffff !important;
}

.card[style*="linear-gradient"] .card-title,
.card[style*="linear-gradient"] h5,
.card[style*="background: #1a365d"] h5 {
    color: #ffffff !important;
}

.card[style*="linear-gradient"] .card-text,
.card[style*="linear-gradient"] p,
.card[style*="background: #1a365d"] p {
    color: #e2e8f0 !important;
}

.card[style*="linear-gradient"] a,
.card[style*="background: #1a365d"] a {
    color: #fbbf24 !important; /* Gold/amber for visibility */
}

.card[style*="linear-gradient"] a:hover,
.card[style*="background: #1a365d"] a:hover {
    color: #fef3c7 !important;
    text-decoration: underline;
}

/* Quick access buttons - ensure text is visible */
.pars-quick-access a,
[class*="quick-access"] a {
    color: #ffffff !important;
    font-weight: 600;
}

.pars-quick-access a:hover,
[class*="quick-access"] a:hover {
    opacity: 0.9;
    transform: translateY(-2px);
}



/* Alert and info boxes - ensure proper contrast */
.alert a,
.info-box a {
    color: inherit;
    font-weight: 600;
    text-decoration: underline;
}



/* Ensure table headers are readable */
.table thead th,
table thead th {
    color: #ffffff !important;
}

/* Fix form labels in dark sections */
[style*="background: #0066cc"] label,
[style*="background:#0066cc"] label,
[style*="background: #1e3a8a"] label,
[style*="background:#1e3a8a"] label {
    color: #ffffff !important;
    font-weight: 500;
}

/* Breadcrumb contrast fix */
.breadcrumb-item a {
    color: #0066cc !important;
}

.breadcrumb-item a:hover {
    color: #c0392b !important;
    text-decoration: underline;
}

.breadcrumb-item.active {
    color: #4b5563 !important;
}

/* Badge text contrast */
.badge {
    font-weight: 600;
}

.badge.bg-primary,
.badge.bg-secondary,
.badge.bg-success,
.badge.bg-danger,
.badge.bg-warning,
.badge.bg-info,
.badge.bg-dark {
    color: #ffffff !important;
}

.badge.bg-warning {
    color: #1f2937 !important; /* Dark text on yellow background */
}

.badge.bg-light {
    color: #1f2937 !important;
}

/* Pagination link contrast */
.pagination .page-link {
    color: #0066cc !important;
}

.pagination .page-item.active .page-link {
    color: #ffffff !important;
    background-color: #0066cc !important;
}

.pagination .page-link:hover {
    color: #004d99 !important;
    background-color: #e2e8f0 !important;
}

/* AI Chatbot text fixes */
.pars-ai-chatbot .bot-message .message-content {
    color: #1f2937 !important;
}

.pars-ai-chatbot .user-message .message-content {
    color: #ffffff !important;
}

/* WCAG AA minimum contrast for body text (4.5:1 ratio) */
.main-content p,
.main-content li,
.com-content-article__body p,
.com-content-article__body li {
    color: #374151 !important; /* Ensures 7:1+ contrast on white */
}

/* Muted text should still be readable */
.text-muted,
small,
.small {
    color: #6b7280 !important; /* 4.6:1 contrast ratio */
}

/* Link default styles - ensure visible */
a:not(.btn):not(.nav-link):not([class*="dropdown"]) {
    color: #0066cc;
    text-decoration: underline;
}

a:not(.btn):not(.nav-link):not([class*="dropdown"]):hover {
    color: #c0392b;
}

/* Fix hero/banner section text */
.pars-hero-section h1,
.pars-hero-section h2,
.pars-hero-section p,
.hero-section h1,
.hero-section h2,
.hero-section p,
[class*="hero"] h1,
[class*="hero"] h2,
[class*="hero"] p {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
