/* Remove default margins/padding, prevent body scroll */ html, body { margin: 0; padding: 0; width: 100%; height: 100%; overflow: hidden; /* <--- This ensures no permanent scrollbar on the entire window */ } /*@font-face { font-family: 'MyFont'; src: url('../WebFonts/fa-brands-400.woff2') format('woff2'), url('../WebFonts/fa-duotone-900.woff') format('woff'), url('../WebFonts/fa-light-300.woff') format('woff'), url('../WebFonts/fa-solid-900.woff') format('woff'), url('../WebFonts/nextgen-icons.woff') format('woff'), url('../WebFonts/summernote.woff') format('woff'); font-weight: normal; font-style: normal; }*/ /* Temporarily disable transitions on initial load if needed */ .no-transition * { transition: none !important; } /* Pinned sidebar: from top=60px to bottom=50px, left=0 */ .sidebar { position: fixed; top: 60px; /* below the pinned header */ bottom: 50px; /* above the pinned footer */ left: 0; width: 260px; overflow-y: auto; background-color: #f8f9fa; transition: width 0.3s ease; z-index: 1020; } /* Collapsed sidebar => 60px */ .sidebar.collapsed { width: 60px; } /* If we set data-sidebar-collapsed on , collapse on initial load */ [data-sidebar-collapsed="true"] #sidebar { width: 60px; } /* Circle resizing, smoothly */ .sidebar-header .bg-secondary { transition: width 0.3s ease, height 0.3s ease; } .sidebar.collapsed .sidebar-header .bg-secondary { width: 30px !important; height: 30px !important; } [data-sidebar-collapsed="true"] #sidebar .sidebar-header .bg-secondary { width: 25px !important; height: 25px !important; } /* Hide .link-text and center icons in collapsed mode */ .sidebar.collapsed .link-text { display: none; } .sidebar.collapsed .nav-link { justify-content: center; } [data-sidebar-collapsed="true"] #sidebar .link-text { display: none; } [data-sidebar-collapsed="true"] #sidebar .nav-link { justify-content: center; } /* --- Sidebar collapsed text hide (reinforced) --- */ .sidebar.collapsed .link-text, [data-sidebar-collapsed="true"] #sidebar .link-text { display: none !important; width: 0 !important; overflow: hidden !important; } /* Fallback: hide any span inside nav-link except chevron when collapsed */ .sidebar.collapsed .nav-link span:not(.submenu-caret) { display: none !important; } [data-sidebar-collapsed="true"] #sidebar .nav-link span:not(.submenu-caret) { display: none !important; } /* Center icons reliably when collapsed */ .sidebar.collapsed .nav-link i:first-child, [data-sidebar-collapsed="true"] #sidebar .nav-link i:first-child { margin-right: 0 !important; } /* Rotate the chevron when submenu is shown */ .nav-link[aria-expanded="true"] .bi-chevron-down { transform: rotate(180deg); transition: transform 0.2s ease; } /* MAIN CONTENT: pinned from top=60px to bottom=50px, left=260px to right=0 */ #mainContent { position: fixed; top: 60px; /*below header */ bottom: 50px; /* above footer */ left: 260px; /*to the right of the expanded sidebar */ right: 0; overflow-y: auto; /* scroll only if content is taller than this region */ overflow-x: hidden; /*avoid horizontal scroll */ padding: 16px; transition: left 0.3s ease; /*smooth shift when sidebar collapses */ } /* When sidebar is collapsed, shift main content left to 60px */ .sidebar.collapsed ~ #mainContent { left: 60px; } /* Also handle initial load if data-sidebar-collapsed is set */ [data-sidebar-collapsed="true"] #mainContent { left: 60px; } /* On smaller screens (under 992px), the pinned sidebar is hidden (d-none d-lg-flex), so remove left offset for main content. */ @media (max-width: 991.98px) { #mainContent { left: 0 !important; } } /* Example styling for nav links, spacing, etc. */ .nav-link { display: flex; align-items: center; font-size: 14px; padding: 8px 12px; color: #333; /* text color */ } hr.mx-3 { margin-left: 12px !important; margin-right: 12px !important; } /*.nav-link.active { background-color: #007bff; color: #fff; border-radius: 4px; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.2);*/ /* subtle inner shadow */ /*}*/ .nav-link.active { background-color: #e0e0e0; color: #000000; font-weight: 600; /* make active link bold */ border-radius: 4px; } .nav-link.active i { color: inherit; /* icon matches text color */ } .nav-link:hover { background-color: #f0f0f0; /* light hover effect */ color: #333; /* text color on hover */ } .fade-page { opacity: 0; /* Start invisible */ transition: opacity 0.01s ease-in-out; /* Fade over 0.3s */ } .fade-page.loaded { opacity: 1; /* Fully visible */ } .grecaptcha-badge { visibility: hidden; opacity: 0; transition: visibility 0s, opacity 0.5s linear; } #recaptchaBadgeContainer .grecaptcha-badge, #recaptchaBadgeContainerForgotPassword .grecaptcha-badge, #recaptchaBadgeContainerLoginPage .grecaptcha-badge, #recaptchaBadgeContainerRegisterPage .grecaptcha-badge { visibility: visible; opacity: 1; transition: visibility 0s, opacity 0.5s linear; } #recaptchaBadgeContainer { text-align: center; margin-top: 10px; } #recaptchaBadgeContainerLoginPage { text-align: center; margin-top: 10px; } #recaptchaBadgeContainerForgotPassword { text-align: center; margin-top: 10px; } .nav-item.expanded > .toggle-submenu .submenu-caret { transform: rotate(180deg); } table.dataTable tbody tr td { color: #556378; /* Default text color for table */ } table.dataTable tbody tr.selected > * { box-shadow: inset 0 0 0 9999px rgb(127, 146, 176) !important; /* color: #333;*/ background-color: #fff; } table.dataTable tbody tr.selected td > a { background-color: #556378; border-color: #e4e9f0; } table.dataTable tbody tr.selected td > a:hover { background-color: #556378; border-color: #242a33; } table.dataTable tbody tr.selected td .btn { color: #fff !important; background-color: rgb(127, 146, 176); } table.dataTable tbody tr td .btn:hover { color: #e4e9f0 !important; } /*.selectAll { color: rgb(127, 146, 176); }*/ input.selectAll[type="checkbox"] { /* sets both the box border/fill and the check-mark color */ accent-color: #556378 !important; } .dt-paging-button .page-link { background-color: white !important; color: #000; border-color: #556378; border-radius: 0.5rem !important;; } /* give each button in the DataTables buttons container some right-margin */ .dt-buttons .btn { margin-right: 0.5rem; margin-bottom: 0.5rem; border-radius: 0.5rem !important; } /* don’t add margin after the last one */ .dt-buttons .btn:last-child { margin-right: 0; margin-bottom: 0.5rem; border-radius: 0.5rem !important; } .btn-group { margin-right: 0.5rem; border-radius: 0.5rem !important; } /* Option 1 submenu show/hide */ .submenu { display: none; } .submenu.show { display: flex; flex-direction: column; } .flag-img { width: 21px; height: 21px; margin: 0 10px 0 0; } .status-dropdown { } .status-dropdown:hover{ border: 1px solid; } /* Modal: use Bootstrap defaults; only set stacking order if needed */ .modal { z-index: 1055; } .modal-backdrop { z-index: 1050; } /*Adjust the Select2 dropdown's z-index if necessary*/ .select2-container--open.select2-container--above .select2-dropdown--above, .select2-container--open.select2-container--below .select2-dropdown--below { z-index: 10500; } /*Override Select2's default dropdown z-index*/ .select2-container .select2-dropdown { z-index: 10500 !important; } /* give each button in the DataTables buttons container some right-margin */ .dt-buttons .btn { margin-right: 0.5rem; margin-bottom: 0.5rem; border-radius: 0.5rem !important; } /* don’t add margin after the last one */ .dt-buttons .btn:last-child { margin-right: 0; margin-bottom: 0.5rem; border-radius: 0.5rem !important; } .btn-group { margin-right: 0.5rem; border-radius: 0.5rem !important; } .floating-dove { position: fixed; right: 0; /* Pin to the right side */ top: 50%; /* Center vertically */ transform: translateY(-50%); /* Adjust for centering */ padding: 10px; background-color: #f8f9fa; /* Optional background color */ border-radius: 10px 0 0 10px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); z-index: 1000; /* Ensure it stays on top of other elements */ } @media (max-width: 575.98px) { #invoiceItemsTable tfoot th { display: block; width: 100%; text-align: right; border: none; position: relative; /* so ::before can be positioned */ padding-left: 50%; /* leave room for label */ } #invoiceItemsTable tfoot th::before { content: attr(data-label); position: absolute; left: 1rem; width: calc(50% - 1rem); text-align: left; font-weight: 600; } #invoiceItemsTable thead { display: none; } #invoiceItemsTable, #invoiceItemsTable tbody, #invoiceItemsTable tr, #invoiceItemsTable td { display: block; width: 100%; } #invoiceItemsTable tr { margin-bottom: 1rem; border: 1px solid #dee2e6; border-radius: 0.25rem; padding: 0.5rem; } #invoiceItemsTable td { text-align: right; padding-left: 50%; position: relative; border: none; } #invoiceItemsTable td::before { content: attr(data-label); position: absolute; left: 1rem; width: calc(50% - 1rem); text-align: left; font-weight: 600; } /* Footer adjustments if needed */ #invoiceItemsTable tfoot, #invoiceItemsTable tfoot tr, #invoiceItemsTable tfoot th { display: block; width: 100%; text-align: right; border: none; } } @media (max-width: 575.98px) { /* Undo the padding and ::before for our mobile-actions-row */ #invoiceItemsTable tr.mobile-actions-row td { padding-left: 0; /* let content start at the very left */ } #invoiceItemsTable tr.mobile-actions-row td::before { content: none; /* don’t inject “Actions:” label */ } } @media (min-width: 991.98px) { #DiscountFields { display: flex; flex-direction: row; width: 30%; } } .btn-status-draft { background-color: #adb5bd; color: #fff; border: 1px solid #adb5bd; } .btn-status-draft:hover { background-color: #fff !important; color: #343a40 !important; border: 1px solid #adb5bd; } .btn-status-sent { background-color: #0d6efd; color: #fff; border: 1px solid #0d6efd; } .btn-status-sent:hover { background-color: #fff; color: #0d6efd; border: 1px solid #0d6efd; } .btn-status-unpaid { background-color: #ffc107; color: #212529; border: 1px solid #ffc107; } .btn-status-unpaid:hover { background-color: #fff; color: #ffc107; border: 1px solid #ffc107; } .btn-status-paid { background-color: #198754; color: #fff; border: 1px solid #198754; } .btn-status-paid:hover { background-color: #fff; color: #198754; border: 1px solid #198754; } .btn-status-overdue { background-color: #dc3545; color: #fff; border: 1px solid #dc3545; } .btn-status-overdue:hover { background-color: #fff; color: #dc3545; border: 1px solid #dc3545; } .btn-status-cancelled { background-color: #6c757d; color: #fff; border: 1px solid #6c757d; text-decoration: line-through; } .btn-status-cancelled:hover { background-color: #fff; color: #6c757d; border: 1px solid #6c757d; } .btn-status-refunded { background-color: #6610f2; color: #fff; border: 1px solid #6610f2; } .btn-status-refunded:hover { background-color: #fff; color: #6610f2; border: 1px solid #6610f2; } .btn-status-writeoff { background-color: #343a40; color: #fff; border: 1px solid #343a40; font-style: italic; } .btn-status-writeoff:hover { background-color: #fff; color: #343a40; border: 1px solid #343a40; } .btn-status-partial { background-color: #fd7e14; color: #fff; border: 1px solid #fd7e14; } .btn-status-partial:hover { background-color: #fff; color: #fd7e14; border: 1px solid #fd7e14; } .btn-status-issued { background-color: #0dcaf0; color: #212529; border: 1px solid #0dcaf0; } .btn-status-issued:hover { background-color: #fff; color: #0dcaf0; border: 1px solid #0dcaf0; } .btn-status-overpaid { background-color: #20c997; color: #fff; border: 1px solid #20c997; } .btn-status-overpaid:hover { background-color: #fff; color: #20c997; border: 1px solid #20c997; } .btn-status-inactive { background-color: #ffc107; color: #212529; border: 1px solid #ffc107; } .btn-status-inactive:hover { background-color: #fff; color: #343a40; border: 1px solid #343a40; } .btn-status-active { background-color: #198754; color: #fff; border: 1px solid #198754; } table.dataTable tbody tr td .btn.btn-status:hover { background-color: #fff; color: #343a40 !important; border: 1px solid #343a40; } .btn-status-archived { background-color: #0d6efd; color: #fff; border: 1px solid #0d6efd; } .btn-status-archived:hover { background-color: #fff; color: #343a40; border: 1px solid #343a40; } .btn-payment { background-color: #198754; color: #fff; border: 1px solid #6c757d; } .btn-payment:hover { background-color: #fff; color: #6c757d; border: 1px solid #6c757d; } .bg-danger-1 { --bs-bg-opacity: 1; background-color: #dc3545 !important; } /* Hide submenus entirely when sidebar is collapsed */ .sidebar.collapsed .submenu, [data-sidebar-collapsed="true"] #sidebar .submenu { display: none !important; } /* Prevent caret rotation and center icon when collapsed */ .sidebar.collapsed .toggle-submenu .submenu-caret, [data-sidebar-collapsed="true"] #sidebar .toggle-submenu .submenu-caret { transform: none !important; } /* Hide validation summary when there are no validation errors */ .validation-summary-valid { display: none !important; }