/* ===== RESET & BASE ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: #f4f1ee; color: #2d2d2d; }

/* ===== NAV ===== */
nav {
    background: #3a1a2e;
    color: white;
    padding: 0 2rem;
    display: flex;
    align-items: center;
    gap: 2rem;
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
.nav-brand { font-size: 1.3rem; font-weight: 700; white-space: nowrap; padding: 1rem 0; }
nav ul { list-style: none; display: flex; gap: 0; }
nav ul li { position: relative; }
nav ul li a {
    display: block;
    padding: 1rem 1.1rem;
    color: #e8d5c4;
    text-decoration: none;
    font-size: 0.9rem;
    transition: background 0.2s;
}
nav ul li a:hover { background: #5a2a4e; color: white; }
.dropdown ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #3a1a2e;
    min-width: 180px;
    flex-direction: column;
    border-top: 2px solid #c9856e;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}
.dropdown:hover ul { display: flex; }
.dropdown ul li a { padding: 0.7rem 1.1rem; font-size: 0.85rem; }

/* ===== CONTAINER ===== */
.container { max-width: 1100px; margin: 2rem auto; padding: 0 1.5rem; }

/* ===== HEADINGS ===== */
h1 { font-size: 1.8rem; margin-bottom: 1.2rem; color: #3a1a2e; border-left: 4px solid #c9856e; padding-left: 0.8rem; }
h2 { font-size: 1.3rem; margin-bottom: 1rem; color: #5a2a4e; }

/* ===== CARDS (dashboard) ===== */
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1.2rem; margin-top: 1.5rem; }
.card {
    background: white;
    border-radius: 10px;
    padding: 1.5rem;
    text-align: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    text-decoration: none;
    color: #2d2d2d;
    border-bottom: 3px solid #c9856e;
    transition: transform 0.2s, box-shadow 0.2s;
}
.card:hover { transform: translateY(-3px); box-shadow: 0 6px 16px rgba(0,0,0,0.12); }
.card .icon { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }
.card .label { font-weight: 600; font-size: 0.95rem; }

/* ===== TABLES ===== */
.table-wrap { overflow-x: auto; margin-top: 1rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(0,0,0,0.08); }
table { width: 100%; border-collapse: collapse; background: white; }
th { background: #3a1a2e; color: white; padding: 0.8rem 1rem; text-align: left; font-size: 0.85rem; letter-spacing: 0.03em; }
td { padding: 0.75rem 1rem; border-bottom: 1px solid #ece8e4; font-size: 0.9rem; }
tr:last-child td { border-bottom: none; }
tr:nth-child(even) td { background: #faf8f6; }
tr:hover td { background: #f0e8e0; }

/* ===== FORMS ===== */
.form-card { background: white; border-radius: 10px; padding: 2rem; box-shadow: 0 2px 6px rgba(0,0,0,0.08); max-width: 600px; }
.form-group { margin-bottom: 1.2rem; }
.form-group label { display: block; font-weight: 600; margin-bottom: 0.35rem; font-size: 0.9rem; color: #5a2a4e; }
.form-group input, .form-group select, .form-group textarea {
    width: 100%;
    padding: 0.6rem 0.9rem;
    border: 1px solid #d0c8c0;
    border-radius: 6px;
    font-size: 0.95rem;
    transition: border-color 0.2s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
    outline: none;
    border-color: #c9856e;
    box-shadow: 0 0 0 3px rgba(201,133,110,0.15);
}

/* ===== BUTTONS ===== */
.btn { display: inline-block; padding: 0.6rem 1.3rem; border-radius: 6px; font-size: 0.9rem; font-weight: 600; text-decoration: none; border: none; cursor: pointer; transition: background 0.2s, transform 0.1s; }
.btn:active { transform: scale(0.97); }
.btn-primary { background: #3a1a2e; color: white; }
.btn-primary:hover { background: #5a2a4e; }
.btn-success { background: #2e7d32; color: white; }
.btn-success:hover { background: #388e3c; }
.btn-warning { background: #e65100; color: white; font-size: 0.8rem; padding: 0.35rem 0.8rem; }
.btn-warning:hover { background: #bf360c; }
.btn-danger { background: #b71c1c; color: white; font-size: 0.8rem; padding: 0.35rem 0.8rem; }
.btn-danger:hover { background: #7f0000; }
.btn-sm { font-size: 0.78rem; padding: 0.3rem 0.65rem; }

/* ===== ALERTS ===== */
.alert { padding: 0.9rem 1.2rem; border-radius: 6px; margin-bottom: 1.2rem; font-size: 0.9rem; }
.alert-success { background: #e8f5e9; color: #2e7d32; border-left: 4px solid #2e7d32; }
.alert-error { background: #ffebee; color: #b71c1c; border-left: 4px solid #b71c1c; }

/* ===== PAGE HEADER ROW ===== */
.page-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; }

/* ===== REPORT STYLES ===== */
.report-meta { background: white; border-radius: 8px; padding: 1rem 1.5rem; margin-bottom: 1.5rem; border-left: 4px solid #c9856e; font-size: 0.9rem; color: #555; }
.report-meta strong { color: #3a1a2e; }

/* ===== FOOTER ===== */
footer { background: #3a1a2e; color: #a08090; text-align: center; padding: 1rem; font-size: 0.8rem; margin-top: 3rem; }

/* ===== HERO (dashboard) ===== */
.hero { background: linear-gradient(135deg, #3a1a2e, #5a2a4e); color: white; border-radius: 12px; padding: 2.5rem 2rem; margin-bottom: 2rem; }
.hero h2 { color: #f0d8c8; border: none; font-size: 1.6rem; }
.hero p { color: #c8b0b8; margin-top: 0.5rem; }

.stats-row { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 2rem; }
.stat-box { background: white; border-radius: 8px; padding: 1rem 1.5rem; box-shadow: 0 2px 6px rgba(0,0,0,0.08); flex: 1; min-width: 120px; text-align: center; }
.stat-box .num { font-size: 2rem; font-weight: 700; color: #3a1a2e; }
.stat-box .lbl { font-size: 0.8rem; color: #888; }

.action-cell { display: flex; gap: 0.4rem; }

.empty-state { text-align: center; padding: 3rem; color: #999; }
.empty-state .icon { font-size: 3rem; }

.filter-bar { background: white; padding: 1rem 1.5rem; border-radius: 8px; margin-bottom: 1.2rem; display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.filter-bar .form-group { margin-bottom: 0; flex: 1; min-width: 150px; }
