/* ================================================
   INLINE INVOICE DISCOUNTS - Custom Styles
   ================================================ */

/* Discount column styling */
.bill_col_discount {
    min-width: 150px;
}

.bill_col_discount .input-group-append {
    width: 60px;
}

.bill_col_discount .js_item_discount_type {
    font-size: 12px;
    padding: 0.25rem;
}

/* Hide discount column when needed */
.bill_col_discount.hidden {
    display: none !important;
}

/* Disabled button styling */
button.disabled,
a.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

/* ================================================
   BETADESAIN ERP - Global UI Refresh
   Applies a cleaner operational look across modules without changing page logic.
   ================================================ */
:root {
    --bd-ink: #203542;
    --bd-muted: #728692;
    --bd-line: #dbe8ec;
    --bd-soft: #f4fafb;
    --bd-panel: #ffffff;
    --bd-blue: #12788b;
    --bd-teal: #28a99a;
    --bd-green: #2f9f76;
    --bd-amber: #d88722;
    --bd-red: #c94e4e;
    --bd-shadow: 0 16px 34px rgba(17, 64, 76, .07);
    --bd-radius: 18px;
}

html,
body,
button,
input,
select,
textarea,
.page-wrapper,
.left-sidebar,
.topbar,
.modal,
.dropdown-menu,
.tooltip,
.popover {
    font-family: "Roboto", Arial, sans-serif !important;
}

body.loggedin {
    background:
        radial-gradient(circle at 92% 2%, rgba(18, 120, 139, .08) 0, rgba(18, 120, 139, .08) 180px, transparent 181px),
        linear-gradient(180deg, #f7fbfc 0%, #eef5f7 100%);
    color: var(--bd-ink);
    font-family: "Roboto", Arial, sans-serif;
}

body.loggedin .page-wrapper,
body.loggedin .page-content,
body.loggedin .container-fluid {
    background: transparent !important;
}

body.loggedin .page-titles {
    background: transparent;
    border: 0;
    padding-top: 18px;
    padding-bottom: 12px;
}

body.loggedin .page-titles h3,
body.loggedin .page-titles h4,
body.loggedin .card-title {
    color: var(--bd-ink);
    font-weight: 850;
    letter-spacing: -.02em;
}

body.loggedin .breadcrumb,
body.loggedin .text-muted,
body.loggedin small {
    color: var(--bd-muted) !important;
}

body.loggedin .card,
body.loggedin .modal-content,
body.loggedin .stats-card,
body.loggedin .panel,
body.loggedin .well {
    border: 1px solid var(--bd-line) !important;
    border-radius: var(--bd-radius) !important;
    box-shadow: var(--bd-shadow);
    background: rgba(255, 255, 255, .96);
}

body.loggedin .card-header,
body.loggedin .modal-header {
    background: linear-gradient(135deg, #ffffff 0%, var(--bd-soft) 100%) !important;
    border-bottom: 1px solid var(--bd-line) !important;
    border-radius: var(--bd-radius) var(--bd-radius) 0 0 !important;
}

body.loggedin .card-body {
    padding: 22px;
}

body.loggedin .table-responsive {
    border-radius: 16px;
}

body.loggedin table.table {
    color: var(--bd-ink);
}

body.loggedin .table thead th {
    border-top: 0 !important;
    border-bottom: 1px solid var(--bd-line) !important;
    color: #58707c;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
    background: #f8fbfc;
}

body.loggedin .table td,
body.loggedin .table th {
    border-color: #edf3f5 !important;
    vertical-align: middle;
}

body.loggedin .table-hover tbody tr {
    transition: background .15s ease, transform .15s ease;
}

body.loggedin .table-hover tbody tr:hover {
    background: #f6fbfc;
}

body.loggedin .form-control,
body.loggedin .select2-container--default .select2-selection--single,
body.loggedin .select2-container--default .select2-selection--multiple {
    border-color: #d8e5e9 !important;
    border-radius: 11px !important;
    box-shadow: none !important;
    color: var(--bd-ink);
}

body.loggedin .form-control:focus,
body.loggedin .select2-container--default.select2-container--focus .select2-selection--multiple,
body.loggedin .select2-container--default .select2-selection--single:focus {
    border-color: var(--bd-blue) !important;
    box-shadow: 0 0 0 3px rgba(18, 120, 139, .12) !important;
}

body.loggedin label,
body.loggedin .control-label {
    color: #536b77;
    font-size: 12px;
    font-weight: 800;
}

body.loggedin .btn {
    border-radius: 11px;
    font-weight: 750;
    box-shadow: none !important;
}

body.loggedin .btn-info,
body.loggedin .btn-primary {
    background: linear-gradient(135deg, var(--bd-blue), var(--bd-teal)) !important;
    border-color: transparent !important;
}

body.loggedin .btn-success {
    background: linear-gradient(135deg, #238b67, var(--bd-green)) !important;
    border-color: transparent !important;
}

body.loggedin .btn-warning {
    background: linear-gradient(135deg, #e29a32, var(--bd-amber)) !important;
    border-color: transparent !important;
    color: #fff !important;
}

body.loggedin .btn-danger {
    background: linear-gradient(135deg, #cf5a5a, var(--bd-red)) !important;
    border-color: transparent !important;
}

body.loggedin .btn-outline-info,
body.loggedin .btn-outline-primary {
    border-color: rgba(18, 120, 139, .35) !important;
    color: var(--bd-blue) !important;
}

body.loggedin .btn-outline-info:hover,
body.loggedin .btn-outline-primary:hover {
    background: var(--bd-blue) !important;
    color: #fff !important;
}

body.loggedin .badge,
body.loggedin .label,
body.loggedin .chip {
    border-radius: 999px;
    font-weight: 800;
    letter-spacing: .01em;
}

body.loggedin .alert {
    border: 1px solid var(--bd-line);
    border-radius: 16px;
}

body.loggedin .modal-content {
    overflow: hidden;
}

body.loggedin .modal-footer {
    border-top: 1px solid var(--bd-line);
    background: #fbfefe;
}

body.loggedin .left-sidebar {
    box-shadow: 12px 0 28px rgba(15, 35, 45, .05);
}

body.loggedin .sidebar-nav ul li a {
    border-radius: 0 999px 999px 0;
    margin: 2px 10px 2px 0;
}

body.loggedin .sidebar-nav ul li a:hover,
body.loggedin .sidebar-nav ul li.active > a {
    background: rgba(18, 120, 139, .10);
    color: var(--bd-blue) !important;
}

body.loggedin .topbar,
body.loggedin .navbar-header,
body.loggedin .navbar {
    box-shadow: 0 10px 28px rgba(17, 64, 76, .06);
}

body.loggedin .pagination .page-link {
    border-color: var(--bd-line);
    color: var(--bd-blue);
    border-radius: 10px;
    margin: 0 2px;
}

body.loggedin .pagination .active .page-link {
    background: var(--bd-blue);
    border-color: var(--bd-blue);
}

body.loggedin .dropdown-menu {
    border: 1px solid var(--bd-line);
    border-radius: 16px;
    box-shadow: 0 18px 38px rgba(17, 64, 76, .12);
    overflow: hidden;
}

body.loggedin .dropdown-item:hover {
    background: #f2f9fa;
    color: var(--bd-blue);
}

@media (max-width: 767.98px) {
    body.loggedin .card-body {
        padding: 16px;
    }

    body.loggedin .page-titles {
        padding-left: 4px;
        padding-right: 4px;
    }

    body.loggedin .table-responsive {
        border: 1px solid var(--bd-line);
    }
}

/* ================================================
   Tasks, Projects, and Gantt polish
   Gives kanban, project cards, and gantt a smoother studio finish.
   ================================================ */
body.loggedin .task-command-center .page-titles {
    margin-bottom: 6px;
}

body.loggedin .task-command-center #tasks-stats-wrapper {
    margin-bottom: 18px;
}

body.loggedin .task-command-center #tasks-stats-wrapper .stats-card,
body.loggedin .task-command-center #tasks-stats-wrapper .card {
    border-radius: 20px !important;
    overflow: hidden;
}

body.loggedin .task-studio-kanban {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 18px;
    align-items: start;
}

body.loggedin .task-studio-kanban .board {
    margin: 0;
    min-width: 0;
}

body.loggedin .task-studio-kanban .board-body {
    border: 1px solid #d9e6eb;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(18, 120, 139, .06), transparent 34%),
        linear-gradient(180deg, #fbfeff 0%, #f3f9fb 100%);
    box-shadow: 0 20px 42px rgba(17, 64, 76, .08);
    padding: 14px;
}

body.loggedin .task-studio-kanban .board-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 10px 14px;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(18, 120, 139, .09);
    color: var(--bd-ink);
    font-size: 14px;
    font-weight: 850;
    letter-spacing: .01em;
}

body.loggedin .task-studio-kanban .board-heading .pull-left {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

body.loggedin .task-studio-kanban .board-heading .pull-left::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--bd-blue), var(--bd-teal));
    box-shadow: 0 0 0 5px rgba(18, 120, 139, .08);
}

body.loggedin .task-studio-kanban .board-heading .mdi-plus-circle {
    font-size: 18px;
    color: var(--bd-blue);
}

body.loggedin .task-studio-kanban .kanban-content {
    padding: 4px 2px 0;
    min-height: 220px;
}

body.loggedin .task-studio-kanban .kanban-card {
    border: 1px solid #d8e7ed;
    border-radius: 20px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .98) 0%, rgba(248, 252, 253, .98) 100%);
    box-shadow: 0 14px 28px rgba(17, 64, 76, .07);
    margin-bottom: 14px;
    overflow: hidden;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.loggedin .task-studio-kanban .kanban-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(17, 64, 76, .11);
    border-color: rgba(18, 120, 139, .24);
}

body.loggedin .task-studio-kanban .kanban-card-cover-image {
    min-height: 132px;
    background-size: cover !important;
    background-position: center center !important;
}

body.loggedin .task-studio-kanban .kanban-card-content-comntainer {
    padding: 16px 16px 14px;
}

body.loggedin .task-studio-kanban .x-title {
    color: var(--bd-ink);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.45;
    margin-bottom: 10px;
}

body.loggedin .task-studio-kanban .x-action-button {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #f0f6f8;
    color: #5d7280;
}

body.loggedin .task-studio-kanban .x-meta {
    display: grid;
    gap: 10px;
    color: #667b88;
}

body.loggedin .task-studio-kanban .x-meta > span,
body.loggedin .task-studio-kanban .x-meta > div {
    line-height: 1.55;
}

body.loggedin .task-studio-kanban .x-meta strong {
    color: #415664;
    font-weight: 800;
}

body.loggedin .task-studio-kanban .label {
    border-radius: 999px;
    padding: 5px 10px;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .26);
}

body.loggedin .project-card-gallery .cards-grid-container {
    row-gap: 18px;
}

body.loggedin .project-card-gallery .click-url {
    transition: transform .18s ease;
}

body.loggedin .project-card-gallery .click-url:hover {
    transform: translateY(-2px);
}

body.loggedin .project-card-gallery .grid-card {
    margin-bottom: 0 !important;
    border: 1px solid #d8e7ed;
    border-radius: 24px;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(18, 120, 139, .06), transparent 30%),
        linear-gradient(180deg, #ffffff 0%, #f7fbfc 100%);
    box-shadow: 0 18px 36px rgba(17, 64, 76, .08);
}

body.loggedin .project-card-gallery .grid-card-img-container {
    min-height: 152px;
    background-size: cover !important;
    background-position: center center !important;
}

body.loggedin .project-card-gallery .grid-card-content.project-card {
    padding: 18px 18px 16px;
}

body.loggedin .project-card-gallery .project-card .x-title {
    color: var(--bd-ink);
    font-size: 20px;
    font-weight: 850;
    line-height: 1.4;
    margin-bottom: 14px;
    letter-spacing: -.02em;
}

body.loggedin .project-card-gallery .project-card .x-action-button {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #eff6f8;
    color: #5d7280;
}

body.loggedin .project-card-gallery .projects_col_progress.progress {
    height: 10px;
    border-radius: 999px;
    background: #e6eef2;
    overflow: hidden;
    margin-top: 4px !important;
}

body.loggedin .project-card-gallery .projects_col_progress .progress-bar {
    border-radius: 999px;
    background: linear-gradient(90deg, var(--bd-blue) 0%, var(--bd-teal) 100%) !important;
}

body.loggedin .project-card-gallery .x-meta {
    display: grid;
    gap: 8px;
    color: #6b7f8b;
    font-size: 13px;
}

body.loggedin .project-card-gallery .x-meta strong {
    color: #465a67;
    font-weight: 800;
}

body.loggedin .project-card-gallery .projects_col_status .label {
    padding: 6px 11px;
}

body.loggedin .project-card-gallery .avatar-xsmall {
    width: 30px;
    height: 30px;
    border: 2px solid #fff;
    box-shadow: 0 8px 14px rgba(17, 64, 76, .12);
}

/* ================================================
   BETADESAIN ERP - Modern Workspace V2
   Global visual layer for all working pages.
   ================================================ */
body.loggedin {
    --bd-ink: #102a3a;
    --bd-muted: #657c89;
    --bd-line: #d8e8ed;
    --bd-soft: #f3fafb;
    --bd-panel: #ffffff;
    --bd-blue: #0f7788;
    --bd-teal: #19a99c;
    --bd-cyan: #26b6d1;
    --bd-amber: #eba23a;
    --bd-green: #2fbf79;
    --bd-red: #d75a58;
    --bd-violet: #727be8;
    --bd-shadow: 0 18px 44px rgba(15, 47, 63, .08);
    --bd-shadow-hover: 0 22px 54px rgba(15, 47, 63, .12);
    --bd-radius: 16px;
}

body.loggedin .page-wrapper {
    background:
        radial-gradient(circle at 95% 0%, rgba(38, 182, 209, .09), transparent 260px),
        radial-gradient(circle at 4% 26%, rgba(25, 169, 156, .08), transparent 260px),
        linear-gradient(180deg, #f8fcfd 0%, #eef6f8 100%) !important;
}

body.loggedin .container-fluid {
    padding-left: 28px;
    padding-right: 28px;
}

body.loggedin .page-titles {
    margin-bottom: 18px;
}

body.loggedin .page-titles h3,
body.loggedin .page-titles h4 {
    font-size: 25px;
    font-weight: 900;
    color: var(--bd-ink);
}

body.loggedin .card,
body.loggedin .modal-content,
body.loggedin .stats-card,
body.loggedin .panel,
body.loggedin .well {
    position: relative;
    border-radius: var(--bd-radius) !important;
    border: 1px solid transparent !important;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(135deg, rgba(38, 182, 209, .32), rgba(235, 162, 58, .18), rgba(47, 191, 121, .18)) border-box !important;
    box-shadow: var(--bd-shadow);
}

body.loggedin .card:hover,
body.loggedin .stats-card:hover,
body.loggedin .panel:hover {
    box-shadow: var(--bd-shadow-hover);
}

body.loggedin .card-body::before,
body.loggedin .modal-body::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--bd-blue), var(--bd-cyan), var(--bd-amber));
    opacity: .82;
}

body.loggedin .card-body,
body.loggedin .modal-body {
    position: relative;
}

body.loggedin .card-title,
body.loggedin .modal-title {
    font-size: 22px;
    font-weight: 900;
    color: var(--bd-ink);
}

body.loggedin .btn {
    min-height: 38px;
    border-radius: 12px !important;
    font-weight: 800;
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

body.loggedin .btn:hover,
body.loggedin .btn:focus {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(15, 47, 63, .12) !important;
}

body.loggedin .btn-default,
body.loggedin .btn-secondary,
body.loggedin .btn-outline-secondary,
body.loggedin .btn-outline-dark {
    background: #f8fbfc !important;
    border-color: #d6e4ea !important;
    color: #243b4c !important;
}

body.loggedin .table-responsive {
    border: 1px solid var(--bd-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}

body.loggedin .table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: linear-gradient(180deg, #eff8fa 0%, #e5f1f5 100%) !important;
    color: #536f7e;
    font-size: 12px;
    font-weight: 900;
}

body.loggedin .table td {
    color: #213b4d;
}

body.loggedin .table-hover tbody tr:hover {
    background: #f5fbfd !important;
    box-shadow: inset 3px 0 0 var(--bd-cyan);
}

body.loggedin .form-control,
body.loggedin .select2-container--default .select2-selection--single,
body.loggedin .select2-container--default .select2-selection--multiple {
    min-height: 42px;
    background: linear-gradient(180deg, #fff 0%, #fbfdfe 100%) !important;
}

body.loggedin .badge,
body.loggedin .label {
    border: 1px solid rgba(255, 255, 255, .65);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35);
}

body.loggedin .badge-info,
body.loggedin .label-info {
    background: linear-gradient(135deg, #dff8fb, #c7edf4) !important;
    color: #107582 !important;
}

body.loggedin .badge-success,
body.loggedin .label-success {
    background: linear-gradient(135deg, #e2f8ec, #cdefda) !important;
    color: #1d7449 !important;
}

body.loggedin .badge-warning,
body.loggedin .label-warning {
    background: linear-gradient(135deg, #fff2db, #ffe3bc) !important;
    color: #9a5d0a !important;
}

body.loggedin .badge-danger,
body.loggedin .label-danger {
    background: linear-gradient(135deg, #fde8e7, #ffd7d4) !important;
    color: #b34340 !important;
}

body.loggedin .badge-secondary,
body.loggedin .label-default {
    background: #edf2f5 !important;
    color: #536778 !important;
}

/* Hide non-essential explanatory subtitles/help text on working pages. */
body.loggedin .page-titles .text-muted,
body.loggedin .card-title + p.text-muted,
body.loggedin h1 + p.text-muted,
body.loggedin h2 + p.text-muted,
body.loggedin h3 + p.text-muted,
body.loggedin h4 + p.text-muted,
body.loggedin .card-title + .text-muted,
body.loggedin .template-help,
body.loggedin .gantt-subtitle,
body.loggedin .subcon-panel__text,
body.loggedin .subcon-section__text,
body.loggedin .bom-tree-toolbar p,
body.loggedin .rab-tree-toolbar p,
body.loggedin .project-section-help,
body.loggedin .section-help,
body.loggedin .form-help,
body.loggedin .help-block:not(.form-error),
body.loggedin .help-text {
    display: none !important;
}

/* Keep operational metadata visible inside dense records and tables. */
body.loggedin table .text-muted,
body.loggedin .x-meta .text-muted,
body.loggedin .kanban-card .text-muted,
body.loggedin .grid-card .text-muted,
body.loggedin .timeline .text-muted,
body.loggedin .modal .text-muted,
body.loggedin .card .table .text-muted {
    display: initial !important;
}

@media (max-width: 767.98px) {
    body.loggedin .container-fluid {
        padding-left: 16px;
        padding-right: 16px;
    }
}

body.loggedin .project-card-gallery .btn-circle.btn-sm {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
}

body.loggedin .project-gantt-studio {
    border-radius: 26px !important;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(18, 120, 139, .08), transparent 28%),
        linear-gradient(180deg, #ffffff 0%, #f8fbfc 100%) !important;
}

body.loggedin .project-gantt-studio > .card-body {
    padding: 24px;
}

body.loggedin .project-gantt-studio .card-title {
    font-size: 28px;
    letter-spacing: -.03em;
}

body.loggedin .project-gantt-studio .label-info,
body.loggedin .project-gantt-studio .label-primary,
body.loggedin .project-gantt-studio .label-default {
    padding: 7px 12px;
    border-radius: 999px;
}

body.loggedin .project-gantt-studio #project-gantt-filter-form {
    padding: 18px;
    margin-bottom: 16px !important;
    border: 1px solid #dbe8ec;
    border-radius: 20px;
    background: rgba(248, 252, 253, .9);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
}

body.loggedin .project-gantt-studio .project-gantt-filter-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}

body.loggedin .project-gantt-studio .project-gantt-summary-pill {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 999px;
    background: #eef7f9;
    border: 1px solid #d9e7ec;
    color: #58707c;
    font-size: 12px;
    font-weight: 700;
}

body.loggedin .project-gantt-studio .project-gantt-summary-pill strong {
    color: var(--bd-ink);
    margin-left: 6px;
}

body.loggedin .project-gantt-studio .project-gantt-wrap {
    border: 1px solid #dbe8ec;
    border-radius: 22px;
    overflow: auto;
    background: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}

body.loggedin .project-gantt-studio .project-gantt-table thead th {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #f6fbfc;
}

body.loggedin .project-gantt-studio .project-gantt-task-cell {
    min-width: 330px;
    background: linear-gradient(180deg, #fff 0%, #fbfefe 100%);
}

body.loggedin .project-gantt-studio .project-gantt-row-box {
    border-radius: 18px;
    background: #fff;
    border: 1px solid #e3edf1;
    box-shadow: 0 10px 22px rgba(17, 64, 76, .05);
    padding: 12px 14px;
}

body.loggedin .project-gantt-studio .project-gantt-task-link {
    color: var(--bd-blue);
    font-weight: 800;
}

body.loggedin .project-gantt-studio .project-gantt-task-meta {
    color: #728692;
}

body.loggedin .project-gantt-studio .project-gantt-day-cell.is-active-task {
    position: relative;
}

body.loggedin .project-gantt-studio .project-gantt-bar-base {
    border-radius: 999px;
    background: rgba(18, 120, 139, .16);
}

body.loggedin .project-gantt-studio .project-gantt-bar-fill {
    border-radius: 999px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .24), 0 8px 16px rgba(73, 183, 138, .18);
}

body.loggedin .project-gantt-studio .project-gantt-progress-chip {
    border-radius: 999px;
    box-shadow: 0 10px 18px rgba(17, 64, 76, .12);
}

@media (max-width: 991.98px) {
    body.loggedin .task-studio-kanban {
        grid-template-columns: 1fr;
    }

    body.loggedin .project-gantt-studio > .card-body {
        padding: 18px;
    }

    body.loggedin .project-card-gallery .grid-card-content.project-card {
        padding: 16px;
    }
}

/* ==========================================================================
   Operational Density System
   --------------------------------------------------------------------------
   Global UI target:
   - body/menu base 14px
   - dense tables 13-14px
   - headings 20-22px, subtitles 16-18px
   - line-height 1.4-1.5
   - fit more data by reducing padding, not by making text unreadably small
   ========================================================================== */

:root {
    --ops-font-base: 14px;
    --ops-font-table: 13px;
    --ops-font-menu: 14px;
    --ops-font-submenu: 13px;
    --ops-title: 22px;
    --ops-title-sm: 20px;
    --ops-subtitle: 17px;
    --ops-line: 1.45;
    --ops-line-tight: 1.35;
    --ops-card-pad: 16px;
    --ops-card-pad-sm: 12px;
    --ops-cell-y: 9px;
    --ops-cell-x: 10px;
    --ops-cell-y-dense: 7px;
    --ops-cell-x-dense: 8px;
}

html,
body,
body.loggedin {
    font-size: var(--ops-font-base) !important;
    line-height: var(--ops-line);
    text-rendering: optimizeLegibility;
}

body,
button,
input,
select,
textarea,
.form-control,
.select2-container,
.select2-results__option,
.select2-selection__rendered,
.dropdown-menu,
.popover,
.tooltip,
.modal,
.card,
.page-wrapper {
    font-size: var(--ops-font-base);
    line-height: var(--ops-line);
}

p,
li,
label,
.text-muted,
.help-block,
.form-text,
.small,
small {
    line-height: var(--ops-line);
}

h1,
.h1 {
    font-size: 22px !important;
    line-height: var(--ops-line-tight);
}

h2,
.h2,
.page-titles h3,
.page-titles .text-themecolor,
.card-title,
.modal-title,
.x-heading,
.main-heading {
    font-size: var(--ops-title-sm) !important;
    line-height: var(--ops-line-tight) !important;
    letter-spacing: -0.015em;
}

h3,
.h3,
h4,
.h4,
.sub-heading,
.section-heading,
.card-subtitle {
    font-size: var(--ops-subtitle) !important;
    line-height: var(--ops-line-tight) !important;
}

h5,
.h5,
h6,
.h6 {
    font-size: 15px !important;
    line-height: var(--ops-line-tight) !important;
}

.page-titles {
    padding: 12px 0 10px !important;
    margin-bottom: 12px !important;
}

.page-titles .breadcrumb {
    font-size: 12px;
    margin-bottom: 0;
}

.page-titles .breadcrumb-item,
.page-titles .breadcrumb-item a {
    line-height: 1.35;
}

.card {
    margin-bottom: 14px;
}

.card-body {
    padding: var(--ops-card-pad) !important;
}

.card-header,
.modal-header,
.modal-footer {
    padding: 12px 16px !important;
}

.modal-body {
    padding: 16px !important;
}

.alert {
    padding: 10px 12px;
    font-size: 13px;
    line-height: 1.4;
}

.label,
.badge,
.label-rounded,
.badge-pill {
    font-size: 11px !important;
    line-height: 1.25;
    padding: 4px 8px !important;
}

.btn {
    font-size: 13px;
    line-height: 1.35;
    padding: 7px 12px;
}

.btn-sm,
.btn-xs,
.btn-circle.btn-sm {
    font-size: 12px;
    padding: 5px 9px;
}

.form-group {
    margin-bottom: 12px;
}

.form-control,
.select2-container .select2-selection--single,
.select2-container--default .select2-selection--single {
    min-height: 36px;
    height: 36px;
    padding: 7px 10px;
    font-size: 14px;
    line-height: 1.35;
}

textarea.form-control {
    min-height: 82px;
    height: auto;
}

label,
.control-label {
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 700;
    color: #5d6f7b;
}

.left-sidebar,
.sidebar-nav {
    font-size: var(--ops-font-menu);
}

.sidebar-nav ul li a,
.sidebar-nav > ul > li > a,
.left-sidebar .sidebar-nav ul li a {
    font-size: var(--ops-font-menu) !important;
    line-height: 1.35 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.sidebar-nav ul li ul li a,
.sidebar-nav .has-arrow + ul a,
.left-sidebar .sidebar-nav ul ul li a {
    font-size: var(--ops-font-submenu) !important;
    line-height: 1.35 !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.topbar,
.navbar,
.navbar-nav,
.navbar-nav .nav-link,
.topbar .top-navbar .navbar-nav > .nav-item > .nav-link {
    font-size: 14px;
    line-height: 1.35;
}

.table,
.table-responsive,
.dataTables_wrapper,
.list-table-wrapper {
    font-size: var(--ops-font-table);
    line-height: 1.4;
}

.table th,
.table td,
table.dataTable th,
table.dataTable td,
.dataTables_wrapper table.dataTable th,
.dataTables_wrapper table.dataTable td {
    padding: var(--ops-cell-y) var(--ops-cell-x) !important;
    font-size: var(--ops-font-table) !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;
}

.table thead th,
table.dataTable thead th,
.dataTables_wrapper table.dataTable thead th {
    font-size: 12px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
    letter-spacing: .035em;
    text-transform: uppercase;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
    white-space: nowrap;
}

.table-sm th,
.table-sm td,
.table.compact th,
.table.compact td,
.table.dataTable.compact th,
.table.dataTable.compact td {
    padding: var(--ops-cell-y-dense) var(--ops-cell-x-dense) !important;
}

.table td .text-muted,
.table td small,
.table td .small,
.dataTables_wrapper td .text-muted,
.dataTables_wrapper td small {
    font-size: 12px !important;
    line-height: 1.35 !important;
}

.table td strong,
.dataTables_wrapper td strong {
    font-weight: 750;
}

.dataTables_filter input,
.dataTables_length select,
.dt-buttons .btn {
    height: 34px;
    font-size: 13px;
}

.dataTables_info,
.dataTables_paginate,
.pagination,
.pagination .page-link {
    font-size: 13px;
}

.pagination .page-link {
    padding: 6px 10px;
}

.list-pages-crumbs,
.list-pages-actions,
.list-pages-stats {
    margin-bottom: 10px !important;
}

.stats-card,
.stat-card,
.mini-stat,
.summary-card,
.kpi-card {
    line-height: var(--ops-line-tight);
}

.stats-card h2,
.stat-card h2,
.mini-stat h2,
.summary-card h2,
.kpi-card h2,
.card .display-4,
.card .display-5 {
    font-size: 22px !important;
    line-height: 1.25 !important;
    margin-bottom: 4px !important;
}

.stats-card .text-muted,
.stat-card .text-muted,
.summary-card .text-muted,
.kpi-card .text-muted {
    font-size: 12px !important;
    line-height: 1.35 !important;
}

.erp-owner-dashboard,
.owner-dashboard-shell,
.finance-dashboard,
.warehouse-dashboard,
.production-dashboard {
    font-size: 14px;
}

.erp-owner-dashboard .hero-card,
.owner-dashboard-shell .hero-card,
.erp-owner-dashboard .dashboard-hero,
.owner-dashboard-shell .dashboard-hero {
    padding: 18px 20px !important;
}

.erp-owner-dashboard .hero-card h1,
.owner-dashboard-shell .hero-card h1,
.erp-owner-dashboard .dashboard-hero h1,
.owner-dashboard-shell .dashboard-hero h1,
body.loggedin .owner-dashboard h1 {
    font-size: 22px !important;
    line-height: 1.25 !important;
    margin-bottom: 0 !important;
}

.erp-owner-dashboard .hero-card p,
.owner-dashboard-shell .hero-card p,
.erp-owner-dashboard .dashboard-hero p,
.owner-dashboard-shell .dashboard-hero p,
.dashboard-description,
.section-description,
.lead-copy {
    font-size: 13px !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

.dashboard-description:empty,
.section-description:empty {
    display: none !important;
}

body.loggedin .task-studio-kanban .card,
body.loggedin .task-studio-kanban .kanban-card,
body.loggedin .project-card-gallery .grid-card,
body.loggedin .project-gantt-studio {
    border-radius: 16px !important;
}

body.loggedin .project-card-gallery .grid-card-content.project-card {
    padding: 14px !important;
}

body.loggedin .project-card-gallery .project-card .x-title {
    font-size: 16px !important;
    line-height: 1.35 !important;
    margin-bottom: 8px !important;
}

body.loggedin .project-card-gallery .x-meta {
    gap: 5px !important;
    font-size: 12px !important;
}

body.loggedin .project-gantt-studio > .card-body {
    padding: 16px !important;
}

body.loggedin .project-gantt-studio .card-title {
    font-size: 20px !important;
}

body.loggedin .project-gantt-studio #project-gantt-filter-form {
    padding: 12px !important;
    margin-bottom: 12px !important;
    border-radius: 14px !important;
}

body.loggedin .project-gantt-studio .project-gantt-summary-pill {
    min-height: 32px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
}

body.loggedin .project-gantt-studio .project-gantt-row-box {
    border-radius: 12px !important;
    padding: 8px 10px !important;
}

body.loggedin .project-gantt-studio .project-gantt-task-cell {
    min-width: 290px !important;
}

.kanban-card,
.x-card,
.grid-card,
.card-list-item {
    font-size: 13px;
    line-height: 1.4;
}

.kanban-card .x-title,
.grid-card .x-title,
.card-list-item .x-title {
    font-size: 15px !important;
    line-height: 1.35 !important;
}

.kanban-card .x-description,
.grid-card .x-description,
.card-list-item .x-description,
.muted-description,
.helper-description {
    font-size: 12px !important;
    line-height: 1.35 !important;
    color: #7a8b96 !important;
}

.modal .table th,
.modal .table td {
    padding: 7px 8px !important;
}

/* Page-specific density fixes for ERP custom screens with older large local CSS */
.owner-dashboard .owner-shell {
    gap: 16px !important;
}

.owner-dashboard .owner-hero,
.warehouse-document-page .warehouse-hero,
.warehouse-document-card,
.production-installation-page .pi-hero {
    padding: 16px 18px !important;
}

.owner-dashboard .owner-title {
    font-size: 22px !important;
    line-height: 1.28 !important;
}

.owner-dashboard .owner-kpi-grid,
.owner-dashboard .owner-alert-grid,
.owner-dashboard .owner-main-grid,
.owner-dashboard .owner-bottom-grid {
    gap: 14px !important;
}

.owner-dashboard .owner-kpi-grid {
    margin-top: 14px !important;
}

.owner-dashboard .owner-kpi-card,
.owner-dashboard .owner-alert-card {
    padding: 12px !important;
    border-radius: 14px !important;
}

.owner-dashboard .metric-label {
    font-size: 11px !important;
    margin-bottom: 6px !important;
}

.owner-dashboard .metric-value {
    font-size: 22px !important;
    line-height: 1.25 !important;
}

.owner-dashboard .owner-panel-body {
    padding: 14px !important;
}

.owner-dashboard .panel-title {
    font-size: 18px !important;
    line-height: 1.3 !important;
}

.owner-dashboard .cashflow-chart {
    min-height: 190px !important;
    gap: 10px !important;
}

.subcon-ui .subcon-shell {
    grid-template-columns: 300px minmax(0, 1fr) !important;
    gap: 14px !important;
}

.subcon-ui .subcon-card {
    border-radius: 16px !important;
}

.subcon-ui .subcon-card__body,
.subcon-ui .subcon-mini-card {
    padding: 14px !important;
}

.subcon-ui .subcon-title,
.subcon-ui .subcon-panel__title,
.subcon-ui .subcon-section__title,
.subcon-ui .subcon-section__title[style] {
    font-size: 20px !important;
    line-height: 1.3 !important;
}

.subcon-ui .subcon-code {
    padding: 8px 12px !important;
    border-radius: 12px !important;
    font-size: 16px !important;
}

.subcon-ui .subcon-stat-grid,
.subcon-ui .subcon-grid,
.subcon-ui .subcon-payment-summary,
.subcon-ui .subcon-meta,
.subcon-ui .subcon-actions,
.subcon-ui .subcon-list-stack {
    gap: 10px !important;
    margin-top: 12px !important;
}

.subcon-ui .subcon-stat,
.subcon-ui .subcon-payment-box {
    padding: 10px 12px !important;
    border-radius: 14px !important;
}

.subcon-ui .subcon-stat__value,
.subcon-ui .subcon-payment-box__value,
.subcon-ui .subcon-totalbar__value {
    font-size: 18px !important;
    line-height: 1.3 !important;
}

.subcon-ui .subcon-meta__row {
    padding: 9px 0 !important;
}

.subcon-ui .subcon-meta__value,
.subcon-ui .subcon-item-title,
.subcon-ui .subcon-mini-card__title {
    font-size: 14px !important;
    line-height: 1.4 !important;
}

.subcon-ui .subcon-field {
    gap: 5px !important;
}

.subcon-ui .subcon-field input,
.subcon-ui .subcon-field select,
.subcon-ui .subcon-field textarea,
.subcon-ui .subcon-table input,
.subcon-ui .subcon-table textarea,
.subcon-ui .subcon-table select {
    border-radius: 10px !important;
    padding: 8px 10px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}

.subcon-ui .subcon-note,
.subcon-ui .subcon-section__text,
.subcon-ui .subcon-panel__text,
.subcon-ui .subcon-mini,
.subcon-ui .subcon-item-meta,
.subcon-ui .subcon-mini-card__sub {
    font-size: 12px !important;
    line-height: 1.4 !important;
}

.subcon-ui .subcon-note {
    padding: 10px 12px !important;
    border-radius: 12px !important;
}

.subcon-ui .subcon-table-wrap {
    border-radius: 14px !important;
}

.subcon-ui .subcon-table th {
    padding: 9px 10px !important;
    font-size: 12px !important;
}

.subcon-ui .subcon-table td {
    padding: 9px 10px !important;
}

.subcon-ui .subcon-totalbar {
    padding: 10px 12px !important;
}

.subcon-ui .subcon-btn {
    padding: 8px 12px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
}

@media (max-width: 1199.98px) {
    .subcon-ui .subcon-shell {
        grid-template-columns: 1fr !important;
    }
}

.invoice-wrapper,
.pdf-preview-wrapper,
.document-wrapper {
    font-size: 14px;
    line-height: 1.45;
}

.invoice-wrapper .invoice-table th,
.invoice-wrapper .invoice-table td,
.document-wrapper table th,
.document-wrapper table td {
    font-size: 13px !important;
    padding: 7px 8px !important;
}

@media (max-width: 991.98px) {
    .card-body {
        padding: 14px !important;
    }

    .table th,
    .table td,
    table.dataTable th,
    table.dataTable td {
        padding: 8px 8px !important;
    }

    h1,
    .h1,
    h2,
    .h2,
    .page-titles h3,
    .card-title {
        font-size: 20px !important;
    }
}