Sahyadri Count Pro

Login

Login

Forgot Password?

Don’t have an account?

Create Account

Billing

Confirmed Orders

Customer Ledger


Ledger


User

Profile

Logout

Billing Details

Customer Name

Date

---

Add Banner

Normal
Star
Vinyl
Black Back
Backlit
One Way

Width (ft)

Height (ft)

Quantity

Rate (₹ per sqft)

Add DTP
▼
DTP Charge (₹)

Add Frame
▼
Frame Type

Select Frame
Wooden
Metal

Frame Charge (₹)

Job Description
▼

+ Add
Confirm Bill

Billed To: –

Date: –

Size	Qty	Sqft	Rate	Amount
No items added yet

Total: ₹ 0

Summary

+ Add Expense

Customer Name	Amount Total	Received	Remaining	Expense Amount	Description

Account Information

Name
–
Email
–
Business Name
–
Username
–
Account Status
Active

body {
background: #f4f6f9;
overflow-y: scroll;
}
#mainApp{
display:none;
}
.auth-card{
width:320px;
margin:80px auto;
background:#fff;
padding:24px;
border-radius:16px;
border:1px solid #e5e7eb;
display:flex;
flex-direction:column;
gap:14px;
box-shadow:0 4px 14px rgba(0,0,0,.05);
}
.auth-card input{
padding:12px;
border:1px solid #d1d5db;
border-radius:10px;
}
.auth-card button{
padding:12px;
border:none;
border-radius:10px;
background:#111827;
color:#fff;
cursor:pointer;
}
/* TABS */
.tabs{
display:flex;
align-items:center;
gap:8px;
margin-bottom:15px;
}
.tabs button {
padding: 10px 16px;
margin-right: 8px;
border:2px solid transparent;
background: #e5e7eb;
color:#111827;
border-radius: 10px;
cursor: pointer;
font-weight: 700;
transition:.2s;
}
.tabs button.active-tab{
background:#ffffff;
color:#111827;
border:2px solid #111827;
}
.user-menu{
margin-left:auto;
position:relative;
width:max-content;
min-width:150px;
margin-right:0;
}
.user-btn{
background:#fff !important;
border:1px solid #e5e7eb !important;
color:#111827 !important;
padding:10px 14px !important;
border-radius:12px !important;
display:flex;
align-items:center;
gap:8px;
cursor:pointer;
font-weight:600;
width:100%;
box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.user-arrow{
width:14px;
height:14px;
stroke-width:2;
color:#9ca3af;
transition:.2s;
}
.user-dropdown.show + .user-arrow{
transform:rotate(180deg);
}
.user-dropdown{
display:none;
position:absolute;
top:110%;
right:0;
width:100%;
box-sizing:border-box;
background:#fff;
border:1px solid #e5e7eb;
border-radius:12px;
box-shadow:0 10px 24px rgba(0,0,0,.08);
overflow:hidden;
z-index:1000;
}
.user-dropdown.show{
display:block;
}
.user-dropdown button{
width:100%;
text-align:left;
background:#fff !important;
border:none !important;
padding:12px 14px !important;
margin:0 !important;
color:#374151 !important;
border-radius:0 !important;
}
.user-dropdown button:hover{
background:#f9fafb !important;
}
/* ACTIVE TAB */
.tab { display:none; }
.tab.active { display:block; }
/* MAIN CONTAINER */
.billing-container {
display: flex;
gap: 20px;
font-family: Arial;
}
/* CARDS */
.form-box, .bill-box{
background:#fff;
border-radius:14px;
padding:22px;
box-shadow:0 2px 8px rgba(0,0,0,0.05);
border:1px solid #eceff1;
}
/* LEFT SIDE */
.form-box{
width:320px;
}
/* HEADINGS */
h3 {
margin-bottom: 10px;
font-size: 18px;
}
/* LABELS */
.form-box label {
font-weight: bold;
font-size: 14px;
margin-top: 10px;
display: block;
}
/* INPUTS */
.form-box input,
.form-box select,
.form-box textarea{
width:100%;
padding:12px 14px;
margin-top:5px;
margin-bottom:12px;
border-radius:10px !important;
border:1px solid #e5e7eb;
background:#f9fafb;
font-size:15px;
box-sizing:border-box;
outline:none;
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
}
/* FRAME SECTION SAME SIZE */
#frameType,
#frameCharge{
height:48px;
box-sizing:border-box;
}
.form-box input:focus,
.form-box select:focus{
border-color:#cbd5e1;
background:#fff;
}
/* BUTTONS */
.form-box button{
width:100%;
padding:11px 14px;
border-radius:10px;
border:none;
font-size:14px;
font-weight:700;
cursor:pointer;
transition:0.2s;
}
/* ADD BUTTON */
.form-box button:first-of-type{
background:#f3f4f6;
color:#374151;
border:1px solid #e5e7eb;
}
/* CONFIRM BUTTON */
.form-box button:last-of-type{
background:#111827;
color:#fff;
}
.form-box button:first-of-type:hover{
background:#e5e7eb;
}
.form-box button:last-of-type:hover{
background:#1f2937;
}
/* RIGHT SIDE */
.bill-box {
flex: 1;
}
/* HEADER */
.bill-header{
display:flex;
justify-content:space-between;
gap:14px;
margin-bottom:16px;
background:#f9fafb;
padding:14px 16px;
border-radius:12px;
border:1px solid #eceff1;
font-size:14px;
color:#374151;
}
table th {
background: #f1f3f6;
font-weight: bold;
}
table th, table td {
padding: 10px;
text-align: center;
}
/* TOTAL */
.total{
margin-top:18px;
text-align:right;
font-size:18px;
font-weight:700;
background:#f3f4f6;
color:#111827;
padding:14px 16px;
border-radius:12px;
border:1px solid #e5e7eb;
}
/* CONFIRMED ORDERS */
.confirm-card {
border: 1px solid #eee;
padding: 12px;
margin-bottom: 10px;
border-radius: 8px;
background: #fff;
box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}
.confirm-card input {
width: 70px;
padding: 5px;
margin-left: 8px;
}
/* SUMMARY BOX */
#summaryBox{
display:flex;
gap:14px;
flex-wrap:wrap;
margin-top:12px;
}
/* MOBILE */
@media (max-width: 768px) {
body{
padding:10px;
}
/* CLEAN MOBILE BILL TABLE */
.billing-table th,
.billing-table td{
padding:12px 10px;
text-align:center;
border:none !important;
}
/* Tabs */
.tabs{
display:flex;
gap:8px;
margin-bottom:12px;
}
.tabs button{
flex:1;
width:auto;
margin:0;
padding:12px;
font-size:14px;
border-radius:10px;
}
/* Main layout */
.billing-container{
flex-direction:column;
gap:14px;
}
.form-box,
.bill-box{
width:100%;
padding:16px;
border-radius:14px;
}
/* Inputs */
.form-box input,
.form-box select{
font-size:16px;
padding:12px;
}
.input-row{
grid-template-columns:1fr;
gap:10px;
}
.form-box button{
padding:13px;
font-size:15px;
}
/* Bill header */
.bill-header{
flex-direction:column;
gap:8px;
font-size:14px;
padding:12px;
}
/* CONFIRMED ORDERS MOBILE FIX */
.customer-card{
background:#ffffff;
margin-top:6px;
padding:18px;
border-radius:18px;
border:1px solid #f1f5f9;
box-shadow:0 4px 14px rgba(15,23,42,.04);
position:relative;
margin-bottom:18px;
}
.customer-card thead{
display:none !important;
}
.customer-card input{
width:100%;
max-width:110px;
}
#ordersTab .sticky-header{
display:none !important;
}
/* FINAL MOBILE POLISH */
.customer-card{
box-shadow:0 2px 8px rgba(0,0,0,.05);
overflow:hidden;
margin-bottom:18px;
}
.customer-card .advance-input{
width:100% !important;
max-width:100px;
padding:8px;
font-size:14px;
}
.customer-card .mini-remove{
margin-left:6px;
font-size:18px;
}
.actions-wrap{
display:flex;
justify-content:flex-end;
width:100%;
}
.actions-menu{
top:40px;
}
.day-summary{
flex-direction:column;
align-items:flex-start;
}
.day-summary span{
width:100%;
box-sizing:border-box;
}
/* Date headings */
.date-group{
font-size:18px;
margin:24px 0 14px;
}
.day-summary{
gap:8px;
font-size:13px;
}
.day-summary span{
padding:6px 8px;
}
/* Summary bottom */
#summaryBox{
flex-direction:column;
gap:10px;
}
.sum-card{
width:100%;
min-width:auto;
text-align:center;
}
/* Three dots menu */
.actions-wrap{
width:100%;
margin-top:10px;
}
.actions-btn{
width:34px !important;
height:34px !important;
font-size:24px;
}
.actions-menu{
right:0;
left:auto;
min-width:180px;
}
/* Search box */
#searchCustomer{
font-size:16px;
padding:12px !important;
}
/* Modals */
.modal-box{
width:92%;
max-width:360px;
padding:18px;
border-radius:14px;
}
.modal-actions{
flex-direction:column;
}
.modal-actions button{
width:100%;
}
body{
padding-bottom:30px;
}
.sheet-table th,
.sticky-header{
display:none !important;
}
/* MOBILE BILL TABLE FIX */
.billing-table{
table-layout:auto !important;
border-radius:12px;
overflow:hidden;
}
.billing-table th{
font-size:11px !important;
padding:12px 4px !important;
white-space:nowrap;
}
.billing-table td{
font-size:12px !important;
padding:14px 4px !important;
line-height:1.3;
}
/* SIZE COLUMN */
.billing-table td:first-child{
min-width:90px;
text-align:left;
padding-left:10px !important;
}
/* REMOVE BUTTON COLUMN */
.billing-table td:last-child{
width:26px;
}
/* EMPTY ROW */
#emptyRow td{
padding:22px 10px !important;
font-size:13px !important;
color:#9ca3af;
}
/* BILL BOX */
.bill-box{
padding:14px !important;
}
/* HEADER */
.bill-header{
padding:12px !important;
margin-bottom:12px;
}
/* TOTAL */
.total{
margin-top:12px;
padding:12px 14px;
font-size:16px;
}
}
.sheet-table{
width:100%;
border-collapse:separate;
border-spacing:0 8px;
margin-top:8px;
}
.sheet-table th{
background:transparent;
color:#94a3b8;
font-size:12px;
font-weight:700;
border:none;
padding:6px 10px;
text-transform:uppercase;
letter-spacing:.5px;
}
.sheet-table td{
padding:12px 10px;
text-align:center;
font-size:14px;
border:none;
background:transparent;
}
.sheet-table tr:nth-child(even){
background:transparent;
}
.day-summary span{
background:#f8fafc;
border:1px solid #eef2f7;
padding:8px 12px;
border-radius:999px;
font-size:13px;
}
.summary-row{
background:transparent;
}
.summary-row td{
background:#eef2ff;
font-weight:700;
}
.multi-start td {
border-top:none;
}
.multi-end td {
border-bottom:none;
}
.multi-row td {
background:#f8fafc;
}
.sticky-header {
position: sticky;
top: 0;
z-index: 10;
}
.sticky-header th {
background: #e0e0e0;
position: sticky;
top: 0;
}
.sheet-table {
table-layout: fixed;
}
.sheet-table th:nth-child(1),
.sheet-table td:nth-child(1) { width: 18%; }
.sheet-table th:nth-child(2),
.sheet-table td:nth-child(2) { width: 8%; }
.sheet-table th:nth-child(3),
.sheet-table td:nth-child(3) { width: 14%; } /* SIZE */
.sheet-table th:nth-child(4),
.sheet-table td:nth-child(4) { width: 12%; }
.sheet-table th:nth-child(5),
.sheet-table td:nth-child(5) { width: 14%; }
.sheet-table th:nth-child(6),
.sheet-table td:nth-child(6) { width: 17%; }
.sheet-table th:nth-child(7),
.sheet-table td:nth-child(7) { width: 17%; }
.billing-table{
width:100%;
border-collapse:collapse;
margin-top:8px;
table-layout:fixed;
}
.billing-table th{
background:#f3f4f6;
color:#374151;
font-weight:700;
font-size:13px;
}
.billing-table th,
.billing-table td{
padding:12px 10px;
text-align:center;
border-bottom:1px solid #eef2f7;
}
.billing-table tr:nth-child(even){
background:#fafafa;
}
.day-summary{
margin-top:10px;
margin-bottom:8px;
display:flex;
gap:18px;
flex-wrap:wrap;
font-size:14px;
color:#444;
font-weight:600;
}
/* ADD BUTTON */
/* BOTH BUTTONS SAME LINE */
.add-btn,
.delete-btn{
position: absolute;
top: 12px;
background: transparent !important;
border: none !important;
color: #9ca3af;
font-size: 22px;
line-height: 1;
padding: 0;
margin: 0;
cursor: pointer;
z-index: 10;
width: 20px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
}
.add-btn{
background:transparent !important;
border:none !important;
color:#9ca3af !important;
width:28px;
height:28px;
display:flex;
align-items:center;
justify-content:center;
padding:0;
margin:0;
line-height:1;
font-size:22px;
cursor:pointer;
}
/* CROSS */
.delete-btn{
right: 14px;
}
/* HOVER */
.add-btn:hover,
.delete-btn:hover{
color: #6b7280;
}
.modal{
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,0.35);
z-index:999;
justify-content:center;
align-items:center;
}
.modal{
display:none;
position:fixed;
inset:0;
background:rgba(15,23,42,.38);
backdrop-filter:blur(4px);
z-index:999;
justify-content:center;
align-items:center;
}
.modal-box{
background:#ffffff;
width:360px;
padding:26px;
border-radius:24px;
border:1px solid #eef2f7;
box-shadow:
0 20px 40px rgba(15,23,42,.12),
0 2px 10px rgba(15,23,42,.06);
animation:modalPop .18s ease;
}
@keyframes modalPop{
from{
opacity:0;
transform:scale(.96) translateY(6px);
}
to{
opacity:1;
transform:scale(1) translateY(0);
}
}
.modal-box h3{
margin:0 0 22px;
font-size:24px;
font-weight:800;
color:#111827;
letter-spacing:-0.4px;
}
.modal-box label{
display:block;
margin-bottom:8px;
font-size:13px;
font-weight:700;
color:#374151;
}
.modal-box input,
.modal-box select{
width:100%;
height:48px;
padding:0 14px;
margin-bottom:18px;
border-radius:14px;
border:1px solid #e5e7eb;
background:#f9fafb;
font-size:15px;
color:#111827;
outline:none;
transition:.2s;
box-sizing:border-box;
appearance:none;
-webkit-appearance:none;
}
.modal-box input:focus,
.modal-box select:focus{
border-color:#cbd5e1;
background:#fff;
box-shadow:0 0 0 4px rgba(99,102,241,.08);
}
/* PREMIUM DROPDOWN */
#mBannerType{
background:
linear-gradient(to bottom,#ffffff,#f9fafb);
font-weight:600;
cursor:pointer;
}
/* BUTTON AREA */
.modal-actions{
display:flex;
gap:12px;
margin-top:6px;
}
.modal-actions button{
flex:1;
height:48px;
border:none;
border-radius:14px;
font-size:15px;
font-weight:700;
cursor:pointer;
transition:.2s;
}
/* SAVE */
.modal-actions button:first-child{
background:#111827;
color:#fff;
}
.modal-actions button:first-child:hover{
background:#1f2937;
transform:translateY(-1px);
}
/* CANCEL */
.modal-actions button:last-child{
background:#f3f4f6;
color:#374151;
border:1px solid #e5e7eb;
}
.modal-actions button:last-child:hover{
background:#e5e7eb;
}
@media(max-width:768px){
.modal-box{
width:92%;
padding:22px;
border-radius:22px;
}
}
.mini-remove{
background: transparent !important;
border: none !important;
color: #9ca3af;
font-size: 16px;
font-weight: 500;
padding: 0;
margin-left: 8px;
cursor: pointer;
line-height: 1;
width: auto;
height: auto;
border-radius: 0;
box-shadow: none !important;
}
.mini-remove:hover{
background: transparent !important;
color: #6b7280;
}
.mini-remove:focus,
.mini-remove:active{
outline: none;
background: transparent !important;
box-shadow: none !important;
}
.payment-history{
margin-top:10px;
padding-top:8px;
border-top:1px dashed #ddd;
font-size:13px;
}
.payment-history-title{
font-weight:700;
margin-bottom:6px;
color:#444;
}
.payment-row{
display:flex;
align-items:center;
gap:10px;
padding:4px 0;
color:#555;
}
.payment-row .payment-left{
display:flex;
align-items:center;
flex:1;
}
.payment-row .payment-left span{
width:120px;
display:inline-block;
}
.payment-row .mini-remove{
margin-left:10px;
}
.payment-row span:first-child{
font-weight:600;
}
.history-toggle{
margin-top:8px;
background:#f3f4f6 !important;
border:1px solid #e5e7eb !important;
padding:6px 10px;
border-radius:6px;
font-size:13px;
font-weight:500;
cursor:pointer;
color:#6b7280 !important;
box-shadow:none !important;
width:auto !important;
display:inline-flex;
align-items:center;
gap:6px;
}
.history-toggle:hover{
background:#eceff1 !important;
color:#374151 !important;
}
.history-toggle:focus,
.history-toggle:active{
outline:none;
box-shadow:none !important;
}
.history-box{
display:none;
margin-top:8px;
}
.history-box.show{
display:block;
}
.invoice-btn{
position:absolute;
top:12px;
right:86px;
background:transparent !important;
border:none !important;
font-size:18px;
cursor:pointer;
color:#9ca3af;
padding:0;
}
.invoice-btn:hover{
color:#374151;
}
.invoice-bottom-btn{
display:block;
margin:12px auto 0;
width:auto;
background:#f3f4f6 !important;
border:1px solid #e5e7eb !important;
color:#6b7280 !important;
padding:8px 12px;
border-radius:8px;
font-size:13px;
font-weight:600;
cursor:pointer;
}
.invoice-bottom-btn:hover{
background:#eceff1 !important;
color:#374151 !important;
}
.action-row{
display:flex;
gap:8px;
margin-top:10px;
align-items:center;
flex-wrap:wrap;
}
.action-row .history-toggle,
.action-row .invoice-bottom-btn{
margin:0;
}
.amounts-row{
display:flex;
align-items:center;
justify-content:flex-end;
gap:10px;
}
.amt-total,
.amt-paid,
.amt-pending{
width:75px;
text-align:right;
font-size:14px;
font-weight:700;
white-space:nowrap;
display:flex;
align-items:center;
justify-content:flex-end;
height:28px;
line-height:28px;
}
.amt-total{
color:#111827;
}
.amt-paid{
color:#16a34a;
}
.amt-pending{
color:#dc2626;
}
.actions-wrap{
margin-top:10px;
position:relative;
display:inline-block;
}
.actions-btn{
background:transparent !important;
border:none !important;
color:#9ca3af !important;
width:28px;
height:28px;
display:flex;
align-items:center;
justify-content:center;
padding:0;
margin:0;
font-size:22px;
line-height:1;
position:relative;
top:-4px; /* ← move dots upward */
right:-15px;
left :-9px;
cursor:pointer;
}
.actions-btn:hover{
background:#f3f4f6 !important;
color:#6b7280 !important;
}
.actions-btn:focus,
.actions-btn:active{
outline:none;
}
.actions-menu{
display:none;
position:absolute;
top:110%;
left:0;
background:#fff;
border:1px solid #e5e7eb;
border-radius:8px;
min-width:160px;
box-shadow:0 6px 14px rgba(0,0,0,0.08);
z-index:50;
overflow:hidden;
}
.actions-menu.show{
display:block;
}
.actions-menu button{
width:100%;
text-align:left;
padding:10px 12px;
border:none;
background:#fff;
color:#444;
cursor:pointer;
font-size:13px;
}
.actions-menu button:last-child{
color:#dc2626;
}
.card-actions{
display:flex;
justify-content:flex-end;
gap:10px;
margin-top:12px;
}
.bottom-icon-btn{
background:transparent !important;
border:none !important;
color:#9ca3af;
font-size:22px;
cursor:pointer;
padding:0;
width:24px;
height:24px;
}
.bottom-icon-btn:hover{
color:#6b7280;
}
.sum-card{
background:#fff;
padding:12px 16px;
border-radius:10px;
font-weight:700;
color:#1f2937;
box-shadow:0 2px 6px rgba(0,0,0,0.05);
min-width:170px;
}
.billing-table td button{
background:transparent !important;
border:none !important;
color:#9ca3af;
font-size:16px;
cursor:pointer;
padding:0;
}
.billing-table td button:hover{
color:#6b7280;
}
.input-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px;
}
.input-group{
display:flex;
flex-direction:column;
}
.dropdown-section{
border:1px solid #e5e7eb;
border-radius:14px;
margin:22px 0;
overflow:hidden;
background:#fff;
}
.dropdown-head{
display:flex;
justify-content:space-between;
align-items:center;
padding:14px 16px;
cursor:pointer;
font-weight:700;
font-size:15px;
background:#f9fafb;
}
.dropdown-head:hover{
background:#f3f4f6;
}
.dropdown-body{
display:none;
padding:16px;
border-top:1px solid #e5e7eb;
}
.section-line{
border:none !important;
border-top:1px solid #e5e7eb !important;
margin:22px 0 28px 0 !important;
display:block;
}
.mobile-order-row{
background:#fff;
border:1px solid #e5e7eb;
border-radius:14px;
padding:14px;
margin-bottom:12px;
display:grid;
gap:10px;
box-shadow:0 2px 8px rgba(0,0,0,.04);
}
.mobile-order-row div{
display:grid;
grid-template-columns:95px 1fr;
gap:10px;
align-items:center;
font-size:14px;
}
.mobile-order-row strong{
color:#6b7280;
font-weight:700;
}
.customer-card{
background:#fff;
border:1px solid #e5e7eb;
border-radius:18px;
padding:18px;
margin-bottom:18px;
box-shadow:0 4px 14px rgba(0,0,0,.04);
position:relative;
}
.card-top{
display:flex;
justify-content:space-between;
align-items:center;
min-height:44px;
}
.card-name{
font-size:18px;
font-weight:700;
color:#111827;
}
.card-items{
border-top:1px solid #f3f4f6;
padding:0 10px;
margin-top:16px;
margin-bottom:-20px;
}
.card-item{
display:grid;
grid-template-columns:1.3fr .9fr .9fr 160px;
gap:10px;
padding:14px 6px;
border-bottom:1px solid #f8fafc;
font-size:14px;
}
.card-item:last-child{
border-bottom:none;
}
.card-summary{
display:flex;
gap:12px;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
margin-top:14px;
}
.card-total,
.card-remain{
font-weight:700;
}
.date-group{
margin-top:42px;
margin-bottom:22px;
padding-top:26px;
border-top:2px dashed #d1d5db;
position:relative;
font-size:24px;
font-weight:800;
color:#111827;
letter-spacing:-0.3px;
}
.date-group:first-child{
border-top:none;
padding-top:0;
}
.date-group:first-child{
margin-top:35px;
}
/* ORDERS TOOLBAR */
.orders-toolbar{
display:flex;
gap:10px;
align-items:center;
margin-bottom:14px;
}
.orders-toolbar input[type=”text”]{
flex:1;
height:44px;
padding:0 14px;
border:1px solid #eef2f7;
border-radius:12px;
background:#ffffff;
font-size:14px;
color:#374151;
outline:none;
transition:.2s;
box-sizing:border-box;
}
.orders-toolbar input[type=”text”]:hover{
border-color:#d1d5db;
}
.orders-toolbar input[type=”text”]:focus{
border-color:#cbd5e1;
box-shadow:0 0 0 3px rgba(99,102,241,.08);
}
/* PREMIUM DATE FILTER */
.date-filter-wrap{
position:relative;
width:170px;
height:44px;
display:flex;
align-items:center;
background:#ffffff;
border:1px solid #eef2f7;
border-radius:12px;
overflow:hidden;
transition:.2s;
}
.month-filter-wrap{
width:190px;
flex:none;
}
.date-filter-wrap:hover{
border-color:#d1d5db;
background:#fff;
}
.date-filter-wrap:focus-within{
border-color:#cbd5e1;
background:#fff;
box-shadow:0 0 0 3px rgba(99,102,241,.08);
}
.filter-icon{
position:absolute;
right:38px;
width:16px;
height:16px;
color:#9ca3af;
pointer-events:none;
display:flex;
align-items:center;
justify-content:center;
}
.filter-icon svg{
width:18px;
height:18px;
stroke-width:2.2;
}
#filterDate{
flex:1;
border:none;
background:transparent;
padding:0 58px 0 12px;
font-size:14px;
color:#374151;
outline:none;
height:100%;
}
#ledgerMonthFilter{
flex:1;
border:none;
background:transparent;
padding:0 58px 0 12px;
font-size:14px;
color:#374151;
outline:none;
height:100%;
}
#ledgerMainMonthFilter{
flex:1;
border:none;
background:transparent;
padding:0 58px 0 12px;
font-size:14px;
color:#374151;
outline:none;
height:100%;
}
#ledgerMainMonthFilter::-webkit-calendar-picker-indicator{
opacity:0;
position:absolute;
right:0;
width:100%;
height:100%;
cursor:pointer;
}
#monthFilter{
flex:1;
border:none;
background:transparent;
padding:0 58px 0 0;
font-size:14px;
color:#374151;
outline:none;
height:100%;
text-align:center;
}
#monthFilter::-webkit-calendar-picker-indicator{
opacity:0;
position:absolute;
right:0;
width:100%;
height:100%;
cursor:pointer;
}
#ledgerMonthFilter::-webkit-calendar-picker-indicator{
opacity:0;
position:absolute;
right:0;
width:100%;
height:100%;
cursor:pointer;
}
#filterDate::-webkit-calendar-picker-indicator{
opacity:0;
position:absolute;
right:0;
width:100%;
height:100%;
cursor:pointer;
}
.clear-filter-btn{
position:absolute;
right:12px;
width:16px;
height:16px;
border:none;
background:transparent;
color:#9ca3af;
cursor:pointer;
padding:0;
display:flex;
align-items:center;
justify-content:center;
transition:none;
border-radius:0;
box-shadow:none !important;
}
.clear-filter-btn:hover,
.clear-filter-btn:focus,
.clear-filter-btn:active{
background:transparent !important;
color:#9ca3af !important;
box-shadow:none !important;
outline:none;
}
.clear-filter-btn{
appearance:none !important;
-webkit-appearance:none !important;
border:none !important;
background:none !important;
box-shadow:none !important;
outline:none !important;
position:absolute;
right:12px;
top:50%;
transform:translateY(-50%);
width:20px;
height:20px;
padding:0;
margin:0;
display:flex;
align-items:center;
justify-content:center;
color:#9ca3af !important;
cursor:pointer;
border-radius:0 !important;
}
.clear-filter-btn svg{
width:18px !important;
height:18px !important;
min-width:18px;
min-height:18px;
stroke-width:2.2;
display:block;
}
.clear-filter-btn:hover,
.clear-filter-btn:focus,
.clear-filter-btn:active{
background:none !important;
color:#9ca3af !important;
box-shadow:none !important;
outline:none !important;
}
/* MOBILE */
@media(max-width:768px){
.orders-toolbar{
flex-direction:column;
align-items:stretch;
}
.date-filter-wrap{
width:100%;
}
}
@media(max-width:768px){
.date-group{
font-size:20px;
margin-top:34px;
}
}
@media(max-width:768px){
.card-item{
grid-template-columns:1fr 1fr;
gap:8px;
}
}
.ledger-header{
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
margin-bottom:14px;
}
.primary-btn{
background:#111827;
color:#fff;
border:none;
padding:10px 14px;
border-radius:12px;
font-size:14px;
font-weight:600;
cursor:pointer;
}
.primary-btn:hover{
background:#1f2937;
}
/* LEDGER GRID */
.ledger-grid{
display:grid;
grid-template-columns:1.4fr 1fr 1.2fr;
gap:16px;
margin-top:12px;
}
.ledger-col{
background:#fff;
border:1px solid #e5e7eb;
border-radius:14px;
padding:16px;
}
/* TABLE */
.ledger-table{
width:100%;
border-collapse:collapse;
font-size:14px;
}
.ledger-table th{
text-align:left;
font-weight:700;
padding:8px 6px;
border-bottom:1px solid #e5e7eb;
color:#6b7280;
}
.ledger-table td{
padding:8px 6px;
border-bottom:1px solid #f3f4f6;
}
/* SUMMARY */
.ledger-summary-box{
display:flex;
flex-direction:column;
gap:10px;
font-weight:600;
font-size:15px;
}
/* EXPENSE ROW */
.expense-row{
display:flex;
justify-content:space-between;
padding:8px 0;
border-bottom:1px solid #f3f4f6;
font-size:14px;
}
/* MOBILE */
@media(max-width:768px){
.ledger-grid{
grid-template-columns:1fr;
}
}
.ledger-table-wrap{
background:#fff;
padding:20px;
border-radius:18px;
border:1px solid #eef2f7;
box-shadow:0 4px 16px rgba(0,0,0,0.04);
}
/* ===== CUSTOMER LEDGER ===== */
.customer-ledger-list{
display:flex;
flex-direction:column;
gap:14px;
}
.customer-ledger-card{
background:#fff;
border:1px solid #e5e7eb;
border-radius:18px;
padding:18px 20px;
box-shadow:0 4px 12px rgba(0,0,0,.04);
cursor:pointer;
transition:.2s;
}
.customer-ledger-card:hover{
transform:translateY(-2px);
}
.customer-ledger-top{
display:flex;
justify-content:space-between;
align-items:center;
}
.customer-ledger-name{
font-size:20px;
font-weight:700;
color:#111827;
}
.customer-ledger-pending{
font-size:22px;
font-weight:800;
color:#dc2626;
}
.customer-ledger-bottom{
margin-top:10px;
display:flex;
justify-content:space-between;
color:#6b7280;
font-size:14px;
}
/* LEDGER VIEW */
.ledger-view-box{
background:#fff;
border-radius:20px;
border:1px solid #e5e7eb;
padding:24px;
}
.ledger-view-head{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:22px;
}
.ledger-view-title{
font-size:28px;
font-weight:800;
color:#111827;
}
.back-btn{
border:none;
background:#f3f4f6;
padding:10px 14px;
border-radius:10px;
cursor:pointer;
font-weight:600;
}
.ledger-date{
margin-top:28px;
background:#d9f99d;
padding:8px 14px;
border-radius:8px;
font-weight:700;
display:inline-block;
}
.ledger-row{
display:grid;
grid-template-columns:1.2fr .6fr .8fr;
padding:12px 8px;
border-bottom:1px solid #f3f4f6;
align-items:center;
}
.ledger-row:last-child{
border-bottom:none;
}
.ledger-total-row{
margin-top:30px;
border-top:2px solid #111827;
padding-top:20px;
}
.ledger-total-line{
display:flex;
justify-content:space-between;
margin-bottom:12px;
font-size:18px;
font-weight:700;
}
.balance-red{
color:#dc2626;
}
.balance-green{
color:#059669;
}
@media(max-width:768px){
}
@media(max-width:768px){
.customer-ledger-top{
flex-direction:column;
align-items:flex-start;
gap:8px;
}
.ledger-row{
grid-template-columns:1fr;
gap:6px;
}
.ledger-view-title{
font-size:22px;
}
}
/* ===== CLEAN LEDGER TABLE ===== */
.ledger-main-table{
width:100%;
border-collapse:collapse;
}
/* HEADER */
.ledger-main-table th{
background:#f3f4f6;
color:#6b7280;
font-size:12px;
text-transform:uppercase;
letter-spacing:0.6px;
padding:12px;
text-align:center;
}
/* ROWS */
.ledger-main-table td{
padding:14px 12px;
font-size:14px;
background:#fff;
border-bottom:1px solid #f3f4f6;
}
/* REMOVE LAST BORDER */
.ledger-main-table tr:last-child td{
border-bottom:none;
}
/* TOTAL ROW */
.ledger-main-table tr:last-child td{
background:#111827;
color:#fff;
font-weight:700;
}
.ledger-main-table tr{
height:52px;
}
.ledger-main-table td:nth-child(2),
.ledger-main-table td:nth-child(3),
.ledger-main-table td:nth-child(4),
.ledger-main-table td:nth-child(5){
text-align:right;
font-variant-numeric: tabular-nums;
}
/* Pending Amount – Red */
.ledger-main-table td:nth-child(4){
color:#dc2626;
font-weight:700;
}
/* Customer names only (not date row) */
.ledger-main-table tr td:first-child:not([colspan]){
text-align:left;
}
.user-arrow.open{
transform:rotate(180deg);
}
.profile-card{
max-width:700px;
background:#fff;
border:1px solid #e5e7eb;
border-radius:16px;
padding:25px;
}
.profile-card h2{
margin-bottom:20px;
}
.profile-row{
display:flex;
justify-content:space-between;
align-items:center;
padding:14px 0;
border-bottom:1px solid #f1f5f9;
}
.profile-row:last-child{
border-bottom:none;
}
.profile-row span{
color:#6b7280;
}
.profile-row strong{
color:#111827;
}
.order-arrow{
width:6px;
height:6px;
border-right:1.5px solid #9ca3af;
border-bottom:1.5px solid #9ca3af;
transform:rotate(-45deg);
transition:transform .18s ease;
display:inline-block;
flex-shrink:0;
margin-right:2px;
}
.order-arrow.open{
transform:rotate(45deg);
}
.user-dropdown button{
display:flex;
align-items:center;
gap:10px;
}
.menu-icon{
width:16px;
height:16px;
stroke-width:1.8;
color:#6b7280;
flex-shrink:0;
}

Add Payment

Amount

Mode

Cash
Online
UPI
Bank

Save
Cancel

Add Expense

Title

Description

Category

General
Fuel
Salary
Rent
Material

Amount

Save
Cancel

Add Banner

Banner Type

Normal
Star
Vinyl
Black Back
Backlit
One Way

Width

Height

Qty

Rate

Save
Cancel

Move Entry To Another Date

Select New Date

Move
Cancel

Create Account

Create Account


Cancel