/* ════════════════════════════════════════════════════════
   new-table.css — Modern table design for .new-design-table
   Applied globally via THEME_TABLE_CLASS
   ════════════════════════════════════════════════════════ */

/* ── Wrapper container ───────────────────────────────── */
.table-modern-wrap {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e4e8ef;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

/* ── Table base ──────────────────────────────────────── */
table.new-design-table {
    margin: 0 !important;
    font-size: 12px;
    border-collapse: collapse !important;
}

/* ── Primary header ──────────────────────────────────── */
table.new-design-table thead tr:first-child th {
    background: #1a3a5c !important;
    color: rgba(255, 255, 255, 0.88) !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0.7px !important;
    text-transform: uppercase !important;
    padding: 7px 8px !important;
    border: none !important;
    border-right: 1px solid rgba(255,255,255,0.1) !important;
    border-bottom: none !important;
    white-space: nowrap;
}
table.new-design-table thead tr:first-child th.sorting:after,
table.new-design-table thead tr:first-child th.sorting_asc:after,
table.new-design-table thead tr:first-child th.sorting_desc:after {
    opacity: 0.55;
    filter: brightness(2);
}

/* ── Column filter row (appended via JS drawCallback) ── */
table.new-design-table thead tr.filter-table-row td,
table.new-design-table thead tr.filters th {
    background: #f4f6fb !important;
    padding: 3px 6px !important;
    border-top: none !important;
    border-bottom: 2px solid #cbd5e1 !important;
}
table.new-design-table thead tr.filter-table-row td input,
table.new-design-table thead tr.filter-table-row td select,
table.new-design-table thead tr.filters th input,
table.new-design-table thead tr.filters th select {
    font-size: 11.5px;
    border-radius: 5px;
    border-color: #d1d9e6;
    background: #fff;
}

/* ── Body rows ───────────────────────────────────────── */
table.new-design-table tbody tr {
    border-bottom: 1px solid #e2e8f0 !important;
    transition: background 0.12s;
}
table.new-design-table tbody tr:nth-child(even) {
    background-color: #f8fafc !important;
}
table.new-design-table tbody tr:hover {
    background-color: #eef2ff !important;
}

/* ── Body cells ──────────────────────────────────────── */
table.new-design-table tbody td {
    padding: 5px 8px !important;
    vertical-align: middle !important;
    border-right: 1px solid #e2e8f0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    border-top: none !important;
    border-left: none !important;
    color: #374151;
    line-height: 1.3;
    font-size: 12px;
}
table.new-design-table tbody td:first-child {
    border-left: 1px solid #e2e8f0 !important;
}
table.new-design-table tfoot th {
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc;
    padding: 5px 8px;
    font-size: 12px;
    color: #6b7280;
}

/* ── Outer border ────────────────────────────────────── */
table.new-design-table {
    border: 1px solid #cbd5e1 !important;
}
table.new-design-table > :not(caption) > * > * {
    box-shadow: none !important;
}

/* ────────────────────────────────────────────────────────
   Utility badges — reusable across all table pages
   ──────────────────────────────────────────────────────── */

/* Status Active / Inactive */
.nt-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 9px;
    border-radius: 20px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    white-space: nowrap;
}
.nt-badge-active   { background: #dcfce7; color: #15803d; }
.nt-badge-inactive { background: #fee2e2; color: #b91c1c; }
.nt-badge-pending  { background: #fef9c3; color: #854d0e; }
.nt-badge-info     { background: #dbeafe; color: #1d4ed8; }
.nt-badge-gray     { background: #f3f4f6; color: #4b5563; }

/* Type / category pill */
.nt-type {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 9px;
    border-radius: 20px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.nt-type-business { background: #dbeafe; color: #1d4ed8; }
.nt-type-customer { background: #dcfce7; color: #15803d; }
.nt-type-supplier { background: #fef9c3; color: #854d0e; }
.nt-type-other    { background: #f3f4f6; color: #4b5563; }
.nt-type-system   { background: #e0e7ff; color: #3730a3; }
.nt-type-custom   { background: #d1fae5; color: #065f46; }

/* Location / city pill */
.nt-pill {
    display: inline-block;
    background: #f1f5f9;
    color: #475569;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 12px;
    white-space: nowrap;
}

/* Frequency badge */
.nt-freq-daily   { background: #dbeafe; color: #1d4ed8; }
.nt-freq-weekly  { background: #fce7f3; color: #9d174d; }
.nt-freq-monthly { background: #d1fae5; color: #065f46; }

/* Name cell — edit icon reveals on row hover */
.nt-name { font-weight: 600; color: #111827; }
.nt-name a,
.nt-name .edit-record { color: #93a3d4; font-size: 12px; margin-left: 5px; opacity: 0; transition: opacity 0.2s; }
table.new-design-table tbody tr:hover .nt-name a,
table.new-design-table tbody tr:hover .nt-name .edit-record { opacity: 1; }

/* Muted sub-text (address, description) */
.nt-muted { font-size: 12px; color: #6b7280; line-height: 1.35; }

/* Mobile / code monospace */
.nt-mono { font-size: 12.5px; letter-spacing: 0.3px; }

/* ── Loader row ──────────────────────────────────────── */
table.new-design-table tfoot .loader-td {
    text-align: center;
    padding: 14px;
    color: #94a3b8;
    font-size: 13px;
}

/* ════════════════════════════════════════════════════════
   .table-voucher — Inward / Voucher item entry table
   ════════════════════════════════════════════════════════ */

table.table-voucher {
    border-collapse: collapse !important;
    font-size: 12px;
    width: 100%;
    border: none !important;
}

/* Header — medium slate gray */
table.table-voucher thead.custom_thead th {
    background: #475569 !important;
    color: rgba(255, 255, 255, 0.92) !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    padding: 8px 10px !important;
    border: none !important;
    border-right: 1px solid rgba(255,255,255,0.08) !important;
    white-space: nowrap;
}

/* Main item rows */
table.table-voucher tbody tr.main-item-tr {
    background: #fff !important;
}
table.table-voucher tbody tr.main-item-tr:hover {
    background: #f8fafc !important;
}
table.table-voucher tbody tr.main-item-tr td {
    padding: 5px 7px !important;
    vertical-align: middle !important;
    border-top: none !important;
    border-left: 1px solid #e9ecef !important;
    border-right: 1px solid #e9ecef !important;
    border-bottom: 1px solid #dee2e6 !important;
}
table.table-voucher tbody tr.main-item-tr td:first-child {
    border-left: none !important;
}
table.table-voucher tbody tr.main-item-tr td:last-child {
    border-right: none !important;
}

/* Sub-detail row — light gray tint */
table.table-voucher tbody tr.head-tr {
    background: #f8f9fa !important;
}
table.table-voucher tbody tr.head-tr > td {
    padding: 6px 10px 8px 14px !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 2px solid #dee2e6 !important;
}

/* Nested sub-table — no outer border */
table.table-voucher tbody tr.head-tr .table {
    margin-bottom: 0 !important;
    font-size: 11.5px;
    border: none !important;
    background: #fff;
}

/* Sub-table header — light cool gray */
table.table-voucher tbody tr.head-tr thead.head-th th {
    background: #e2e8f0 !important;
    color: #334155 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 5px 8px !important;
    border: none !important;
    border-right: 1px solid #cbd5e1 !important;
    border-bottom: 1px solid #cbd5e1 !important;
    white-space: nowrap;
}

/* Sub-table body rows */
table.table-voucher tbody tr.head-tr tbody tr.sub-item-tr td {
    padding: 3px 7px !important;
    vertical-align: middle !important;
    border: 1px solid #e9ecef !important;
    border-top: none !important;
    background: #fff;
}
table.table-voucher tbody tr.head-tr tbody tr.sub-item-tr:nth-child(even) td {
    background: #f9fafb !important;
}
table.table-voucher tbody tr.head-tr tbody tr.sub-item-tr:hover td {
    background: #f1f5f9 !important;
}

/* Sub-table footer */
table.table-voucher tbody tr.head-tr tfoot th {
    background: #f1f5f9 !important;
    padding: 4px 8px !important;
    font-size: 11px !important;
    color: #334155 !important;
    font-weight: 600 !important;
    border: none !important;
    border-top: 1px solid #cbd5e1 !important;
    border-right: 1px solid #e2e8f0 !important;
}

/* Main table footer totals */
table.table-voucher tfoot th {
    background: #f1f5f9 !important;
    padding: 6px 10px !important;
    font-size: 11.5px !important;
    color: #334155 !important;
    font-weight: 700 !important;
    border: none !important;
    border-top: 2px solid #94a3b8 !important;
    border-right: 1px solid #e2e8f0 !important;
}

/* Inputs */
table.table-voucher .form-control,
table.table-voucher .form-control-sm {
    height: 24px !important;
    padding: 1px 5px !important;
    font-size: 11.5px !important;
    border-color: #d1d9e6 !important;
    border-radius: 4px !important;
    background: transparent !important;
    line-height: 1.3;
}
table.table-voucher .form-control:focus,
table.table-voucher .form-control-sm:focus {
    background: #fff !important;
    border-color: #64748b !important;
    box-shadow: 0 0 0 2px rgba(100, 116, 139, 0.15) !important;
}
table.table-voucher .form-control[readonly] {
    background: #f8fafc !important;
    color: #374151 !important;
}

/* Tom-select */
table.table-voucher .ts-wrapper .ts-control {
    min-height: 24px !important;
    padding: 1px 5px !important;
    font-size: 11.5px !important;
    border-color: #d1d9e6 !important;
    background: transparent !important;
}

/* Buttons */
table.table-voucher .btn-xs {
    padding: 1px 6px !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    border-radius: 3px !important;
}

/* ════════════════════════════════════════════════════════
   #voucher-account-form / .new-accounting-section
   Invoice / Voucher bottom section
   Applies to all voucher add pages sharing this form ID,
   or any element using the .new-accounting-section class.
   ════════════════════════════════════════════════════════ */

/* Card shell */
#voucher-account-form .card,
.new-accounting-section .card {
    border-radius: 10px;
    border: none;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.07);
}
#voucher-account-form .card-body,
.new-accounting-section .card-body {
    padding: 10px 12px !important;
}

/* ── Three section panels ────────────────────────────── */
#voucher-account-form .tax-section > div[class*="col-"],
.new-accounting-section .tax-section > div[class*="col-"] {
    border-radius: 8px !important;
    padding: 8px 10px !important;
    background: #fdfdff;
}

/* Panel 1 — Customer Info (navy) */
#voucher-account-form .tax-section > div[class*="col-"]:nth-child(1),
.new-accounting-section .tax-section > div[class*="col-"]:nth-child(1) {
    border: 1px solid #bcd0e8 !important;
    border-top: 3px solid #1a3a5c !important;
    background: #f8fafd;
}
/* Panel 2 — Tax Detail (violet) */
#voucher-account-form .tax-section > div[class*="col-"]:nth-child(2),
.new-accounting-section .tax-section > div[class*="col-"]:nth-child(2) {
    border: 1px solid #d8cff5 !important;
    border-top: 3px solid #6d28d9 !important;
    background: #faf9ff;
}
/* Panel 3 — Payment (green) */
#voucher-account-form .tax-section > div[class*="col-"]:nth-child(3),
.new-accounting-section .tax-section > div[class*="col-"]:nth-child(3) {
    border: 1px solid #bbddc9 !important;
    border-top: 3px solid #15803d !important;
    background: #f8fdfb;
}

/* Section title badges — each panel's own color */
#voucher-account-form .tax-section > div[class*="col-"] > span:first-of-type,
.new-accounting-section .tax-section > div[class*="col-"] > span:first-of-type {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.65px;
    color: #fff;
    padding: 2px 10px 3px;
    border-radius: 4px;
    margin-bottom: 5px;
    line-height: 1.6;
}
#voucher-account-form .tax-section > div[class*="col-"]:nth-child(1) > span:first-of-type,
.new-accounting-section .tax-section > div[class*="col-"]:nth-child(1) > span:first-of-type { background: #1a3a5c; }
#voucher-account-form .tax-section > div[class*="col-"]:nth-child(2) > span:first-of-type,
.new-accounting-section .tax-section > div[class*="col-"]:nth-child(2) > span:first-of-type { background: #6d28d9; }
#voucher-account-form .tax-section > div[class*="col-"]:nth-child(3) > span:first-of-type,
.new-accounting-section .tax-section > div[class*="col-"]:nth-child(3) > span:first-of-type { background: #15803d; }

/* Divider lines — match panel accent */
#voucher-account-form .tax-section > div[class*="col-"]:nth-child(1) > span:first-of-type + hr,
.new-accounting-section .tax-section > div[class*="col-"]:nth-child(1) > span:first-of-type + hr { border-color: #bcd0e8; margin: 0 0 6px 0; opacity: 1; }
#voucher-account-form .tax-section > div[class*="col-"]:nth-child(2) > span:first-of-type + hr,
.new-accounting-section .tax-section > div[class*="col-"]:nth-child(2) > span:first-of-type + hr { border-color: #d8cff5; margin: 0 0 6px 0; opacity: 1; }
#voucher-account-form .tax-section > div[class*="col-"]:nth-child(3) > span:first-of-type + hr,
.new-accounting-section .tax-section > div[class*="col-"]:nth-child(3) > span:first-of-type + hr { border-color: #bbddc9; margin: 0 0 6px 0; opacity: 1; }

/* ── Key totals — highlighted inputs ────────────────── */
/* TOTAL (tax panel) */
#voucher-account-form [name="total_with_tax"],
.new-accounting-section [name="total_with_tax"] {
    background: #fef3c7 !important;
    color: #92400e !important;
    font-weight: 700 !important;
    border-color: #f59e0b !important;
}
/* Net Rec (payment panel) */
#voucher-account-form [name="net_rec"],
.new-accounting-section [name="net_rec"] {
    background: #dcfce7 !important;
    color: #14532d !important;
    font-weight: 700 !important;
    border-color: #22c55e !important;
}
/* Total O/S — outstanding balance warning */
#voucher-account-form [name="total_os"],
.new-accounting-section [name="total_os"] {
    background: #fee2e2 !important;
    color: #7f1d1d !important;
    font-weight: 700 !important;
    border-color: #f87171 !important;
}
/* Sub Total */
#voucher-account-form [name="inward_amount"],
.new-accounting-section [name="inward_amount"] {
    background: #ede9fe !important;
    color: #4c1d95 !important;
    font-weight: 600 !important;
    border-color: #a78bfa !important;
}

/* ── Labels ──────────────────────────────────────────── */
#voucher-account-form .col-form-label,
.new-accounting-section .col-form-label {
    font-size: 11px !important;
    font-weight: 500;
    color: #4b5563;
    padding-top: 3px !important;
    padding-bottom: 2px !important;
    line-height: 1.3;
}

/* ── Inputs ──────────────────────────────────────────── */
#voucher-account-form .form-control,
#voucher-account-form .form-control-sm,
.new-accounting-section .form-control,
.new-accounting-section .form-control-sm {
    font-size: 12px !important;
    height: 26px !important;
    padding: 2px 7px !important;
    border-color: #d1d9e6;
    border-radius: 5px;
    line-height: 1.4;
}
#voucher-account-form textarea.form-control,
#voucher-account-form textarea.form-control-sm,
.new-accounting-section textarea.form-control,
.new-accounting-section textarea.form-control-sm {
    height: auto !important;
}
#voucher-account-form .form-control:focus,
#voucher-account-form .form-control-sm:focus,
.new-accounting-section .form-control:focus,
.new-accounting-section .form-control-sm:focus {
    border-color: #4a7fc5;
    box-shadow: 0 0 0 2px rgba(74, 127, 197, 0.14);
}
#voucher-account-form .form-control[readonly],
#voucher-account-form .form-control-sm[readonly],
.new-accounting-section .form-control[readonly],
.new-accounting-section .form-control-sm[readonly] {
    background: #f1f5fb;
    color: #1e293b;
    font-weight: 500;
}

/* ── Row tightening ──────────────────────────────────── */
#voucher-account-form .row.mb-1,
.new-accounting-section .row.mb-1  { margin-bottom: 3px !important; }
#voucher-account-form .row.mt-2,
.new-accounting-section .row.mt-2  { margin-top:    4px !important; }
#voucher-account-form .row.g-1,
.new-accounting-section .row.g-1   { row-gap: 3px !important; margin-bottom: 3px !important; }

/* ── Payment panel d-flex pairs ──────────────────────── */
#voucher-account-form .d-flex > .col-form-label,
.new-accounting-section .d-flex > .col-form-label {
    white-space: nowrap;
    min-width: 70px;
    font-size: 10.5px !important;
}

/* ── Input-group add-new button ──────────────────────── */
#voucher-account-form .input-group .btn,
.new-accounting-section .input-group .btn {
    padding: 2px 9px;
    font-size: 12px;
    height: 26px;
    line-height: 1.5;
}

/* ── Tom-select inside form (height sync) ────────────── */
#voucher-account-form .ts-wrapper .ts-control,
.new-accounting-section .ts-wrapper .ts-control {
    min-height: 26px !important;
    padding: 2px 7px !important;
    font-size: 12px !important;
}

/* ── Action buttons bar ──────────────────────────────── */
#voucher-account-form .text-center .btn,
.new-accounting-section .text-center .btn {
    padding: 5px 18px;
    font-size: 13px;
    border-radius: 3px;
    font-weight: 500;
    min-width: 80px;
}

/* ── Checkbox row alignment ──────────────────────────── */
#voucher-account-form .form-check-input,
.new-accounting-section .form-check-input {
    margin-top: 2px;
    float: none !important;
}

/* ── Customer Info panel: label alignment ────────────── */

/* Right-align all labels so they sit flush against their input */
#voucher-account-form .tax-section .col-md-5 .col-form-label,
.new-accounting-section .tax-section .col-md-5 .col-form-label {
    text-align: right;
    padding-right: 8px !important;
    font-size: 11px !important;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
}

/* Address 1/2/3 stacked inputs: small gap between each */
#voucher-account-form .col-9 .form-control + .form-control,
#voucher-account-form .col-sm-9 .form-control + .form-control,
.new-accounting-section .col-9 .form-control + .form-control,
.new-accounting-section .col-sm-9 .form-control + .form-control {
    margin-top: 3px;
}

/* Separator between Select Account row and the detail fields */
#voucher-account-form #customer-info-section,
.new-accounting-section #customer-info-section {
    border-top: 1px dashed #dde3ec;
    margin-top: 0px;
    /* margin-top: 6px; */
    padding-top: 4px;
}

/* City/State and PAN/GST — inner col-6 label alignment */
#voucher-account-form .col-6 .col-form-label,
.new-accounting-section .col-6 .col-form-label {
    text-align: right;
    padding-right: 6px !important;
}

#voucher-account-form .add-new-account,
.new-accounting-section .add-new-account {
    margin-top: 4px;
}

body{
    background: #f9f6f2;
}

#voucher-account-form #customer-info-section .col-form-label {
    text-align: end;
}