/* DEFAULTS */
*, *::before, *::after { box-sizing: border-box; }

body {
    font-size: 14px;
    font-family: "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
    background: #f0ece0;
    margin: 0;
    padding: 0;
    color: #2d2d2d;
    line-height: 1.5;
}

a:link, a:visited { color: #98261B; }
a:hover { color: #7a1e16; text-decoration: none; }
a:active { color: #98261B; }
p { margin-bottom: 10px; line-height: 1.65em; }

/* HEADINGS */
h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    color: #333;
    margin: 0 0 8px 0;
}
h1 { font-size: 1.5em; }
h2 { font-size: 1.3em; }
h3 { font-size: 1.1em; }

/* PRIMARY LAYOUT */
.page {
    max-width: 1300px;
    background-color: #fff;
    margin: 28px auto 0 auto;
    border-radius: 6px 6px 0 0;
    box-shadow: 0 2px 12px rgba(0,0,0,0.13);
    overflow: hidden;
    border: 1px solid #c8b89a;
}

/* HEADER */
.header {
    background: linear-gradient(135deg, #98261B 0%, #7a1e16 100%);
    padding: 0;
}

.header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px 14px 24px;
}

.header-titles h1 {
    color: #fff;
    font-size: 1.55em;
    font-weight: 700;
    letter-spacing: 0.02em;
    margin: 0;
    line-height: 1.2;
    text-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.header-titles .subtitle {
    color: rgba(255,255,255,0.78);
    font-size: 0.92em;
    font-weight: 400;
    margin-top: 2px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.loginDisplay {
    font-size: 0.88em;
    color: rgba(255,255,255,0.9);
    text-align: right;
    white-space: nowrap;
}
.loginDisplay strong { color: #fff; }
.loginDisplay a:link,
.loginDisplay a:visited,
.loginDisplay a:hover { color: #ffd9d5; text-decoration: underline; }

/* MENU */
div.menu {
    background: rgba(0,0,0,0.18);
    padding: 0 20px;
    display: flex;
    align-items: flex-end;
    min-height: 36px;
}

div.menu a, div.menu a:visited {
    display: inline-block;
    color: rgba(255,255,255,0.82);
    font-size: 0.88em;
    font-weight: 500;
    padding: 8px 16px 7px 16px;
    text-decoration: none;
    border-radius: 4px 4px 0 0;
    white-space: nowrap;
    transition: background 0.15s, color 0.15s;
    letter-spacing: 0.02em;
}

div.menu a:hover {
    background: rgba(255,255,255,0.18);
    color: #fff;
}

.menuLinkActive {
    background: #fff !important;
    color: #98261B !important;
    font-weight: 600 !important;
}

.menuLinkActive:hover {
    background: #fff !important;
    color: #98261B !important;
}

.menuLinkNotActive {
    /* inherits from div.menu a */
}

/* MAIN CONTENT */
.main {
    padding: 24px 28px;
    min-height: 420px;
}

/* FOOTER */
.footer {
    background: #f7f3eb;
    border-top: 1px solid #ddd;
    color: #666;
    padding: 14px 24px;
    text-align: center;
    font-size: 0.88em;
    margin-top: 0;
}
.footer a:link, .footer a:visited { color: #98261B; }

/* FORMS */
fieldset {
    margin: 0 0 1.5em 0;
    padding: 20px 24px;
    border: 1px solid #ddd;
    border-radius: 6px;
    max-width: 460px;
    background: #fdfcfa;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}
fieldset p { margin: 0 0 12px 0; }
fieldset.login label,
fieldset.register label,
fieldset.changePassword label { display: block; font-weight: 500; margin-bottom: 4px; color: #444; font-size: 0.9em; }
legend {
    font-size: 1.05em;
    font-weight: 700;
    padding: 0 6px;
    color: #98261B;
    letter-spacing: 0.02em;
}

input.textEntry,
input.passwordEntry,
select.textEntry {
    width: 220px;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 7px 10px;
    font-size: 0.95em;
    transition: border-color 0.15s, box-shadow 0.15s;
    background: #fff;
    color: #2d2d2d;
}
input.textEntry:focus,
input.passwordEntry:focus,
select.textEntry:focus {
    outline: none;
    border-color: #98261B;
    box-shadow: 0 0 0 3px rgba(152,38,27,0.12);
}

input[type="submit"],
button.btn,
a.btn,
.btn {
    display: inline-block;
    padding: 8px 20px;
    background: #98261B;
    color: #fff !important;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-decoration: none;
    transition: background 0.15s, box-shadow 0.15s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
input[type="submit"]:hover,
button.btn:hover,
a.btn:hover,
.btn:hover { background: #7a1e16; box-shadow: 0 2px 6px rgba(0,0,0,0.18); }

.btn-gray { background: #5a6370 !important; }
.btn-gray:hover { background: #424a52 !important; }

.btn-icon-danger { color: #c62828 !important; border-color: #e57373 !important; }
.btn-icon-danger:hover { background: #fde8e8 !important; border-color: #c62828 !important; color: #b71c1c !important; }

.btn-icon-success { color: #2e7d32 !important; border-color: #66bb6a !important; }
.btn-icon-success:hover { background: #e8f5e9 !important; border-color: #2e7d32 !important; color: #1b5e20 !important; }

.btn-icon-primary { color: #1565c0 !important; border-color: #64b5f6 !important; }
.btn-icon-primary:hover { background: #e3f2fd !important; border-color: #1565c0 !important; color: #0d47a1 !important; }

/* ALERTS / FLASH */
.flash-messages { margin: 0 0 16px 0; }
.alert { padding: 12px 16px; margin-bottom: 10px; border-radius: 4px; font-size: 0.92em; }
.alert-info { background: #d4edda; border: 1px solid #b8dbc5; color: #1a5c30; }
.alert-warning { background: #fff3cd; border: 1px solid #ffe08a; color: #7a5800; }
.alert-danger { background: #fde8e8; border: 1px solid #f5c0c0; color: #7a1616; }

/* TABLES */
.table-scroll { overflow-x: auto; }
.file-table,
.user-table,
.activity-table {
    width: 100%;
    min-width: 1100px;
    border-collapse: collapse;
    margin-top: 12px;
    font-size: 0.9em;
}
.file-table th,
.user-table th,
.activity-table th {
    background: #98261B;
    color: #fff;
    padding: 9px 8px;
    text-align: left;
    font-size: 0.88em;
    font-weight: 600;
    letter-spacing: 0.03em;
}
.file-table td,
.user-table td,
.activity-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #ece8e0;
}
.file-table tr:hover td,
.user-table tr:hover td,
.activity-table tr:hover td { background: #faf6ed; }
.file-table tbody tr:last-child td,
.user-table tbody tr:last-child td,
.activity-table tbody tr:last-child td { border-bottom: none; }

/* BREADCRUMB */
.breadcrumb { margin: 0 0 12px 0; font-size: 0.88em; color: #888; }
.breadcrumb a { color: #98261B; font-weight: 500; }

/* TOOLBAR */
.toolbar { margin: 0 0 12px 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* BADGES */
.badge-admin  { background: #98261B; color: #fff; padding: 2px 8px; border-radius: 10px; font-size: 0.78em; font-weight: 600; }
.badge-user   { background: #496077; color: #fff; padding: 2px 8px; border-radius: 10px; font-size: 0.78em; font-weight: 600; }
.badge-locked { background: #999; color: #fff; padding: 2px 8px; border-radius: 10px; font-size: 0.78em; font-weight: 600; }

/* PAGE SECTION HEADER */
.ContentHeader {
    font-size: 1.15em;
    font-weight: 700;
    color: #98261B;
    margin-bottom: 14px;
    padding-bottom: 8px;
    border-bottom: 2px solid #ece0d8;
}
.GridHeaderText { color: #98261B; font-weight: 700; font-size: 0.88em; }

/* MISC */
.clear { clear: both; }
.failureNotification { font-size: 0.95em; color: #c0392b; background: #fde8e8; border: 1px solid #f5c0c0; border-radius: 4px; padding: 8px 12px; }
.bold { font-weight: bold; }
.submitButton { text-align: right; padding-right: 4px; margin-top: 6px; }
.size-text { color: #888; font-size: 0.82em; }

/* INSTRUCTIONS */
div.instructions {
    font-family: "Segoe UI", system-ui, Arial, sans-serif;
    background-color: #fffbea;
    padding: 16px 20px;
    border: 1px solid #e8d98a;
    border-radius: 6px;
    margin-bottom: 16px;
}
.instruction-subhead {
    font-weight: 700;
    font-size: 1em;
    color: #7a5800;
    margin-bottom: 6px;
    margin-top: 14px;
}

/* UPLOAD AREA */
.upload-area { border: 2px dashed #ccc; padding: 14px; margin-top: 10px; background: #fafafa; border-radius: 6px; }
.upload-area input[type=file] { display: block; margin-bottom: 8px; }

/* REGISTRATION LAYOUT */
div.regfieldlabel { float: left; width: 150px; margin-bottom: 6px; font-weight: 500; color: #444; font-size: 0.9em; }
div.invitefieldlabel { float: left; width: 150px; margin-bottom: 6px; font-weight: 500; color: #444; font-size: 0.9em; }
div.inviteEntry { float: left; margin-bottom: 6px; }
input.inviteEntry { width: 200px; border: 1px solid #ccc; border-radius: 4px; padding: 6px 10px; }

a.hide, div.hide { display: none; }

/* RESPONSIVE */
@media (max-width: 1300px) {
    .page { max-width: 100%; margin: 0; border-radius: 0; }
    .main { padding: 16px; }
    .header-top { padding: 14px 16px 12px 16px; }
    div.menu { padding: 0 8px; }
}
@media (max-width: 600px) {
    .header-titles h1 { font-size: 1.15em; }
    fieldset { max-width: 100%; }
    input.textEntry, input.passwordEntry, select.textEntry { width: 100%; }
}