/* Custom styles for Invoice & Quote Management System */

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* Hidden forms for CSRF protection */
.d-none {
    display: none !important;
}

.footer {
    margin-top: auto;
}

/* Improve navbar contrast */
.navbar-dark {
    background-color: #121212 !important; /* Darker background for navbar */
}

.navbar-dark .navbar-nav .nav-link {
    color: #ffffff !important; /* White text for better visibility */
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); /* Add shadow for better contrast */
}

.navbar-dark .navbar-nav .nav-link:hover {
    color: #f8f9fa !important;
    background-color: rgba(255, 255, 255, 0.1);
}

.dropdown-menu {
    background-color: #2a2a2a !important; /* Darker dropdown menu background */
    border-color: #444;
}

.dropdown-item {
    color: #f8f9fa !important; /* Light text for dropdown items */
}

.dropdown-item:hover, .dropdown-item:focus {
    background-color: #444 !important;
    color: #ffffff !important;
}

/* Page header styling */
.page-header {
    padding-bottom: 1rem;
    margin-bottom: 2rem;
    border-bottom: 1px solid var(--bs-border-color);
    background-color: #1a1a1a; /* Darker background for better contrast */
    padding: 1.5rem;
    border-radius: 0.25rem;
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.2);
}

/* Quote/Invoice Number Styling */
.page-header h2 {
    color: #ffffff !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
    font-weight: bold;
    font-size: 1.75rem;
    letter-spacing: 0.02em;
    margin-bottom: 0.5rem !important;
}

/* Date text styling */
.page-header p {
    color: #ffffff !important;
    opacity: 0.9;
}

/* Button text styling in header */
.page-header .btn span {
    color: #ffffff !important;
    font-weight: bold;
}

/* Card styling */
.card {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.1);
    margin-bottom: 1.5rem;
}

.card-header {
    background-color: rgba(0, 0, 0, 0.03);
    border-radius: 10px;
}

/* User interface */
.badge.bg-primary {
    background-color: var(--business-color-primary) !important;
    color: #000;
}

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

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

.text-accent {
    color: var(--business-color-accent) !important;
}

.btn-primary {
    background-color: var(--business-color-primary);
    border-color: var(--business-color-primary);
    color: #000;
}

.btn-primary:hover {
    background-color: color-mix(in srgb, var(--business-color-primary) 90%, black);
    border-color: color-mix(in srgb, var(--business-color-primary) 90%, black);
    color: #000;
}

a {
    color: var(--business-color-accent);
}

a:hover {
    color: color-mix(in srgb, var(--business-color-accent) 80%, white);
}

/* Status colors */
.status-paid {
    color: #00bc8c;
}

.status-partially-paid {
    color: #f39c12;
}

.status-unpaid {
    color: #e74c3c;
}

/* Form enhancements */
.form-control, .form-select {
    border-color: var(--bs-border-color);
}

/* Improve contrast in dark mode */
.modal-content, .dropdown-menu {
    background-color: var(--bs-dark) !important;
    border-color: var(--bs-border-color) !important;
    color: #ffffff !important;
}

.dropdown-item {
    color: #ffffff !important;
}

.dropdown-item:hover, .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

/* Item rows in quotes/invoices */
.item-row {
    background-color: rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;
    padding: 1rem;
    margin-bottom: 0.5rem;
}

/* Logo in admin panel */
.settings-logo {
    max-height: 100px;
    max-width: 100%;
    display: block;
    margin-bottom: 1rem;
}

/* Color pickers in settings */
.color-preview {
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    margin-right: 0.5rem;
    border: 1px solid var(--bs-border-color);
    vertical-align: middle;
}

/* Enhanced Dashboard Styling */
.dashboard-card {
    transition: all 0.3s ease;
    border-radius: 0.5rem;
    overflow: hidden;
}

.dashboard-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}

.dashboard-icon {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    opacity: 0.8;
}

/* Quick Actions Cards */
.card.border-primary {
    border-color: rgba(13, 110, 253, 0.25) !important;
}

.card.border-success {
    border-color: rgba(25, 135, 84, 0.25) !important;
}

.card.border-info {
    border-color: rgba(13, 202, 240, 0.25) !important;
}

.card.border-warning {
    border-color: rgba(255, 193, 7, 0.25) !important;
}

.card.border-danger {
    border-color: rgba(220, 53, 69, 0.25) !important;
}

/* Dashboard Welcome Banner */
.bg-primary.bg-gradient {
    background-image: linear-gradient(145deg, var(--bs-primary), var(--bs-primary-rgb, #0d6efd) 70%, #0b5ed7) !important;
}

/* Dashboard Tables */
.table-hover tbody tr:hover {
    background-color: rgba(var(--bs-primary-rgb, 13, 110, 253), 0.05);
}

.fw-medium {
    font-weight: 500;
}

/* Enhanced Cards with border-0 */
.card.border-0 {
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.075);
    transition: box-shadow 0.3s ease;
}

.card.border-0:hover {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
}

/* Dashboard Status Icons */
.rounded-circle.bg-success,
.rounded-circle.bg-warning,
.rounded-circle.bg-danger,
.rounded-circle.bg-primary,
.rounded-circle.bg-info {
    width: 3.5rem;
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Make summary section text more visible */
.p-3.rounded {
    transition: transform 0.2s ease;
}

.p-3.rounded:hover {
    transform: translateY(-3px);
}

/* Make sure all modal content has good contrast */
.modal-body {
    color: var(--bs-body-color);
}

/* Ensure text inputs have good contrast in dark mode */
.form-control, .form-select {
    background-color: var(--bs-dark);
    color: var(--bs-light);
}

.form-control:focus, .form-select:focus {
    background-color: var(--bs-dark);
    color: var(--bs-light);
}

/* Enhanced navigation menu for better visibility */
.navbar-dark .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.9);
    padding: 0.5rem 0.8rem;
    margin: 0 0.1rem;
    border-radius: 4px;
    transition: background-color 0.2s ease-in-out;
}

.navbar-dark .navbar-nav .nav-link:hover, 
.navbar-dark .navbar-nav .nav-link:focus {
    color: #ffffff;
    background-color: rgba(255, 255, 255, 0.15);
}

.navbar-dark .navbar-nav .active > .nav-link,
.navbar-dark .navbar-nav .nav-link.active {
    background-color: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

/* Login page styling */
.login-page .navbar-nav {
    display: none !important;
}

.login-page .navbar-brand {
    margin: 0 auto;
}

body.login-page {
    background-color: var(--bs-dark);
}

.login-page .navbar-toggler {
    display: none;
}

.login-page .card {
    border: none;
    border-radius: 10px;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    overflow: hidden;
}

.login-page .card-header {
    background-color: var(--business-color-primary, var(--bs-primary));
    padding: 1.25rem;
    border-bottom: none;
}

.login-page .card-body {
    padding: 2rem;
}

.login-page .form-control {
    border-radius: 5px;
    padding: 0.75rem 1rem;
    min-height: 3rem;
}

.login-page .input-group-text {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.1);
}

.login-page .btn {
    padding: 0.75rem 1.5rem;
    font-weight: 600;
    border-radius: 5px;
}

.login-page .btn-primary {
    background-color: var(--business-color-primary, #0d6efd);
    border-color: var(--business-color-primary, #0d6efd);
    color: #ffffff;
}

.login-page .btn-primary:hover {
    background-color: var(--business-color-accent, #0a58ca);
    border-color: var(--business-color-accent, #0a58ca);
}

.login-page .footer {
    background-color: transparent !important;
}

.login-page .card-footer {
    background-color: rgba(0, 0, 0, 0.02);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding: 1rem;
}