/* ==========================================================
   COURIER QUOTATION PRO V4.0
   COMPLETE STYLE.CSS
========================================================== */

*,
*::before,
*::after{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    font-size:16px;
    scroll-behavior:smooth;
}

body{
    min-height:100vh;
    font-family:'Inter',sans-serif;
    background:#f4f7fb;
    color:#1f2937;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

img{
    max-width:100%;
    display:block;
}

button,
input,
select,
textarea{
    font:inherit;
}

button{
    cursor:pointer;
    border:none;
    outline:none;
    background:none;
}

input,
textarea,
select{
    outline:none;
}

textarea{
    resize:vertical;
}

ul{
    list-style:none;
}

a{
    text-decoration:none;
    color:inherit;
}

:root{
    --primary:#2563eb;
    --primary-dark:#1d4ed8;
    --primary-soft:#eff6ff;
    --primary-rgb:37, 99, 235;
    --secondary:#64748b;
    --success:#16a34a;
    --accent-soft:#ecfdf5;
    --accent-rgb:22, 163, 74;
    --warning:#f59e0b;
    --danger:#dc2626;
    --info:#0891b2;
    --background:#f4f7fb;
    --surface:#ffffff;
    --border:#dbe3ef;
    --text:#111827;
    --text-light:#6b7280;
    --shadow-sm:0 2px 6px rgba(0,0,0,.05);
    --shadow-md:0 8px 20px rgba(0,0,0,.08);
    --shadow-lg:0 18px 40px rgba(0,0,0,.10);
    --radius-sm:8px;
    --radius:12px;
    --radius-lg:18px;
    --transition:.25s ease;
    --header-height:74px;
    --action-height:78px;
}

h1{
    font-size:28px;
    font-weight:700;
}

h2{
    font-size:24px;
    font-weight:700;
}

h3{
    font-size:20px;
    font-weight:600;
}

h4{
    font-size:16px;
    font-weight:600;
}

p{
    color:var(--text-light);
}

.required{
    color:var(--danger);
    margin-left:3px;
}

.error-text{
    display:block;
    min-height:18px;
    margin-top:4px;
    color:var(--danger);
    font-size:12px;
    font-weight:500;
}

.app-container{
    width:100%;
    min-height:100vh;
    display:flex;
    flex-direction:column;
}

.main-content{
    width:100%;
    max-width:1450px;
    margin:auto;
    padding:20px;
    padding-bottom:110px;
}

.app-header{
    position:sticky;
    top:0;
    z-index:999;
    min-height:var(--header-height);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:12px 25px;
    background:#ffffff;
    border-bottom:1px solid var(--border);
    box-shadow:var(--shadow-sm);
}

.header-left{
    display:flex;
    align-items:center;
    gap:15px;
}

.company-logo{
    width:52px;
    height:52px;
    object-fit:contain;
}

.company-name{
    font-size:26px;
    font-weight:700;
    color:var(--primary);
}

.application-title{
    font-size:22px;
    font-weight:700;
    color:var(--text);
}

.card{
    background:var(--surface);
    border-radius:var(--radius);
    border:1px solid var(--border);
    box-shadow:var(--shadow-sm);
    margin-bottom:20px;
    overflow:hidden;
    transition:var(--transition);
}

.card:hover{
    box-shadow:var(--shadow-md);
}

.card-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:18px 22px;
    background:#f8fafc;
    border-bottom:1px solid var(--border);
}

.card-header h3{
    color:var(--text);
}

.status-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:6px 14px;
    border-radius:50px;
    font-size:12px;
    font-weight:700;
    letter-spacing:.5px;
    text-transform:uppercase;
    white-space:nowrap;
}

.status-draft{
    color:#92400e;
    background:#fef3c7;
}

.status-ready{
    color:#166534;
    background:#dcfce7;
}

.status-sent{
    color:#1d4ed8;
    background:#dbeafe;
}

.status-cancelled{
    color:#991b1b;
    background:#fee2e2;
}

.card .form-grid,
.progress-section,
.summary-grid,
.accordion-content{
    padding:20px;
}

.form-status{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:18px 22px;
    border-top:1px solid var(--border);
    background:#fafbfd;
}

.save-status{
    color:var(--warning);
    font-size:14px;
    font-weight:600;
}

.required-note{
    font-size:13px;
    color:var(--text-light);
}

.form-grid{
    display:grid;
    gap:20px;
}

.two-column{
    grid-template-columns:repeat(2,1fr);
}

.three-column{
    grid-template-columns:repeat(3,1fr);
}

.four-column{
    grid-template-columns:repeat(4,1fr);
}

.five-column{
    grid-template-columns:repeat(5,1fr);
}

.full-width{
    grid-column:1/-1;
}

.form-group{
    display:flex;
    flex-direction:column;
    width:100%;
    min-width:0;
}

.form-group label{
    margin-bottom:8px;
    color:var(--text);
    font-size:14px;
    font-weight:600;
}

.form-group small{
    min-height:18px;
    margin-top:5px;
}

.form-group input[readonly]{
    background:#eef3fb;
    cursor:not-allowed;
    font-weight:600;
}

input,
select,
textarea{
    width:100%;
    padding:12px 15px;
    border:1px solid var(--border);
    border-radius:var(--radius-sm);
    background:#fff;
    transition:var(--transition);
    font-size:15px;
}

input:hover,
select:hover,
textarea:hover{
    border-color:#93c5fd;
}

input:focus,
select:focus,
textarea:focus{
    border-color:var(--primary);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12);
}

input::placeholder,
textarea::placeholder{
    color:#9ca3af;
}

textarea{
    min-height:100px;
}

.is-invalid{
    border-color:var(--danger)!important;
    box-shadow:0 0 0 3px rgba(220,38,38,.12)!important;
}

.location-field input[readonly],
.readonly-field input[readonly]{
    background:#f8fafc;
    border-color:#cbd5e1;
    color:#334155;
    cursor:default;
}

.location-field input[readonly]:focus,
.readonly-field input[readonly]:focus{
    box-shadow:none;
    border-color:#cbd5e1;
}

.ts-wrapper{
    width:100%;
}

.ts-control{
    min-height:48px;
    border-radius:var(--radius-sm)!important;
    border:1px solid var(--border)!important;
    padding:10px 12px!important;
    box-shadow:none!important;
    transition:var(--transition);
}

.ts-control:hover{
    border-color:#93c5fd!important;
}

.ts-control.focus{
    border-color:var(--primary)!important;
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)!important;
}

.ts-dropdown{
    border-radius:var(--radius-sm);
    border:1px solid var(--border);
    box-shadow:var(--shadow-md);
    overflow:hidden;
    z-index:9999;
}

.ts-dropdown .option{
    padding:12px 14px;
    font-size:14px;
}

.ts-dropdown .active{
    background:var(--primary);
    color:#fff;
}

.summary-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.summary-card{
    background:#f8fafc;
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:20px;
    text-align:center;
    transition:var(--transition);
}

.summary-card:hover{
    transform:translateY(-2px);
    box-shadow:var(--shadow-sm);
}

.summary-card h4{
    margin-bottom:10px;
    color:var(--text-light);
}

.summary-card span{
    display:block;
    font-size:24px;
    font-weight:700;
    color:var(--primary);
}

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:46px;
    padding:0 20px;
    border:none;
    border-radius:var(--radius-sm);
    font-size:14px;
    font-weight:600;
    color:#ffffff;
    transition:var(--transition);
    cursor:pointer;
    white-space:nowrap;
}

.btn:hover{
    transform:translateY(-2px);
    box-shadow:var(--shadow-md);
}

.btn:active{
    transform:translateY(0);
}

.btn-primary{
    background:var(--primary);
}

.btn-primary:hover{
    background:var(--primary-dark);
}

.btn-secondary{
    background:var(--secondary);
}

.btn-success{
    background:var(--success);
}

.btn-danger{
    background:var(--danger);
}

.btn-info{
    background:var(--info);
}

.btn-whatsapp{
    background:#25D366;
}

.action-bar{
    position:sticky;
    bottom:0;
    z-index:950;
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    justify-content:center;
    align-items:center;
    padding:16px;
    margin-top:25px;
    background:#ffffff;
    border-top:1px solid var(--border);
    box-shadow:0 -5px 15px rgba(0,0,0,.08);
}

.progress-section{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.progress-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    font-size:14px;
    font-weight:600;
}

.progress-bar{
    width:100%;
    height:10px;
    background:#e5e7eb;
    border-radius:100px;
    overflow:hidden;
}

.progress-fill{
    width:0;
    height:100%;
    background:linear-gradient(90deg,var(--primary),var(--success));
    transition:width .35s ease;
}

.status-bar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    min-height:60px;
    padding:14px 24px;
    background:#ffffff;
    border-top:1px solid var(--border);
    box-shadow:0 -2px 10px rgba(0,0,0,.05);
}

.status-left,
.status-center,
.status-right{
    display:flex;
    align-items:center;
    flex:1;
}

.status-center{
    justify-content:center;
}

.status-right{
    justify-content:flex-end;
}

#applicationStatus{
    font-size:14px;
    font-weight:700;
    color:var(--success);
}

#statusQuoteNumber{
    font-weight:700;
    color:var(--primary);
}

.status-right span{
    font-size:13px;
    color:var(--text-light);
}

.package-card{
    margin-bottom:20px;
    background:#ffffff;
    border:1px solid var(--border);
    border-radius:var(--radius);
    overflow:hidden;
    box-shadow:var(--shadow-sm);
}

.package-card-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:16px 20px;
    background:#f8fafc;
    border-bottom:1px solid var(--border);
}

.package-title{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:18px;
    font-weight:700;
    color:var(--text);
}

.package-number{
    color:var(--primary);
}

.package-card .form-grid{
    padding:20px;
}

#packageContainer{
    display:flex;
    flex-direction:column;
    gap:20px;
    margin-top:20px;
}

.charges-grid{
    grid-template-columns:1.15fr 1fr .75fr 1fr 1.05fr .8fr;
    align-items:start!important;
}

.charges-grid .form-group{
    min-width:0;
}

.freight-input-row{
    display:block;
}

.freight-estimate-btn{
    width:100%;
    height:38px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
    border:1px solid color-mix(in srgb,var(--primary) 35%,#fff);
    border-radius:8px;
    color:var(--primary-dark);
    background:var(--primary-soft);
    cursor:pointer;
    font-weight:800;
    padding:0 14px;
    transition:var(--transition);
}

.freight-estimate-btn:hover{
    color:#fff;
    background:var(--primary);
    border-color:var(--primary);
}

.freight-estimate-btn:disabled{
    opacity:.6;
    cursor:wait;
}

.field-hint{
    display:block;
    min-height:16px;
    margin-top:3px;
    color:#64748b;
    font-size:11px;
    line-height:1.35;
}

.field-hint[data-state="success"]{color:#15803d}
.field-hint[data-state="error"]{color:#dc2626}
.field-hint[data-state="loading"]{color:var(--primary-dark)}

.shipment-details-grid .ts-control,
.shipment-details-grid input,
.shipment-details-grid select{
    min-height:42px!important;
}

.shipment-details-grid .ts-control{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    overflow:hidden!important;
    padding-right:32px!important;
}

.shipment-details-grid .ts-control .item{
    max-width:100%!important;
    overflow:hidden!important;
    color:#111827!important;
    font-weight:650!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.shipment-details-grid .ts-wrapper.has-items:not(.focus) .ts-control > input{
    width:1px!important;
    min-width:1px!important;
    margin:0!important;
    padding:0!important;
    opacity:0!important;
}

#otherShipmentContainer{
    padding:10px 12px;
    border-left:3px solid var(--primary);
    background:#f8fbff;
    border-radius:8px;
}

#otherShipmentContainer input{
    background-color:#fff!important;
}

.total-box{
    align-self:start;
    justify-content:flex-start;
}

.calculate-box{
    align-self:start;
}

.total-box input{
    height:72px;
    min-height:72px;
    line-height:1.2;
    text-align:center;
    font-size:22px;
    font-weight:800;
    color:var(--success);
    background:#f0fdf4;
    border:2px solid #bbf7d0;
}

#transportMode{
    appearance:auto;
    min-height:48px;
}

.accordion-button{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:18px 22px;
    background:#f8fafc;
    border:none;
    border-bottom:1px solid var(--border);
    font-size:16px;
    font-weight:600;
    color:var(--text);
    transition:var(--transition);
}

.accordion-button:hover{
    background:#eef4ff;
}

.accordion-icon{
    font-size:22px;
    font-weight:700;
    transition:.3s ease;
}

.accordion-button.active .accordion-icon{
    transform:rotate(45deg);
}

.accordion-content{
    display:none;
    background:#ffffff;
}

.accordion-content.active{
    display:block;
    animation:fadeIn .25s ease;
}

.quotation-preview{
    display:flex;
    justify-content:center;
    overflow:auto;
    padding:30px;
    background:#eef2f7;
}

.a4-paper{
    margin:auto;
    width:210mm;
    min-height:297mm;
    padding:25mm;
    background:#ffffff;
    border-radius:8px;
    box-shadow:var(--shadow-lg);
}

.preview-placeholder{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    min-height:240mm;
    color:var(--text-light);
    text-align:center;
}

.preview-placeholder h3{
    margin-bottom:15px;
    color:var(--primary);
}

.preview-placeholder p{
    max-width:400px;
}

.loading-overlay{
    position:fixed;
    inset:0;
    display:none;
    justify-content:center;
    align-items:center;
    background:rgba(15,23,42,.45);
    backdrop-filter:blur(4px);
    z-index:9999;
}

.loading-overlay.show{
    display:flex;
}

.loading-box{
    width:320px;
    padding:35px;
    background:#ffffff;
    border-radius:var(--radius-lg);
    text-align:center;
    box-shadow:var(--shadow-lg);
}

.spinner{
    width:55px;
    height:55px;
    margin:0 auto 20px;
    border:5px solid #dbeafe;
    border-top-color:var(--primary);
    border-radius:50%;
    animation:spin .8s linear infinite;
}

#loadingTitle{
    margin-bottom:8px;
}

#loadingMessage{
    color:var(--text-light);
}

.toast{
    position:fixed;
    right:25px;
    bottom:95px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:15px 20px;
    background:#111827;
    color:#ffffff;
    border-radius:var(--radius);
    box-shadow:var(--shadow-lg);
    opacity:0;
    visibility:hidden;
    transform:translateY(30px);
    transition:var(--transition);
    z-index:9998;
}

.toast.show{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

#toastIcon{
    font-size:13px;
    font-weight:800;
    padding:3px 6px;
    border-radius:6px;
    background:rgba(255,255,255,.12);
}

.modal{
    position:fixed;
    inset:0;
    display:none;
    justify-content:center;
    align-items:center;
    background:rgba(0,0,0,.45);
    z-index:9999;
}

.modal.show{
    display:flex;
}

.modal-content{
    width:95%;
    max-width:430px;
    background:#ffffff;
    border-radius:var(--radius-lg);
    padding:28px;
    box-shadow:var(--shadow-lg);
    animation:scaleIn .25s ease;
}

.modal-content h3{
    margin-bottom:12px;
}

.modal-content p{
    margin-bottom:25px;
}

.modal-actions{
    display:flex;
    justify-content:flex-end;
    gap:12px;
}

.text-center{
    text-align:center;
}

.text-right{
    text-align:right;
}

.text-left{
    text-align:left;
}

.hidden{
    display:none!important;
}

.flex{
    display:flex;
}

.flex-center{
    display:flex;
    justify-content:center;
    align-items:center;
}

.mt-10{margin-top:10px;}
.mt-20{margin-top:20px;}
.mt-30{margin-top:30px;}

.mb-10{margin-bottom:10px;}
.mb-20{margin-bottom:20px;}
.mb-30{margin-bottom:30px;}

::-webkit-scrollbar{
    width:10px;
    height:10px;
}

::-webkit-scrollbar-track{
    background:#eef2f7;
}

::-webkit-scrollbar-thumb{
    background:#94a3b8;
    border-radius:20px;
}

::-webkit-scrollbar-thumb:hover{
    background:#64748b;
}

::selection{
    background:var(--primary);
    color:#ffffff;
}

@keyframes spin{
    to{
        transform:rotate(360deg);
    }
}

@keyframes fadeIn{
    from{
        opacity:0;
    }

    to{
        opacity:1;
    }
}

@keyframes scaleIn{
    from{
        opacity:0;
        transform:scale(.92);
    }

    to{
        opacity:1;
        transform:scale(1);
    }
}

@media (max-width:1200px){
    .five-column,
    .charges-grid{
        grid-template-columns:repeat(3,1fr);
    }

    .four-column{
        grid-template-columns:repeat(2,1fr);
    }

    .charges-grid .total-box{
        grid-column:span 2;
    }

    .app-header{
        padding:12px 18px;
    }
}

@media (max-width:992px){
    .three-column,
    .four-column,
    .five-column,
    .charges-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .summary-grid{
        grid-template-columns:1fr;
    }

    .application-title{
        font-size:18px;
    }

    .company-name{
        font-size:22px;
    }

    .a4-paper{
        width:100%;
        min-height:auto;
    }
}

@media (max-width:768px){
    .two-column,
    .three-column,
    .four-column,
    .five-column,
    .charges-grid{
        grid-template-columns:1fr;
    }

    .charges-grid .total-box{
        grid-column:auto;
    }

    .app-header{
        flex-direction:column;
        justify-content:center;
        gap:10px;
        height:auto;
        padding:15px;
        text-align:center;
    }

    .header-left{
        justify-content:center;
    }

    .main-content{
        padding:15px;
        padding-bottom:130px;
    }

    .card-header{
        flex-direction:column;
        align-items:flex-start;
        gap:10px;
    }

    .form-status{
        flex-direction:column;
        align-items:flex-start;
    }

    .action-bar{
        position:fixed;
        left:0;
        right:0;
        bottom:0;
        display:grid;
        grid-template-columns:repeat(3,1fr);
        gap:10px;
        padding:12px;
    }

    .btn{
        width:100%;
        min-height:42px;
        font-size:13px;
        padding:0 10px;
    }

    .status-bar{
        flex-direction:column;
        gap:8px;
        text-align:center;
        padding-bottom:95px;
    }

    .status-left,
    .status-center,
    .status-right{
        justify-content:center;
    }

    .toast{
        right:15px;
        left:15px;
        bottom:95px;
    }

    .quotation-preview{
        padding:15px;
    }

    .a4-paper{
        padding:18px;
    }
}

@media (max-width:480px){
    html{
        font-size:15px;
    }

    .company-logo{
        width:42px;
        height:42px;
    }

    .company-name{
        font-size:20px;
    }

    .application-title{
        font-size:16px;
    }

    .card{
        border-radius:10px;
    }
}

@media print{
    body{
        background:#ffffff;
    }

    .app-header,
    .action-bar,
    .status-bar,
    .loading-overlay,
    .toast,
    .modal{
        display:none!important;
    }

    .main-content{
        max-width:100%;
        padding:0;
        margin:0;
    }

    .card{
        border:none;
        box-shadow:none;
        margin:0;
    }

    .accordion-content{
        display:block!important;
    }

    .quotation-preview{
        padding:0;
        background:#ffffff;
    }

    .a4-paper{
        width:100%;
        min-height:auto;
        box-shadow:none;
        border:none;
        padding:0;
    }
}


/* =========================
   PICKUP / RECEIVER ADDRESS GRID
========================= */
.address-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:start;
}

.address-grid .location-field,
.address-grid .readonly-field{
    min-width:0;
}

.address-grid .full-width{
    grid-column:1/-1;
}

.address-grid textarea{
    min-height:76px;
}

.address-grid input,
.address-grid textarea,
.address-grid select{
    min-height:48px;
}

@media (max-width:992px){
    .address-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:768px){
    .address-grid{
        grid-template-columns:1fr;
    }
}
/* Compact Professional Redesign - final override */
.app-container,.main-content{font-size:12.5px!important}.main-content{padding:0!important}.card{border-radius:12px!important;margin-bottom:12px!important;box-shadow:0 10px 28px rgba(15,23,42,.06)!important}.card-header{padding:10px 14px!important}.card-header h3{font-size:14px!important;line-height:1.2!important}.card-body,.accordion-content{padding:12px 14px!important}.form-grid,.address-grid,.charges-grid{gap:10px!important}.form-group label{font-size:11.5px!important;margin-bottom:5px!important}.form-group input,.form-group select,.form-group textarea,input,select,textarea{min-height:38px!important;font-size:12.5px!important;padding:8px 10px!important;border-radius:9px!important}textarea{min-height:68px!important}.address-grid input,.address-grid textarea,.address-grid select{min-height:38px!important}.progress-section{padding:10px!important}.action-bar{gap:7px!important;padding:12px 0!important}.btn{min-height:36px!important;padding:8px 11px!important;font-size:11.5px!important;border-radius:9px!important}.package-card{border-radius:10px!important;padding:10px!important}.total-box input{height:50px!important;min-height:50px!important;font-size:16px!important;text-align:center!important}.quotation-preview{padding:12px!important}.status-bar{font-size:11.5px!important;padding:8px 10px!important}.a4-paper{font-size:11px!important}.preview-title,.quote-title{font-size:17px!important}.summary-total{font-size:15px!important}
/* Field + Icon Polish - compact final pass */
html{font-size:12.5px!important}
body{font-size:12.5px!important}
input,select,textarea,.ts-control,.tom-select,.choices__inner{min-height:34px!important;font-size:12px!important;line-height:1.25!important;padding:7px 9px!important;border-radius:8px!important}
select{background-size:14px!important;background-position:right 9px center!important;padding-right:30px!important}
input::placeholder,textarea::placeholder{font-size:11.5px!important;color:#9aa4b2!important}
.form-group label,.input-label,label{font-size:11px!important;line-height:1.2!important;margin-bottom:4px!important}
.field-error,.error-message,.invalid-feedback{font-size:10px!important;line-height:1.25!important;margin-top:3px!important}
button,.btn,.primary-button,.primary-action,.secondary-action{min-height:34px!important;font-size:11.5px!important;line-height:1.2!important;padding:7px 10px!important;border-radius:8px!important}
svg,.nav-icon svg,.cms-nav-icon svg,.header-icon svg,.cms-header-icon svg,.bell-icon svg,.btn svg,button svg{width:13px!important;height:13px!important;stroke-width:2!important}
.nav-icon,.cms-nav-icon{width:24px!important;height:24px!important;border-radius:7px!important}
.card,.panel,.customer-card,.user-card,.stat-card{border-radius:11px!important}
.card-header,.card-title,.list-toolbar,.panel-header{padding:9px 11px!important}
.table-wrap th,.table-wrap td,th,td{font-size:11.5px!important;padding:7px 8px!important}
.status-pill,.role-pill,.badge,.tag{font-size:10px!important;padding:3px 6px!important;border-radius:999px!important}
/* SVG Field Icons */
:root{
  --fi-user:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21a8 8 0 0 0-16 0'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
  --fi-lock:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E");
  --fi-phone:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 2 .7 2.8a2 2 0 0 1-.4 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2Z'/%3E%3C/svg%3E");
  --fi-mail:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E");
  --fi-pin:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 5-8 12-8 12S4 15 4 10a8 8 0 1 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
  --fi-building:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v16'/%3E%3Cpath d='M9 7h4M9 11h4M9 15h4'/%3E%3C/svg%3E");
  --fi-map:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 6 6-3 6 3 6-3v15l-6 3-6-3-6 3V6Z'/%3E%3Cpath d='M9 3v15M15 6v15'/%3E%3C/svg%3E");
  --fi-note:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16v16H4z'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/svg%3E");
  --fi-search:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
  --fi-rupee:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12M6 8h12M6 13h5a5 5 0 0 0 0-10M6 13l8 8'/%3E%3C/svg%3E");
  --fi-box:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 8-9-5-9 5 9 5 9-5Z'/%3E%3Cpath d='M3 8v8l9 5 9-5V8'/%3E%3Cpath d='M12 13v8'/%3E%3C/svg%3E");
  --fi-calendar:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
  --fi-truck:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v9H3z'/%3E%3Cpath d='M14 9h4l3 4v2h-7z'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3Ccircle cx='18' cy='18' r='2'/%3E%3C/svg%3E");
}
.form-group input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
.form-group select,
.form-group textarea,
.list-toolbar input[type="search"],
.password-field input,
.password-box input{
  background-image:var(--field-icon,var(--fi-note))!important;
  background-repeat:no-repeat!important;
  background-position:10px 50%!important;
  background-size:13px 13px!important;
  padding-left:31px!important;
}
.form-group textarea{background-position:10px 9px!important}
input[type="search"],#customerSearch,#userSearch{--field-icon:var(--fi-search)}
input[type="password"],#password,#confirmPassword{--field-icon:var(--fi-lock)}
input[type="email"],[id*="Email"],[id*="email"]{--field-icon:var(--fi-mail)}
input[type="tel"],[id*="Mobile"],[id*="mobile"],[id*="whatsapp"],[id*="Whatsapp"],[id*="phone"],[id*="Phone"]{--field-icon:var(--fi-phone)}
[id*="Name"],[id*="name"],[id*="Contact"],[id*="contact"],[id*="username"],[id*="Username"]{--field-icon:var(--fi-user)}
[id*="Company"],[id*="company"],[id*="gst"],[id*="GST"]{--field-icon:var(--fi-building)}
[id*="Pincode"],[id*="pincode"],[id*="Pin"],[id*="PIN"],[id*="State"],[id*="state"],[id*="District"],[id*="district"],[id*="City"],[id*="city"],[id*="Landmark"],[id*="landmark"]{--field-icon:var(--fi-pin)}
[id*="Address"],[id*="address"],[id*="terms"],[id*="Terms"]{--field-icon:var(--fi-map)}
[id*="Amount"],[id*="amount"],[id*="Charges"],[id*="charges"],[id*="gstPercentage"],[id*="freight"]{--field-icon:var(--fi-rupee)}
[id*="package"],[id*="Package"],[id*="shipment"],[id*="Shipment"],[id*="Weight"],[id*="weight"],[id*="Length"],[id*="Width"],[id*="Height"],[class*="package-"]{--field-icon:var(--fi-box)}
[id*="Date"],[id*="date"]{--field-icon:var(--fi-calendar)}
[id*="courier"],[id*="Courier"],[id*="transport"],[id*="Transport"]{--field-icon:var(--fi-truck)}
.total-box input{background-image:none!important;padding-left:10px!important}
.password-field,.password-box{position:relative}.password-field input,.password-box input{padding-right:58px!important}.password-field button,.password-box button{position:absolute!important;right:4px!important;top:50%!important;transform:translateY(-50%)!important;min-height:26px!important;height:26px!important;padding:4px 8px!important;font-size:10.5px!important;border-radius:7px!important}
/* Searchable dropdown icon polish */
.ts-wrapper .ts-control{
  min-height:34px!important;
  font-size:12px!important;
  line-height:1.25!important;
  padding:7px 28px 7px 31px!important;
  border-radius:8px!important;
  background-image:var(--fi-search)!important;
  background-repeat:no-repeat!important;
  background-position:10px 50%!important;
  background-size:13px 13px!important;
}
.ts-wrapper .ts-control input{background-image:none!important;padding-left:0!important;font-size:12px!important;min-height:18px!important}
.ts-dropdown{font-size:12px!important;border-radius:9px!important}
.ts-dropdown .option{padding:7px 9px!important}
/* Premium Scrollbar Polish */
*{scrollbar-width:thin;scrollbar-color:#9aa7bb transparent}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent;border-radius:999px}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#a8b3c5,#7d8899);border-radius:999px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#7c8aa0,#5f6b7c);border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-corner{background:transparent}
.sidebar-nav,.cms-sidebar-nav{scrollbar-color:rgba(148,163,184,.55) transparent}
.sidebar-nav::-webkit-scrollbar,.cms-sidebar-nav::-webkit-scrollbar{width:6px}
.sidebar-nav::-webkit-scrollbar-thumb,.cms-sidebar-nav::-webkit-scrollbar-thumb{background:rgba(148,163,184,.42);border:1px solid rgba(15,23,42,.35);border-radius:999px}
.sidebar-nav::-webkit-scrollbar-thumb:hover,.cms-sidebar-nav::-webkit-scrollbar-thumb:hover{background:rgba(203,213,225,.65)}
.customer-modal,.user-modal,.quick-customer-modal,.modal{scrollbar-gutter:stable;overscroll-behavior:contain}
.customer-modal::-webkit-scrollbar,.user-modal::-webkit-scrollbar,.quick-customer-modal::-webkit-scrollbar,.modal::-webkit-scrollbar{width:7px}
.customer-modal::-webkit-scrollbar-track,.user-modal::-webkit-scrollbar-track,.quick-customer-modal::-webkit-scrollbar-track,.modal::-webkit-scrollbar-track{background:rgba(15,23,42,.08);border-radius:999px;margin:12px 0}
.customer-modal::-webkit-scrollbar-thumb,.user-modal::-webkit-scrollbar-thumb,.quick-customer-modal::-webkit-scrollbar-thumb,.modal::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary),var(--success));border-radius:999px;border:2px solid rgba(255,255,255,.75);background-clip:padding-box}
.customer-modal-dialog,.user-modal-dialog,.quick-customer-dialog{max-height:calc(100vh - 36px)!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
.customer-modal-dialog form,.user-modal-dialog form,.quick-customer-dialog form{overflow:auto!important;padding-right:12px!important;scrollbar-gutter:stable}
.customer-modal-dialog form::-webkit-scrollbar,.user-modal-dialog form::-webkit-scrollbar,.quick-customer-dialog form::-webkit-scrollbar{width:7px}
.customer-modal-dialog form::-webkit-scrollbar-track,.user-modal-dialog form::-webkit-scrollbar-track,.quick-customer-dialog form::-webkit-scrollbar-track{background:#eef3f9;border-radius:999px;margin:8px 0}
.customer-modal-dialog form::-webkit-scrollbar-thumb,.user-modal-dialog form::-webkit-scrollbar-thumb,.quick-customer-dialog form::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary),var(--success));border-radius:999px;border:2px solid #eef3f9;background-clip:padding-box}
.table-wrap,.list-card{scrollbar-width:thin;scrollbar-color:#94a3b8 transparent}
.table-wrap::-webkit-scrollbar{height:7px;width:7px}.table-wrap::-webkit-scrollbar-thumb{background:#94a3b8;border-radius:999px}.table-wrap::-webkit-scrollbar-track{background:#eef2f7;border-radius:999px}
/* Modal Scroll Fix - keep header fixed, scroll form body */
.customer-modal,.user-modal,.quick-customer-modal{align-items:center!important;overflow:hidden!important}
.customer-modal-dialog,.user-modal-dialog,.quick-customer-dialog{max-height:calc(100vh - 28px)!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
.customer-modal-dialog .modal-card,.user-modal-dialog .modal-card,.quick-customer-dialog{display:flex!important;flex-direction:column!important;max-height:calc(100vh - 28px)!important;min-height:0!important;overflow:hidden!important}
.customer-modal-dialog .card-title,.user-modal-dialog .card-title,.quick-customer-header{flex:0 0 auto!important;position:relative!important;top:auto!important}
#customerForm,#userForm,.quick-customer-form{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden!important;padding-right:14px!important;overscroll-behavior:contain!important}
#customerForm::-webkit-scrollbar,#userForm::-webkit-scrollbar,.quick-customer-form::-webkit-scrollbar{width:7px!important}
#customerForm::-webkit-scrollbar-track,#userForm::-webkit-scrollbar-track,.quick-customer-form::-webkit-scrollbar-track{background:#edf2f7!important;border-radius:999px!important;margin:8px 0!important}
#customerForm::-webkit-scrollbar-thumb,#userForm::-webkit-scrollbar-thumb,.quick-customer-form::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary),var(--success))!important;border-radius:999px!important;border:2px solid #edf2f7!important;background-clip:padding-box!important}
@media (max-width:760px){.customer-modal,.user-modal,.quick-customer-modal{align-items:flex-start!important;padding:8px!important}.customer-modal-dialog,.user-modal-dialog,.quick-customer-dialog,.customer-modal-dialog .modal-card,.user-modal-dialog .modal-card{max-height:calc(100vh - 16px)!important}}
/* Merged customer selector polish */
#customerSelect.is-invalid + .ts-wrapper .ts-control,
.form-group:has(#customerSelect.is-invalid) .ts-control{border-color:#ef4444!important;box-shadow:0 0 0 3px rgba(239,68,68,.12)!important}
.form-group:has(select.is-invalid) .ts-control{border-color:#ef4444!important;box-shadow:0 0 0 3px rgba(239,68,68,.12)!important}
.form-group:has(#customerSelect) .ts-wrapper{width:100%!important}
.form-group:has(#customerSelect) .ts-control{min-height:40px!important}
.form-group:has(#customerSelect) .ts-control .item{font-weight:700;color:#111827!important}
/* Customer details compact layout */
.customer-details-card .card-header{padding:9px 12px!important}
.customer-details-card .customer-details-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:12px!important;row-gap:8px!important;align-items:start!important;padding:12px 14px!important}
.customer-details-card .form-group{margin:0!important;min-width:0!important}
.customer-details-card .customer-name-control,
.customer-details-card .form-group:has(#customerEmail),
.customer-details-card .form-group:has(#customerAddress){grid-column:1/-1!important}
.customer-details-card label{margin-bottom:4px!important;font-size:11px!important}
.customer-details-card input,
.customer-details-card textarea,
.customer-details-card .ts-control{min-height:34px!important;font-size:12px!important}
.customer-details-card textarea{min-height:58px!important;max-height:74px!important}
.customer-details-card .error-text{min-height:12px!important;margin-top:2px!important;font-size:10px!important}
.customer-details-card #customerName[type="hidden"]{display:none!important;position:absolute!important;width:0!important;height:0!important;padding:0!important;margin:0!important;border:0!important;overflow:hidden!important;background-image:none!important}
.customer-details-card .ts-wrapper{width:100%!important;margin:0!important}
.customer-details-card .ts-control{padding-top:7px!important;padding-bottom:7px!important}
.customer-details-card .ts-control input{min-height:18px!important}
@media (max-width:760px){.customer-details-card .customer-details-grid{grid-template-columns:1fr!important;padding:10px!important}.customer-details-card .form-group{grid-column:1/-1!important}}
/* Customer details row order */
.customer-details-card .customer-details-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:12px!important;row-gap:8px!important;align-items:start!important;padding:12px 14px!important}
.customer-details-card .customer-name-control,
.customer-details-card .customer-mobile-control,
.customer-details-card .customer-email-control,
.customer-details-card .customer-company-control{grid-column:auto!important}
.customer-details-card .customer-address-control{grid-column:1/-1!important}
.customer-details-card #customerName[type="hidden"]{display:none!important;position:absolute!important;width:0!important;height:0!important;padding:0!important;margin:0!important;border:0!important;overflow:hidden!important;background-image:none!important}
.customer-details-card textarea{min-height:58px!important;max-height:74px!important}
@media (max-width:760px){.customer-details-card .customer-details-grid{grid-template-columns:1fr!important}.customer-details-card .customer-name-control,.customer-details-card .customer-mobile-control,.customer-details-card .customer-email-control,.customer-details-card .customer-company-control,.customer-details-card .customer-address-control{grid-column:1/-1!important}}
/* Customer details exact two-column override */
.customer-details-card .form-group.customer-name-control:has(#customerSelect),
.customer-details-card .form-group.customer-mobile-control:has(#customerMobile),
.customer-details-card .form-group.customer-email-control:has(#customerEmail),
.customer-details-card .form-group.customer-company-control:has(#customerCompany){grid-column:auto!important}
.customer-details-card .form-group.customer-address-control:has(#customerAddress){grid-column:1/-1!important}
/* Quotation dropdown + summary sizing fixes */
select.tomselected,
select.ts-hidden-accessible{
  border:0!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  height:1px!important;
  overflow:hidden!important;
  padding:0!important;
  position:absolute!important;
  white-space:nowrap!important;
  width:1px!important;
  min-height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
.ts-wrapper{
  position:relative!important;
  width:100%!important;
  min-height:38px!important;
  border:1px solid #d8e1ee!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:0 1px 2px rgba(15,23,42,.03)!important;
  transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease!important;
}
.ts-wrapper.single .ts-control,
.ts-control{
  width:100%!important;
  min-height:38px!important;
  height:38px!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  border:0!important;
  border-radius:12px!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:7px 28px 7px 31px!important;
  font-size:12px!important;
  color:#111827!important;
  cursor:text!important;
}
.ts-wrapper:hover{border-color:#b8c7dc!important}
.ts-wrapper.focus,
.ts-wrapper.input-active{border-color:var(--primary)!important;box-shadow:0 0 0 3px rgba(var(--primary-rgb),.10)!important}
.ts-wrapper.focus .ts-control,
.ts-wrapper.input-active .ts-control,
.ts-control.focus{border-color:transparent!important;box-shadow:none!important}
.ts-control input{font-size:12px!important;line-height:1.25!important;min-height:18px!important;padding:0!important;margin:0!important;background:none!important;box-shadow:none!important;border:0!important;color:#111827!important}
.ts-control .item{font-size:12px!important;color:#111827!important;font-weight:600!important;line-height:1.2!important}
.ts-dropdown{
  position:absolute!important;
  z-index:10000!important;
  margin-top:4px!important;
  border:1px solid #d8e1ee!important;
  border-radius:10px!important;
  background:#fff!important;
  box-shadow:0 14px 32px rgba(15,23,42,.14)!important;
  overflow:hidden!important;
  font-size:12px!important;
}
.ts-dropdown .ts-dropdown-content{max-height:190px!important;overflow:auto!important;padding:4px!important}
.ts-dropdown .option,.ts-dropdown .create{padding:8px 10px!important;border-radius:8px!important;color:#1f2937!important;line-height:1.2!important}
.ts-dropdown .active,.ts-dropdown .option:hover{background:var(--primary-soft)!important;color:var(--primary-dark)!important}
.ts-dropdown [data-selectable].selected{background:#e0f2fe!important;color:#075985!important}
.form-group:has(select.tomselected) > select:not(.ts-hidden-accessible):not(.tomselected){display:none!important}
#customerSelect.is-invalid ~ .ts-wrapper,
.form-group:has(#customerSelect.is-invalid) .ts-wrapper,
.form-group:has(select.is-invalid) .ts-wrapper{border-color:#ef4444!important;box-shadow:0 0 0 3px rgba(239,68,68,.12)!important}
#customerSelect.is-invalid ~ .ts-wrapper .ts-control,
.form-group:has(#customerSelect.is-invalid) .ts-control,
.form-group:has(select.is-invalid) .ts-control{border-color:transparent!important;box-shadow:none!important}
.weight-summary,.weight-summary-grid,.weight-results{gap:10px!important}
.weight-card,.weight-box,.weight-summary-card{min-height:86px!important;padding:14px 16px!important;border-radius:12px!important}
.weight-card h4,.weight-box h4,.weight-summary-card h4{font-size:13px!important;margin:0 0 8px!important;line-height:1.2!important}
.weight-card span,.weight-box span,.weight-summary-card span,#actualWeight,#chargeableWeight{font-size:20px!important;line-height:1.2!important;font-weight:750!important}
.total-box input,#finalAmount{height:38px!important;min-height:38px!important;font-size:12.5px!important;font-weight:700!important;text-align:left!important;color:#111827!important;background:#fff!important;border:1px solid #d8e1ee!important;padding-left:31px!important}
.total-box input:focus,#finalAmount:focus{border-color:var(--success)!important;box-shadow:0 0 0 3px rgba(var(--accent-rgb),.12)!important}
/* Exact shipment summary sizing */
.summary-grid{gap:10px!important;margin-top:10px!important}
.summary-card{min-height:82px!important;padding:12px 14px!important;border-radius:12px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important}
.summary-card h4{font-size:13px!important;line-height:1.2!important;margin:0 0 7px!important;font-weight:700!important;color:#64748b!important}
.summary-card span,#actualWeight,#chargeableWeight{font-size:20px!important;line-height:1.15!important;font-weight:750!important;color:var(--primary)!important}

/* Final textbox-style searchable dropdowns */
.form-group .ts-wrapper{
  width:100%!important;
  min-height:42px!important;
  height:42px!important;
  display:block!important;
  border:1px solid #d7e1ee!important;
  border-radius:13px!important;
  background:#fff!important;
  box-shadow:none!important;
  padding:0!important;
  overflow:visible!important;
}
.form-group .ts-wrapper:hover{
  border-color:#b9c8dc!important;
}
.form-group .ts-wrapper.focus,
.form-group .ts-wrapper.input-active{
  border-color:#2383f6!important;
  box-shadow:0 0 0 3px rgba(35,131,246,.12)!important;
}
.form-group .ts-wrapper .ts-control,
.form-group .ts-wrapper.single .ts-control{
  width:100%!important;
  height:100%!important;
  min-height:40px!important;
  display:flex!important;
  align-items:center!important;
  border:0!important;
  outline:0!important;
  border-radius:13px!important;
  background-color:transparent!important;
  box-shadow:none!important;
  padding:0 36px 0 42px!important;
  margin:0!important;
}
.form-group .ts-wrapper .ts-control::before{
  content:"";
  position:absolute;
  left:15px;
  top:50%;
  width:14px;
  height:14px;
  transform:translateY(-50%);
  background-image:var(--field-icon,var(--fi-search));
  background-repeat:no-repeat;
  background-position:center;
  background-size:14px 14px;
  opacity:.78;
  pointer-events:none;
}
.form-group .ts-wrapper .ts-control input{
  width:100%!important;
  min-width:0!important;
  flex:1 1 auto!important;
  height:auto!important;
  min-height:20px!important;
  border:0!important;
  outline:0!important;
  background:none!important;
  box-shadow:none!important;
  padding:0!important;
  margin:0!important;
}
.form-group .ts-wrapper .ts-control > input[id$="-ts-control"],
.form-group .ts-wrapper .ts-control > input[type="select-one"],
.form-group:has(select.tomselected) .ts-wrapper .ts-control > input{
  width:100%!important;
  min-width:0!important;
  flex:1 1 auto!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  padding:0!important;
  margin:0!important;
}
.form-group .ts-wrapper .ts-control input::placeholder{
  color:#96a2b3!important;
}
.form-group .ts-wrapper .ts-control .item{
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.form-group:has(select.is-invalid) .ts-wrapper,
.form-group:has(#customerSelect.is-invalid) .ts-wrapper{
  border-color:#ef4444!important;
  box-shadow:0 0 0 3px rgba(239,68,68,.12)!important;
}
.form-group:has(select.is-invalid) .ts-wrapper .ts-control,
.form-group:has(#customerSelect.is-invalid) .ts-wrapper .ts-control{
  border:0!important;
  box-shadow:none!important;
}

.quotation-document .quote-footer{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  text-align:center!important;
}
.quotation-document .quote-footer .small,
.quotation-document .quote-footer .signature{
  width:100%!important;
  text-align:center!important;
}

.dimension-input{
  position:relative!important;
  width:100%!important;
}
.dimension-input input{
  width:100%!important;
  padding-right:48px!important;
}
.dimension-input span{
  position:absolute!important;
  right:14px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  color:#64748b!important;
  font-size:11px!important;
  font-weight:800!important;
  letter-spacing:.02em!important;
  pointer-events:none!important;
}

/* Final quotation form polish: visible placeholders, full selected dropdown names, and same-as toggles. */
.card-header{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
}
.same-as-toggle{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0!important;
  padding:8px 11px!important;
  min-height:36px!important;
  border:1px solid #bfdbfe!important;
  border-radius:999px!important;
  background:#eff6ff!important;
  color:#0b57d0!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1!important;
  white-space:nowrap!important;
  cursor:pointer!important;
}
.same-as-toggle input{
  width:16px!important;
  height:16px!important;
  min-height:16px!important;
  margin:0!important;
  accent-color:#1687ff!important;
  cursor:pointer!important;
}
.same-as-toggle span{
  display:inline-block!important;
}
.form-group input::placeholder,
.form-group textarea::placeholder,
.form-group .ts-wrapper .ts-control input::placeholder{
  color:#8a97aa!important;
  opacity:1!important;
  font-size:13px!important;
  white-space:nowrap!important;
}
.form-group .ts-wrapper .ts-control,
.form-group .ts-wrapper.single .ts-control{
  gap:6px!important;
  overflow:visible!important;
  padding-left:42px!important;
  padding-right:32px!important;
}
.form-group .ts-wrapper .ts-control .item{
  flex:1 1 auto!important;
  min-width:0!important;
  max-width:none!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
  font-size:14px!important;
  line-height:1.25!important;
}
.form-group .ts-wrapper.has-items .ts-control > input,
.form-group:has(select.tomselected) .ts-wrapper.has-items .ts-control > input{
  flex:0 1 2px!important;
  width:2px!important;
  min-width:2px!important;
}
#customerSelect + .ts-wrapper .ts-control .item,
.customer-name-control .ts-wrapper .ts-control .item{
  font-size:13px!important;
  white-space:normal!important;
  line-height:1.2!important;
}
.customer-details-card .form-group input,
.customer-details-card .form-group textarea,
.quotation-section-pair .form-group input,
.quotation-section-pair .form-group textarea{
  padding-left:48px!important;
}
@media(max-width:640px){
  .card-header{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:8px!important;
  }
  .same-as-toggle{
    width:100%!important;
    justify-content:center!important;
  }
  .form-group .ts-wrapper .ts-control .item{
    font-size:13px!important;
  }
}

/* Delhivery address validation toggles */
.card-header .header-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  margin-left:auto!important;
}
.validate-check{
  border-color:#bbf7d0!important;
  background:#f0fdf4!important;
  color:#15803d!important;
}
.address-validation-message{
  display:block!important;
  min-height:16px!important;
  margin-top:4px!important;
  font-size:11px!important;
  line-height:1.35!important;
  font-weight:700!important;
}
.address-validation-message.checking{color:var(--primary)!important}

/* Database-backed quotation theme. Keep late overrides from restoring fixed brand colors. */
.package-number,
.compact-value,
.field-hint[data-state="loading"]{color:var(--primary)!important}
.close-package-editor{background:var(--primary)!important}
.add-package-group,
.address-validation-btn{color:var(--primary)!important;background:var(--primary-soft)!important;border-color:color-mix(in srgb,var(--primary) 30%,#fff)!important}
.sync-check input{accent-color:var(--primary)!important}
.ts-wrapper.focus,
.ts-wrapper.input-active{border-color:var(--primary)!important;box-shadow:0 0 0 3px rgba(var(--primary-rgb),.10)!important}
.address-validation-message.success{color:#15803d!important}
.address-validation-message.warning{color:#b45309!important}
.address-validation-message.error{color:#dc2626!important}
@media(max-width:640px){
  .card-header .header-actions{
    width:100%!important;
    justify-content:stretch!important;
    margin-left:0!important;
  }
  .card-header .header-actions .sync-check,
  .card-header>.validate-check{
    width:100%!important;
    justify-content:center!important;
    margin-left:0!important;
  }
}