/* Windows 98 Retro Theme - visual skin only
   Applies beveled borders, classic system colors, and MS Sans Serif-like font.
   This stylesheet intentionally avoids changing sizes, spacing or layout.
*/
html, body {
    font-family: "MS Sans Serif", Tahoma, "Courier New", Arial, sans-serif !important;
    background: #C0C0C0 !important;
    color: #000 !important;
}

/* Reset modern visual flourishes */
* { border-radius: 0 !important; box-shadow: none !important; }

/* Window / Panel look */
.container, .login, .panel, .card, .summary-section, .load-more-section {
    background: #E0E0E0 !important;
    border: 2px solid #fff !important;
    border-right-color: #808080 !important;
    border-bottom-color: #808080 !important;
}

/* Header / Title bar */
header, .header {
    background: #000080 !important;
    color: #fff !important;
}

.header h2, header h1, .header h1, .header h2 {
    color: #fff !important;
    font-weight: normal !important;
}

/* Buttons: raised / pressed 3D effect */
button, input[type="button"], input[type="submit"], .btn, .control-btn {
    background: linear-gradient(#E0E0E0,#C0C0C0) !important;
    color: #000 !important;
    border: 2px solid #fff !important;
    border-right-color: #808080 !important;
    border-bottom-color: #808080 !important;
    padding: 6px 10px !important; /* reduced padding for compact buttons */
    font-size: 0.9rem !important; /* slightly smaller text for buttons */
    line-height: 1 !important;
    min-height: 28px !important;
    min-width: 56px !important;
    cursor: pointer !important;
}

button:active, .btn:active, .control-btn:active, input[type="submit"]:active {
    border: 2px solid #808080 !important;
    border-right-color: #fff !important;
    border-bottom-color: #fff !important;
    padding-top: 5px !important; /* small visual shift when pressed */
}

/* Inputs: inset look */
/* Inputs: classic inset look with pale-blue interior and beveled edge */
input, textarea, select {
    background: #eaf3ff !important; /* subtle pale-blue interior seen in Win98 dialogs */
    color: #000 !important;
    border: 2px solid #808080 !important; /* outer edge */
    padding: 6px 8px !important; /* keep compact while readable */
    line-height: 1.2 !important;
    box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #c0c0c0 !important; /* inset bevel */
    outline: none !important;
    background-clip: padding-box !important;
}

/* Prevent inputs from overflowing their container by using border-box sizing */
input, textarea, select {
    box-sizing: border-box !important;
    max-width: 100% !important;
}

input:focus, textarea:focus, select:focus {
    box-shadow: inset 1px 1px 0 #ffffff, inset -1px -1px 0 #c0c0c0 !important;
    outline: 2px dashed #000080 !important;
}

/* Login-specific inputs look slightly taller for the centered form in the login view */
.login input[type="text"], .login input[type="password"], .login textarea {
    padding: 10px 10px !important;
    font-size: 1rem !important;
}

/* Ensure login inputs respect container width and don't overflow */
.login input[type="text"], .login input[type="password"], .login textarea {
    width: 100% !important;
}

/* Ensure inputs do not get rounded corners */
input, textarea, select { border-radius: 0 !important; }

/* Checkboxes & radios - pixel style */
input[type="checkbox"], input[type="radio"] {
    width: 14px; height: 14px; margin: 0 6px 0 0; vertical-align: middle;
    appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important;
    border: 2px solid #808080; background: #fff; display: inline-block;
}
input[type="checkbox"]::after {
    content: ""; display:block; width:8px; height:8px; margin:2px; background: #000; opacity:0; }
input[type="checkbox"]:checked::after { opacity:1; }
input[type="radio"] { border-radius: 50%; }
input[type="radio"]::after { content: ""; display:block; width:6px; height:6px; margin:3px; background:#000; border-radius:50%; opacity:0; }
input[type="radio"]:checked::after { opacity:1; }

/* Dropdown arrow - keep square */
select { padding-right: 20px !important; }

/* Tables - classic list view */
table { border-collapse: separate !important; border-spacing: 0 !important; background: #fff !important; color: #000 !important; }
thead th { background: #E0E0E0 !important; color: #000 !important; border-bottom: 2px solid #808080 !important; }
th, td { border-bottom: 1px solid #d0d0d0 !important; color: #000 !important; }

/* Improve link contrast inside tables and summaries */
a { color: #00008B !important; }
a:visited { color: #40006b !important; }

/* Ensure message text is high contrast */
.message-text, .mono, .small, .summary-content, td, th { color: #000 !important; }

/* Slightly increase font-weight in list/table cells for readability */
td, th { font-weight: 500 !important; }

/* Modal and dialogs - window-like borders */
.modal, .dialog, .modal-backdrop { background: transparent !important; }
.modal .modal-content, .dialog .dialog-content { border: 2px solid #fff !important; border-right-color: #808080 !important; border-bottom-color: #808080 !important; background: #E0E0E0 !important; }

/* Misc tweaks to remove modern colors */
.btn-primary, .btn-secondary, .control-btn { background: linear-gradient(#E0E0E0,#C0C0C0) !important; color: #000 !important; }
.summary-section, .load-more-section { background: #E0E0E0 !important; }

/* Ensure no rounded corners anywhere */
*:not(input):not(textarea):not(select) { border-radius: 0 !important; }

/* System divider look */
.divider { border-top: 2px solid #fff; border-bottom: 1px solid #808080; height:0; }

/* Keep accessibility: high contrast focus outlines */
:focus { outline: 2px dashed #000080 !important; }

/* Preserve layout: do not change margins/paddings set by layout */
/* End of Win98 skin */

/* --- Contrast tweaks: make body/content text pure black for readability --- */
body { color: #000 !important; }

/* Target common content areas (but avoid changing dark title bars already set) */
.container, .container .summary-content, .container .summary-meta, .container .meta-item,
.container .message-text, .container td, .container th, .container p, .container li,
.container span, .container label, .container .mono, .container .small,
.calendar-day, .weekday, .month-year {
    color: #000 !important;
}

/* Improve weight for readability */
.container td, .container th, .container .message-text, .container .summary-content {
    font-weight: 500 !important;
}

/* Links: dark and distinct, but still clearly link-colored */
a { color: #00008B !important; text-decoration: underline !important; }
a:visited { color: #40006b !important; }

/* Ensure header/title bars keep their white text on dark backgrounds */
header, .header { color: #fff !important; }
header a, .header a { color: #fff !important; }

