/* Font Imports */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap');

/* Font Variables */
:root {
    --font-heading: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-body: 'Century Gothic', 'CenturyGothic', AppleGothic, sans-serif;
}

/* Base Typography */
body {
    font-family: var(--font-body);
    font-weight: 400;
    line-height: 1.6;
    color: #374151;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 600;
    line-height: 1.3;
    color: #111827;
}

h1 {
    font-size: 2.5rem;
    font-weight: 700;
}

h2 {
    font-size: 2rem;
    font-weight: 700;
}

h3 {
    font-size: 1.5rem;
    font-weight: 600;
}

h4 {
    font-size: 1.25rem;
    font-weight: 600;
}

h5 {
    font-size: 1.125rem;
    font-weight: 600;
}

h6 {
    font-size: 1rem;
    font-weight: 600;
}

/* Navigation and UI Elements */
.navbar, .sidebar, header {
    font-family: var(--font-heading);
    font-weight: 500;
}

.navbar a, .sidebar a {
    font-family: var(--font-heading);
    font-weight: 500;
}

/* Buttons */
button, .btn, input[type="submit"], input[type="button"] {
    font-family: var(--font-heading);
    font-weight: 500;
}

/* Forms */
input, textarea, select {
    font-family: var(--font-body);
    font-weight: 400;
}

input::placeholder, textarea::placeholder {
    font-family: var(--font-body);
    opacity: 0.7;
}

/* Links */
a {
    font-family: var(--font-body);
    font-weight: 400;
}

/* Special text elements */
.text-heading {
    font-family: var(--font-heading);
    font-weight: 600;
}

.text-body {
    font-family: var(--font-body);
    font-weight: 400;
}

/* Admin specific styles */
.admin-card h3,
.admin-card h4,
.admin-panel h2,
.admin-panel h3 {
    font-family: var(--font-heading);
    font-weight: 600;
}

.admin-card p,
.admin-card div,
.admin-panel p,
.admin-panel div {
    font-family: var(--font-body);
    font-weight: 400;
}

/* Table headers */
th {
    font-family: var(--font-heading);
    font-weight: 600;
}

/* Table cells */
td {
    font-family: var(--font-body);
    font-weight: 400;
}

/* Modal headers */
.modal-header, .modal-title {
    font-family: var(--font-heading);
    font-weight: 600;
}

/* Modal content */
.modal-body, .modal-content {
    font-family: var(--font-body);
    font-weight: 400;
}

/* Form labels */
label {
    font-family: var(--font-heading);
    font-weight: 500;
}

/* Status badges */
.badge, .status-badge {
    font-family: var(--font-heading);
    font-weight: 500;
}

/* Footer */
footer {
    font-family: var(--font-body);
    font-weight: 400;
}

/* Logo text */
.logo-text {
    font-family: var(--font-heading);
    font-weight: 700;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.375rem; }
    h4 { font-size: 1.125rem; }
    h5 { font-size: 1rem; }
}

/* Fallback for Century Gothic */
@font-face {
    font-family: 'Century Gothic';
    src: local('Century Gothic'), local('CenturyGothic'), local('AppleGothic');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Century Gothic';
    src: local('Century Gothic Bold'), local('CenturyGothic Bold');
    font-weight: 700;
    font-style: normal;
}
