/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification for details on configuring this project to bundle and minify static web assets. */ /* Hide validation summary when there are no errors */ .validation-summary-valid { display: none; } *{ font-family: IranSansX; } a.navbar-brand { white-space: normal; text-align: center; word-break: break-all; } /* Provide sufficient contrast against white background */ a { color: var(--g-link-color); text-decoration: none; } .btn-primary { color: #fff; background-color: #1b6ec2; border-color: #1861ac; } .nav-pills .nav-link.active, .nav-pills .show > .nav-link { color: #fff; background-color: #1b6ec2; border-color: #1861ac; } /* Sticky footer styles -------------------------------------------------- */ html { font-size: 14px; } @media (min-width: 768px) { html { font-size: 16px; } } .border-top { border-top: 1px solid #e5e5e5; } .border-bottom { border-bottom: 1px solid #e5e5e5; } .box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); } button.accept-policy { font-size: 1rem; line-height: inherit; } /* Sticky footer styles -------------------------------------------------- */ html { position: relative; min-height: 100%; } body { direction: rtl; /* Margin bottom by footer height */ margin-bottom: 60px; } .footer { position: absolute; bottom: 0; width: 100%; white-space: nowrap; line-height: 60px; /* Vertically center the text there */ } /* Mehdi Custom Styles */ .ltr { direction: ltr; text-align: left; } /* ══════════════════════════════════════════════════════════════════════════ Global Dark Mode — CSS Variables Applied via [data-theme="dark"] on , or OS preference as fallback. ══════════════════════════════════════════════════════════════════════════ */ :root { --site-bg: #f0f2f7; --site-text: #1e2234; --site-text-muted: #6b7492; --site-border: #e2e6f0; --site-navbar-bg: #ffffff; --site-navbar-text: #1e2234; --site-card-bg: #ffffff; --site-input-bg: #f7f8fc; --site-input-text: #1e2234; --site-input-border: #ced4e8; --site-modal-bg: #ffffff; --site-modal-hdr-bg: #f4f5fb; --site-dropdown-bg: #ffffff; --site-accent: #5c6bc0; --site-accent-hover: #4a5898; --site-scrollbar: #ced4e8; --site-footer-bg: #f0f2f7; --site-footer-text: #6b7492; } [data-theme="dark"] { --site-bg: #0e1621; --site-text: #f5f5f5; --site-text-muted: #708499; --site-border: #232e3c; --site-navbar-bg: #17212b; --site-navbar-text: #f5f5f5; --site-card-bg: #17212b; --site-input-bg: #232e3c; --site-input-text: #f5f5f5; --site-input-border: #2b5278; --site-modal-bg: #17212b; --site-modal-hdr-bg: #0e1621; --site-dropdown-bg: #17212b; --site-accent: #71bafa; --site-accent-hover: #2b5278; --site-scrollbar: #232e3c; --site-footer-bg: #17212b; --site-footer-text: #708499; } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --site-bg: #0e1621; --site-text: #f5f5f5; --site-text-muted: #708499; --site-border: #232e3c; --site-navbar-bg: #17212b; --site-navbar-text: #f5f5f5; --site-card-bg: #17212b; --site-input-bg: #232e3c; --site-input-text: #f5f5f5; --site-input-border: #2b5278; --site-modal-bg: #17212b; --site-modal-hdr-bg: #0e1621; --site-dropdown-bg: #17212b; --site-accent: #71bafa; --site-accent-hover: #2b5278; --site-scrollbar: #232e3c; --site-footer-bg: #17212b; --site-footer-text: #708499; } } /* ── Base ─────────────────────────────────────────────────────────────────── */ body { background-color: var(--site-bg); color: var(--site-text); transition: background-color 0.2s, color 0.2s; } /* ── Navbar ──────────────────────────────────────────────────────────────── */ .site-navbar { background-color: var(--site-navbar-bg) !important; border-color: var(--site-border) !important; } .site-navbar .navbar-brand, .site-navbar .nav-link { color: var(--site-navbar-text) !important; } .site-navbar .navbar-toggler { border-color: var(--site-border); } /* Theme toggle button in the navbar */ .btn-theme-toggle { background: transparent; border: 1px solid var(--site-border); border-radius: 0.5rem; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; color: var(--site-text-muted); font-size: 0.9rem; transition: background 0.18s, color 0.18s, border-color 0.18s; padding: 0; } .btn-theme-toggle:hover { background: var(--site-border); color: var(--site-text); } /* ── Cards ───────────────────────────────────────────────────────────────── */ .card { background-color: var(--site-card-bg) !important; border-color: var(--site-border) !important; color: var(--site-text) !important; } .card-header, .card-footer { background-color: var(--site-modal-hdr-bg) !important; border-color: var(--site-border) !important; } /* ── Modals ──────────────────────────────────────────────────────────────── */ .modal-content { background-color: var(--site-modal-bg) !important; border-color: var(--site-border) !important; color: var(--site-text) !important; } .modal-header, .modal-footer { border-color: var(--site-border) !important; } .modal-header:not(.bg-danger):not(.bg-success):not(.bg-primary):not(.bg-warning) { background-color: var(--site-modal-hdr-bg); } /* Ensure close button is visible in dark modals */ .modal-header .btn-close { filter: var(--site-close-btn-filter, none); } [data-theme="dark"] .modal-header .btn-close, @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .modal-header .btn-close { filter: invert(1) grayscale(100%) brightness(200%); } } /* ── Forms ───────────────────────────────────────────────────────────────── */ .form-control, .form-select { background-color: var(--site-input-bg) !important; color: var(--site-input-text) !important; border-color: var(--site-input-border) !important; } .form-control:focus, .form-select:focus { background-color: var(--site-input-bg) !important; color: var(--site-input-text) !important; border-color: var(--site-accent) !important; box-shadow: 0 0 0 0.2rem rgba(92, 107, 192, 0.25) !important; } .form-control::placeholder { color: var(--site-text-muted) !important; } .input-group-text { background-color: var(--site-modal-hdr-bg) !important; border-color: var(--site-input-border) !important; color: var(--site-text) !important; } /* ── Tables ──────────────────────────────────────────────────────────────── */ .table { color: var(--site-text) !important; border-color: var(--site-border) !important; } .table > :not(caption) > * > * { background-color: var(--site-card-bg) !important; color: var(--site-text) !important; border-color: var(--site-border) !important; } .table-striped > tbody > tr:nth-of-type(odd) > * { --bs-table-accent-bg: var(--site-modal-hdr-bg) !important; } .table-hover > tbody > tr:hover > * { --bs-table-accent-bg: var(--site-border) !important; } /* ── Dropdowns ───────────────────────────────────────────────────────────── */ .dropdown-menu { background-color: var(--site-dropdown-bg) !important; border-color: var(--site-border) !important; } .dropdown-item { color: var(--site-text) !important; } .dropdown-item:hover, .dropdown-item:focus { background-color: var(--site-border) !important; } .dropdown-divider { border-color: var(--site-border) !important; } /* ── Borders & Text utilities ────────────────────────────────────────────── */ .border, .border-top, .border-bottom, .border-start, .border-end { border-color: var(--site-border) !important; } .text-dark { color: var(--site-text) !important; } .text-muted { color: var(--site-text-muted) !important; } /* ── List groups ─────────────────────────────────────────────────────────── */ .list-group-item { background-color: var(--site-card-bg) !important; border-color: var(--site-border) !important; color: var(--site-text) !important; } /* ── Footer ──────────────────────────────────────────────────────────────── */ .footer { background-color: var(--site-footer-bg) !important; border-color: var(--site-border) !important; color: var(--site-footer-text) !important; } /* ── Scrollbar (WebKit) ──────────────────────────────────────────────────── */ ::-webkit-scrollbar { width: 7px; height: 7px; } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: var(--site-scrollbar); border-radius: 4px; } /* ── Alerts (dark mode) ──────────────────────────────────────────────────── */ /* Override Bootstrap's per-variant alert variables so they look correct on dark backgrounds. Bootstrap 5 scopes these on each .alert-* class, so we only need to set three custom properties per variant. */ [data-theme="dark"] .alert-success { --bs-alert-bg: #061a0f; --bs-alert-border-color: #1a5c35; --bs-alert-color: #75b798; } [data-theme="dark"] .alert-danger { --bs-alert-bg: #2c0b0e; --bs-alert-border-color: #842029; --bs-alert-color: #ea868f; } [data-theme="dark"] .alert-warning { --bs-alert-bg: #2c1f02; --bs-alert-border-color: #6c4f03; --bs-alert-color: #ffda6a; } [data-theme="dark"] .alert-info { --bs-alert-bg: #032028; --bs-alert-border-color: #055160; --bs-alert-color: #6edff6; } [data-theme="dark"] .alert-primary { --bs-alert-bg: #051033; --bs-alert-border-color: #0d3498; --bs-alert-color: #6ea8fe; } [data-theme="dark"] .alert .btn-close { filter: invert(1) grayscale(100%) brightness(200%); } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .alert-success { --bs-alert-bg: #061a0f; --bs-alert-border-color: #1a5c35; --bs-alert-color: #75b798; } :root:not([data-theme="light"]) .alert-danger { --bs-alert-bg: #2c0b0e; --bs-alert-border-color: #842029; --bs-alert-color: #ea868f; } :root:not([data-theme="light"]) .alert-warning { --bs-alert-bg: #2c1f02; --bs-alert-border-color: #6c4f03; --bs-alert-color: #ffda6a; } :root:not([data-theme="light"]) .alert-info { --bs-alert-bg: #032028; --bs-alert-border-color: #055160; --bs-alert-color: #6edff6; } :root:not([data-theme="light"]) .alert-primary { --bs-alert-bg: #051033; --bs-alert-border-color: #0d3498; --bs-alert-color: #6ea8fe; } :root:not([data-theme="light"]) .alert .btn-close { filter: invert(1) grayscale(100%) brightness(200%); } }