/**
 * YourMD Patient Portal - Shared Compact Layout
 * Include on all patient pages for consistent Apple/Epic-style design
 * Overrides Bootstrap bloat with tight, professional EHR styling
 */

/* Reset */
body {
    background: #f5f5f7 !important;
    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', sans-serif !important;
    color: #1d1d1f;
    font-size: 14px;
    line-height: 1.4;
}

/* Page containers */
.records-container, .messages-page, .prescriptions-page,
.billing-page, .documents-page, .appointments-page,
.health-tracker-page, .telehealth-page {
    padding: 70px 16px 20px !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* Override gradient headers */
.records-header, .page-header-custom, .prescriptions-header,
.billing-header, .documents-header, .appointments-header {
    background: #1d1d1f !important;
    color: #fff !important;
    padding: 14px 18px !important;
    border-radius: 10px !important;
    margin-bottom: 14px !important;
}

.records-header h1, .records-header h2,
.page-header-custom h1, .page-header-custom h2,
.prescriptions-header h1, .billing-header h1 {
    font-size: 17px !important;
    font-weight: 600 !important;
    margin: 0 !important;
    color: #fff !important;
}

.records-header p, .page-header-custom p {
    font-size: 12px !important;
    color: #a1a1a6 !important;
    margin: 2px 0 0 !important;
}

/* Cards */
.record-card, .dashboard-card, .card-custom,
.message-card, .prescription-card, .invoice-card {
    background: #fff !important;
    border: 1px solid #d2d2d7 !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    margin-bottom: 10px !important;
    box-shadow: none !important;
}

.record-card:hover, .dashboard-card:hover {
    border-color: #0071e3 !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Card headers */
.card-header-custom, .record-card-header {
    display: flex !important;
    align-items: center !important;
    padding-bottom: 8px !important;
    margin-bottom: 8px !important;
    border-bottom: 1px solid #f0f0f0 !important;
}

.card-header-custom h3, .record-card-header h3 {
    font-size: 13px !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

/* Icons */
.card-icon, .record-icon {
    width: 28px !important;
    height: 28px !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: 8px !important;
    background: #f5f5f7 !important;
    color: #0071e3 !important;
    font-size: 13px !important;
}

/* Tabs/Nav */
.nav-tabs .nav-link {
    font-size: 12px !important;
    padding: 6px 14px !important;
    color: #86868b !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
}

.nav-tabs .nav-link.active {
    color: #0071e3 !important;
    border-bottom-color: #0071e3 !important;
    background: none !important;
    font-weight: 500 !important;
}

/* Buttons */
.btn-primary, .btn-success {
    background: #0071e3 !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 7px 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.btn-outline-primary, .btn-outline-success {
    border: 1px solid #d2d2d7 !important;
    color: #0071e3 !important;
    border-radius: 8px !important;
    padding: 6px 14px !important;
    font-size: 12px !important;
    background: none !important;
}

.btn-sm {
    padding: 4px 10px !important;
    font-size: 11px !important;
    border-radius: 6px !important;
}

/* Tables */
.table {
    font-size: 13px !important;
}

.table th {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #86868b !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    padding: 8px 10px !important;
    border-bottom: 1px solid #d2d2d7 !important;
    background: #f9f9fb !important;
}

.table td {
    padding: 8px 10px !important;
    border-bottom: 1px solid #f5f5f7 !important;
    vertical-align: middle !important;
}

/* Badges */
.badge {
    font-size: 10px !important;
    font-weight: 500 !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
}

/* Form controls */
.form-control, .form-select {
    border: 1px solid #d2d2d7 !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-size: 13px !important;
}

.form-control:focus, .form-select:focus {
    border-color: #0071e3 !important;
    box-shadow: 0 0 0 2px rgba(0,113,227,0.1) !important;
}

.form-label {
    font-size: 12px !important;
    font-weight: 500 !important;
    margin-bottom: 4px !important;
}

/* Alerts */
.alert {
    border-radius: 8px !important;
    padding: 10px 14px !important;
    font-size: 13px !important;
    border: none !important;
}

/* Remove shadows everywhere */
.shadow, .shadow-sm, .shadow-lg, [class*="shadow"] {
    box-shadow: none !important;
}

/* Compact spacing */
.mb-4 { margin-bottom: 12px !important; }
.mb-3 { margin-bottom: 10px !important; }
.p-4 { padding: 14px !important; }
.p-5 { padding: 16px !important; }
.py-4 { padding-top: 12px !important; padding-bottom: 12px !important; }

/* Empty states */
.text-center.py-4, .text-center.py-5 {
    padding: 20px !important;
    color: #86868b;
    font-size: 13px;
}

/* Override green theme to blue */
.text-success { color: #0071e3 !important; }
.bg-success { background: #0071e3 !important; }
.border-success { border-color: #0071e3 !important; }
.btn-success { background: #0071e3 !important; border-color: #0071e3 !important; }
.btn-outline-success { color: #0071e3 !important; border-color: #d2d2d7 !important; background: none !important; }
.btn-outline-success:hover { background: rgba(0,113,227,0.05) !important; border-color: #0071e3 !important; }

/* Override green gradients */
[style*="linear-gradient"][style*="10b981"],
[style*="linear-gradient"][style*="059669"] {
    background: #1d1d1f !important;
}

/* Force compact footer on portal pages */
.yourmd-footer {
    background: #f5f5f7 !important;
    padding: 10px 20px !important;
    border-top: 1px solid #d2d2d7 !important;
}
.yourmd-footer .footer-inner { padding: 0 !important; }
.yourmd-footer .footer-directory { display: none !important; }
.yourmd-footer .footer-divider { display: none !important; }
.yourmd-footer .footer-legal-links { display: none !important; }
.yourmd-footer .footer-copyright { font-size: 11px !important; }
.yourmd-footer .footer-copyright p { margin: 0 !important; }

/* Override old header green gradients */
.welcome-header, .telehealth-header, .page-header,
[class*="header"][style*="gradient"] {
    background: #1d1d1f !important;
    color: #fff !important;
    padding: 14px 18px !important;
    border-radius: 10px !important;
}

/* Tighter action cards for quick links */
.action-card, .quick-action {
    padding: 10px 8px !important;
    font-size: 12px !important;
    min-height: auto !important;
    border-radius: 8px !important;
}
.action-card i, .quick-action i {
    font-size: 16px !important;
    margin-bottom: 4px !important;
}
.action-card h5, .action-card h6 {
    font-size: 11px !important;
    margin: 0 !important;
}

/* Compact list items */
.list-group-item {
    padding: 8px 12px !important;
    font-size: 13px !important;
    border-color: #f0f0f0 !important;
}

/* Tighter modals */
.modal-header { padding: 12px 16px !important; }
.modal-body { padding: 14px 16px !important; }
.modal-footer { padding: 10px 16px !important; }