/* Maxims Admin - Site Styles */

/* ========== Design Tokens ========== */
:root {
    --parchment: #f5f0e8;
    --parchment-deep: #ede5d8;
    --parchment-dark: #e2d9c8;
    --ink: #2c2416;
    --ink-light: #5a4d3a;
    --ink-faded: #8a7d6b;
    --ink-ghost: #b8ad9c;
    --accent: #8b3a3a;
    --accent-light: #a85454;
    --gold: #c4a265;
    --divider: #d4c9b5;
    --shadow: rgba(44, 36, 22, 0.08);
}

/* ========== Parchment Texture ========== */
body {
    font-family: 'Crimson Pro', Georgia, serif;
    background: var(--parchment);
    color: var(--ink);
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
}

body::before {
    content: '';
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    pointer-events: none; z-index: 0;
    background-image:
        radial-gradient(ellipse at 20% 50%, rgba(139,58,58,0.015) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 20%, rgba(196,162,101,0.02) 0%, transparent 50%),
        radial-gradient(ellipse at 50% 80%, rgba(90,77,58,0.015) 0%, transparent 50%);
}

body::after {
    content: '';
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    pointer-events: none; z-index: 1; opacity: 0.3;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
}

.content-wrapper {
    position: relative;
    z-index: 2;
}

/* ========== Typography ========== */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    color: var(--ink);
}

code, .badge, .text-muted small {
    font-family: 'JetBrains Mono', monospace;
}

/* ========== Navbar ========== */
.navbar {
    background: var(--parchment) !important;
    border-bottom: 1px solid var(--divider);
    position: relative;
    z-index: 2;
}

.navbar-brand {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-weight: 300;
    font-size: 1.25rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--ink) !important;
}

.logo-dot {
    color: var(--accent);
}

.navbar .nav-link {
    font-family: 'Crimson Pro', Georgia, serif;
    font-size: 0.85rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ink-faded) !important;
    transition: color 0.3s ease;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus {
    color: var(--accent) !important;
}

.navbar .nav-link.active {
    color: var(--ink) !important;
    font-weight: 600;
}

.navbar-toggler {
    border-color: var(--divider);
}

.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(90,77,58,0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ========== Cards ========== */
.card {
    background: var(--parchment);
    border: 1px solid var(--divider);
    box-shadow: 0 2px 8px var(--shadow);
    color: var(--ink);
}

.card-header {
    background: var(--parchment-deep);
    border-bottom: 1px solid var(--divider);
    color: var(--ink);
}

/* ========== Tables ========== */
.table {
    color: var(--ink);
    --bs-table-bg: transparent;
    --bs-table-hover-bg: var(--parchment-deep);
    --bs-table-striped-bg: var(--parchment-deep);
    border-color: var(--divider);
}

.table th {
    font-family: 'Crimson Pro', Georgia, serif;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-size: 0.8rem;
    color: var(--ink-faded);
    border-bottom-color: var(--divider);
}

.table td {
    border-bottom-color: var(--divider);
    vertical-align: middle;
}

/* Highlight fade — warm tone instead of Bootstrap table-success */
.table-success,
.highlight-fade {
    --bs-table-bg: var(--parchment-dark) !important;
    --bs-table-hover-bg: var(--parchment-dark) !important;
    background-color: var(--parchment-dark) !important;
}

.highlight-fade {
    transition: background-color 1.5s ease-out;
}

/* ========== Form Controls ========== */
.form-control,
.form-select {
    background-color: var(--parchment);
    border-color: var(--divider);
    color: var(--ink);
    font-family: 'Crimson Pro', Georgia, serif;
}

.form-control:focus,
.form-select:focus {
    background-color: var(--parchment);
    border-color: var(--accent);
    color: var(--ink);
    box-shadow: 0 0 0 0.2rem rgba(139, 58, 58, 0.15);
}

.form-control::placeholder {
    color: var(--ink-ghost);
}

.form-label {
    font-family: 'Crimson Pro', Georgia, serif;
    font-weight: 500;
    color: var(--ink-light);
}

.form-check-input:checked {
    background-color: var(--accent);
    border-color: var(--accent);
}

/* ========== Buttons ========== */
.btn {
    font-family: 'Crimson Pro', Georgia, serif;
    font-weight: 500;
    letter-spacing: 0.04em;
}

.btn-primary {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--parchment);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--accent-light);
    border-color: var(--accent-light);
    color: var(--parchment);
}

.btn-primary:active {
    background-color: #7a3232 !important;
    border-color: #7a3232 !important;
}

.btn-outline-primary {
    color: var(--accent);
    border-color: var(--accent);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--parchment);
}

.btn-outline-secondary {
    color: var(--ink-faded);
    border-color: var(--ink-faded);
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
    background-color: var(--ink-faded);
    border-color: var(--ink-faded);
    color: var(--parchment);
}

.btn-danger {
    background-color: var(--accent);
    border-color: var(--accent);
}

.btn-outline-danger {
    color: var(--accent);
    border-color: var(--accent);
}

.btn-outline-danger:hover {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--parchment);
}

/* ========== Badges ========== */
.badge.bg-secondary {
    background-color: var(--ink-faded) !important;
}

.badge.bg-success {
    background-color: #6b8a5e !important;
}

.badge.bg-warning {
    background-color: var(--gold) !important;
    color: var(--ink) !important;
}

.badge.bg-danger {
    background-color: var(--accent) !important;
}

.badge.bg-primary {
    background-color: var(--accent) !important;
}

/* ========== Dropdowns ========== */
.dropdown-menu {
    background-color: var(--parchment);
    border: 1px solid var(--divider);
    box-shadow: 0 4px 12px var(--shadow);
}

.dropdown-item {
    color: var(--ink);
    font-family: 'Crimson Pro', Georgia, serif;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--parchment-deep);
    color: var(--accent);
}

/* ========== Overlay Spinner ========== */
.overlay-spinner {
    color: var(--ink-faded);
}

/* ========== Drag Handle ========== */
.drag-handle {
    cursor: grab;
}

.drag-handle:active {
    cursor: grabbing;
}

/* ========== Reference Items ========== */
.reference-item {
    background: var(--parchment-deep);
}

/* ========== Alerts ========== */
.alert-success {
    background-color: #e8ede5;
    border-color: #c8d4c0;
    color: var(--ink);
}

.alert-danger {
    background-color: #ede5e5;
    border-color: #d4c0c0;
    color: var(--ink);
}

.alert-warning {
    background-color: #ede9e0;
    border-color: #d4cbb8;
    color: var(--ink);
}

/* ========== Misc ========== */
a {
    color: var(--accent);
}

a:hover {
    color: var(--accent-light);
}

.text-muted {
    color: var(--ink-faded) !important;
}

.border-bottom {
    border-bottom-color: var(--divider) !important;
}

/* Login page card */
.login-card {
    background: var(--parchment);
    border: 1px solid var(--divider);
    box-shadow: 0 4px 16px var(--shadow);
}

.login-card h1 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-weight: 300;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}
