/* ===================================================
   AGGRESSIVE STYLE OVERRIDES - TEXT COLOR & CONTRAST
   This file overrides app.css and style.css to ensure
   proper contrast in dark and light modes
   ==================================================== */

/* ===================================================
   UNIVERSAL TEXT COLOR ENFORCEMENT
   ==================================================== */

* {
    color: var(--text-primary) !important;
}

html,
body {
    background-color: var(--bg-primary) !important;
    color: var(--text-primary) !important;
}

/* Override all text elements */
p, span, div, a, label, h1, h2, h3, h4, h5, h6 {
    color: var(--text-primary) !important;
}

a {
    color: var(--color-info) !important;
}

a:visited {
    color: #a78bfa !important;
}

a:hover {
    color: var(--color-primary) !important;
}

/* ===================================================
   TABLE STYLING - DARK MODE DEFAULT
   ==================================================== */

table {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

table thead {
    background-color: var(--bg-tertiary) !important;
}

table thead th {
    color: var(--text-primary) !important;
    background-color: var(--bg-tertiary) !important;
    border-color: var(--border-color) !important;
}

table tbody tr {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

table tbody td {
    color: var(--text-primary) !important;
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
}

table tbody tr:hover {
    background-color: var(--bg-tertiary) !important;
}

/* Striped tables */
.table-striped tbody tr:nth-child(odd) {
    background-color: var(--bg-secondary) !important;
}

.table-striped tbody tr:nth-child(even) {
    background-color: var(--bg-tertiary) !important;
}

/* ===================================================
   FORM ELEMENTS - INPUT & SELECT
   ==================================================== */

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="tel"],
input[type="url"],
input[type="search"],
textarea,
select {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
}

input::placeholder,
textarea::placeholder {
    color: var(--text-muted) !important;
}

input:focus,
input:active,
textarea:focus,
textarea:active,
select:focus,
select:active {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
    border-color: var(--color-accent) !important;
}

input:disabled,
textarea:disabled,
select:disabled {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-muted) !important;
    opacity: 0.6 !important;
}

/* ===================================================
   BUTTONS & CONTROLS
   ==================================================== */

button,
.btn,
input[type="button"],
input[type="submit"],
input[type="reset"],
.button {
    color: var(--text-primary) !important;
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

button:hover,
.btn:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
    background-color: var(--color-accent) !important;
    border-color: var(--color-accent) !important;
}

button:active,
.btn:active {
    opacity: 0.8 !important;
}

button:disabled,
.btn:disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* Theme toggle button specific */
#theme-toggle-btn {
    background: rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    padding: 0.5rem 0.8rem !important;
    border-radius: 15px !important;
    cursor: pointer !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
    white-space: nowrap !important;
    z-index: 1000 !important;
}

#theme-toggle-btn:hover {
    background: rgba(255, 255, 255, 0.3) !important;
}

#theme-toggle-btn i {
    font-size: 0.9rem !important;
    color: white !important;
}

/* ===================================================
   CARDS & PANELS
   ==================================================== */

.card,
.panel,
.box,
.content-box,
.card-body,
.panel-body {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

.card-header,
.panel-header,
.panel-title {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* ===================================================
   ALERTS & NOTIFICATIONS
   ==================================================== */

.alert,
.alert-box,
.notification {
    color: var(--text-primary) !important;
}

.alert-success,
.alert-info,
.alert-warning,
.alert-danger,
.alert-error {
    color: var(--text-primary) !important;
}

.alert-success {
    background-color: rgba(74, 170, 90, 0.2) !important;
    border-color: var(--color-success) !important;
}

.alert-danger,
.alert-error {
    background-color: rgba(224, 75, 75, 0.2) !important;
    border-color: var(--color-error) !important;
}

.alert-warning {
    background-color: rgba(246, 166, 35, 0.2) !important;
    border-color: var(--color-warning) !important;
}

.alert-info {
    background-color: rgba(58, 143, 217, 0.2) !important;
    border-color: var(--color-info) !important;
}

/* ===================================================
   BADGES & LABELS
   ==================================================== */

.badge,
.label,
.tag {
    background-color: var(--color-primary) !important;
    color: var(--text-primary) !important;
}

.badge-success {
    background-color: var(--color-success) !important;
}

.badge-danger,
.badge-error {
    background-color: var(--color-error) !important;
}

.badge-warning {
    background-color: var(--color-warning) !important;
}

.badge-info {
    background-color: var(--color-info) !important;
}

/* ===================================================
   MODALS & DROPDOWNS
   ==================================================== */

.modal,
.modal-content,
.modal-body,
.modal-header,
.modal-footer,
.dropdown-menu {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

.modal-header {
    background-color: var(--bg-tertiary) !important;
}

.dropdown-menu a,
.dropdown-menu button {
    color: var(--text-primary) !important;
}

.dropdown-menu a:hover,
.dropdown-menu button:hover {
    background-color: var(--bg-tertiary) !important;
}

/* ===================================================
   NAVIGATION & HEADERS
   ==================================================== */

nav,
.navbar,
.nav,
header {
    background: linear-gradient(135deg, var(--color-brown) 0%, var(--color-primary) 100%) !important;
    color: white !important;
}

nav a,
.navbar a,
.nav a,
header a {
    color: white !important;
}

nav a:hover,
.navbar a:hover,
.nav a:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

.user-info {
    color: white !important;
}

/* ===================================================
   CODE & PRE-FORMATTED TEXT
   ==================================================== */

code,
pre,
.code {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}

/* ===================================================
   TITLES & HEADINGS
   ==================================================== */

.page-title,
.section-title,
.content-title {
    color: var(--text-primary) !important;
}

/* ===================================================
   REMOVE WHITE BACKGROUNDS
   ==================================================== */

.white-bg,
[style*="background: white"],
[style*="background-color: white"],
[style*="background:#fff"],
[style*="background-color:#fff"],
[style*="background: #fff"],
[style*="background-color: #fff"],
[style*="background: #ffffff"],
[style*="background-color: #ffffff"] {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

/* ===================================================
   LIGHT MODE ADJUSTMENTS
   ==================================================== */

[data-theme="light"] *,
html[theme="light"] *,
body.light-theme * {
    color: var(--text-primary) !important;
}

[data-theme="light"] .alert,
html[theme="light"] .alert,
body.light-theme .alert {
    color: var(--text-primary) !important;
}

[data-theme="light"] .card,
html[theme="light"] .card,
body.light-theme .card {
    background-color: var(--bg-secondary) !important;
}

[data-theme="light"] input,
[data-theme="light"] textarea,
[data-theme="light"] select,
html[theme="light"] input,
html[theme="light"] textarea,
html[theme="light"] select {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

[data-theme="light"] button,
[data-theme="light"] .btn,
html[theme="light"] button,
html[theme="light"] .btn {
    color: var(--text-primary) !important;
}

[data-theme="light"] table tbody tr,
html[theme="light"] table tbody tr {
    background-color: var(--bg-secondary) !important;
}

[data-theme="light"] table tbody td,
html[theme="light"] table tbody td {
    color: var(--text-primary) !important;
}
.reservation-card,
.room-card,
.booking-card,
.modal-content,
.reminder-popup,
.selected-room-item {
    background-color: var(--bg-secondary) !important;
    background-image: none !important;
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}

/* Override table styles */
table {
    background-color: var(--bg-secondary) !important;
    background-image: none !important;
}

table thead,
table thead th {
    background: linear-gradient(135deg, var(--color-brown) 0%, var(--color-primary) 100%) !important;
    color: white !important;
}

table tbody tr {
    background-color: transparent !important;
}

table tbody tr:hover {
    background-color: var(--bg-accent) !important;
}

table td,
table th {
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}

/* Override all forms and inputs */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="datetime-local"],
input[type="tel"],
input[type="search"],
input[type="file"],
select,
textarea,
.form-control {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

input::placeholder,
textarea::placeholder,
.form-control::placeholder {
    color: var(--text-muted) !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="datetime-local"]:focus,
input[type="tel"]:focus,
input[type="search"]:focus,
input[type="file"]:focus,
select:focus,
textarea:focus,
.form-control:focus {
    border-color: var(--color-accent) !important;
    box-shadow: 0 0 0 3px rgba(107, 170, 90, 0.15) !important;
}

/* Override all text styles */
p, span, div, li, a, label {
    color: var(--text-secondary) !important;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--text-primary) !important;
}

/* Override buttons */
button,
.btn,
[role="button"] {
    color: white !important;
}

/* Override modals and overlays */
.modal,
.overlay,
.backdrop {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

/* Override dropdowns and selects */
.dropdown-menu,
.select-dropdown {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}

.dropdown-menu li,
.dropdown-menu a {
    color: var(--text-secondary) !important;
}

.dropdown-menu li:hover,
.dropdown-menu a:hover {
    background-color: var(--bg-accent) !important;
    color: var(--text-primary) !important;
}

/* Override tooltips */
.tooltip,
.tooltiptext {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
    border: 1px solid var(--border-color) !important;
}

/* Override any divs with problematic backgrounds */
div[style*="background"],
div[style*="bg"] {
    background-color: var(--bg-secondary) !important;
}

/* Override any sections with white backgrounds */
section[style*="background: white"],
section[style*="background: #fff"],
section[style*="background: #ffffff"] {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
}

/* Override blockquotes */
blockquote {
    background-color: var(--bg-accent) !important;
    color: var(--text-secondary) !important;
    border-left: 4px solid var(--color-accent) !important;
}

/* Override pre and code */
pre,
code {
    background-color: var(--bg-accent) !important;
    color: var(--text-secondary) !important;
    border: 1px solid var(--border-color) !important;
}

/* Override lists */
ul, ol {
    color: var(--text-secondary) !important;
}

/* Override images backgrounds */
img {
    background-color: transparent !important;
}

/* Override any generic container with white bg */
.container-white,
.white-container,
.content-white,
.white-content {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
}

/* Override any panels with white backgrounds */
.panel,
.panel-body,
.panel-default,
.well {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}

/* Override any tabs or similar UI */
.tabs,
.tab-pane,
.tab-content {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
}

/* Override any sidebar */
.sidebar,
.aside {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
}

/* Override any footer */
footer {
    background: linear-gradient(135deg, var(--color-brown) 0%, var(--color-primary) 100%) !important;
    color: white !important;
}

/* Override badges and labels */
.badge,
.label,
.tag {
    color: var(--text-secondary) !important;
}

/* Override alerts */
.alert {
    color: var(--text-secondary) !important;
}

/* Override any list groups */
.list-group,
.list-group-item {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}

.list-group-item:hover {
    background-color: var(--bg-accent) !important;
}

/* Override pagination */
.pagination,
.pager {
    background-color: var(--bg-secondary) !important;
}

.pagination li a,
.pager a {
    color: var(--text-secondary) !important;
    background-color: var(--bg-tertiary) !important;
}

.pagination li a:hover,
.pager a:hover,
.pagination li.active a,
.pager .active a {
    background-color: var(--color-accent) !important;
    color: white !important;
}

/* Override breadcrumbs */
.breadcrumb {
    background-color: var(--bg-secondary) !important;
}

.breadcrumb li,
.breadcrumb a {
    color: var(--text-secondary) !important;
}

/* Override jumbotron */
.jumbotron {
    background-color: var(--bg-accent) !important;
    color: var(--text-secondary) !important;
}

/* Override progress bars */
.progress {
    background-color: var(--bg-accent) !important;
}

.progress-bar {
    background: linear-gradient(135deg, var(--color-success) 0%, #2d8659 100%) !important;
}

/* Override any floating/fixed elements */
.floating,
.fixed {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
}

/* Ensure proper contrast on all text elements */
* {
    color: inherit;
}

/* Media queries for responsive overrides */
@media screen and (max-width: 768px) {
    .card,
    .guest-card,
    .modal-content {
        padding: 1.5rem !important;
    }
}

@media print {
    body,
    .card,
    table {
        background-color: white !important;
        color: black !important;
    }
}