/* ===== Bootstrap Half-Column Grid Extension ===== */
/* Supports: sm, md, lg, xl, xxl breakpoints */
/* Usage: col-sm-H (0.5 col) , col-sm-1H (1.5 cols), col-lg-3H (3.5 cols) */

:root {
    --bs-col: calc(100% / 12);
}

/* ---------- SM (≥576px) ---------- */
.col-sm-H {
    flex: 0 0 calc(var(--bs-col) * 0.5);
    max-width: calc(var(--bs-col) * 0.5);
}
.col-sm-1H {
    flex: 0 0 calc(var(--bs-col) * 1.5);
    max-width: calc(var(--bs-col) * 1.5);
}

.col-sm-2H {
    flex: 0 0 calc(var(--bs-col) * 2.5);
    max-width: calc(var(--bs-col) * 2.5);
}

.col-sm-3H {
    flex: 0 0 calc(var(--bs-col) * 3.5);
    max-width: calc(var(--bs-col) * 3.5);
}

.col-sm-4H {
    flex: 0 0 calc(var(--bs-col) * 4.5);
    max-width: calc(var(--bs-col) * 4.5);
}

.col-sm-5H {
    flex: 0 0 calc(var(--bs-col) * 5.5);
    max-width: calc(var(--bs-col) * 5.5);
}

/* ---------- MD (≥768px) ---------- */
@media (min-width:768px) {
    .col-md-H {
        flex: 0 0 calc(var(--bs-col) * 0.5);
        max-width: calc(var(--bs-col) * 0.5);
    }

    .col-md-1H {
        flex: 0 0 calc(var(--bs-col) * 1.5);
        max-width: calc(var(--bs-col) * 1.5);
    }

    .col-md-2H {
        flex: 0 0 calc(var(--bs-col) * 2.5);
        max-width: calc(var(--bs-col) * 2.5);
    }

    .col-md-3H {
        flex: 0 0 calc(var(--bs-col) * 3.5);
        max-width: calc(var(--bs-col) * 3.5);
    }

    .col-md-4H {
        flex: 0 0 calc(var(--bs-col) * 4.5);
        max-width: calc(var(--bs-col) * 4.5);
    }

    .col-md-5H {
        flex: 0 0 calc(var(--bs-col) * 5.5);
        max-width: calc(var(--bs-col) * 5.5);
    }
}

/* ---------- LG (≥992px) ---------- */
@media (min-width:992px) {
    .col-lg-H {
        flex: 0 0 calc(var(--bs-col) * 0.5);
        max-width: calc(var(--bs-col) * 0.5);
    }

    .col-lg-1H {
        flex: 0 0 calc(var(--bs-col) * 1.5);
        max-width: calc(var(--bs-col) * 1.5);
    }

    .col-lg-2H {
        flex: 0 0 calc(var(--bs-col) * 2.5);
        max-width: calc(var(--bs-col) * 2.5);
    }

    .col-lg-3H {
        flex: 0 0 calc(var(--bs-col) * 3.5);
        max-width: calc(var(--bs-col) * 3.5);
    }

    .col-lg-4H {
        flex: 0 0 calc(var(--bs-col) * 4.5);
        max-width: calc(var(--bs-col) * 4.5);
    }

    .col-lg-5H {
        flex: 0 0 calc(var(--bs-col) * 5.5);
        max-width: calc(var(--bs-col) * 5.5);
    }
}

/* ---------- XL (≥1200px) ---------- */
@media (min-width:1200px) {
    .col-xl-H {
        flex: 0 0 calc(var(--bs-col) * 0.5);
        max-width: calc(var(--bs-col) * 0.5);
    }

    .col-xl-1H {
        flex: 0 0 calc(var(--bs-col) * 1.5);
        max-width: calc(var(--bs-col) * 1.5);
    }

    .col-xl-2H {
        flex: 0 0 calc(var(--bs-col) * 2.5);
        max-width: calc(var(--bs-col) * 2.5);
    }

    .col-xl-3H {
        flex: 0 0 calc(var(--bs-col) * 3.5);
        max-width: calc(var(--bs-col) * 3.5);
    }

    .col-xl-4H {
        flex: 0 0 calc(var(--bs-col) * 4.5);
        max-width: calc(var(--bs-col) * 4.5);
    }

    .col-xl-5H {
        flex: 0 0 calc(var(--bs-col) * 5.5);
        max-width: calc(var(--bs-col) * 5.5);
    }
}

/* ---------- XXL (≥1400px) ---------- */
@media (min-width:1400px) {
    .col-xxl-H {
        flex: 0 0 calc(var(--bs-col) * 0.5);
        max-width: calc(var(--bs-col) * 0.5);
    }

    .col-xxl-1H {
        flex: 0 0 calc(var(--bs-col) * 1.5);
        max-width: calc(var(--bs-col) * 1.5);
    }

    .col-xxl-2H {
        flex: 0 0 calc(var(--bs-col) * 2.5);
        max-width: calc(var(--bs-col) * 2.5);
    }

    .col-xxl-3H {
        flex: 0 0 calc(var(--bs-col) * 3.5);
        max-width: calc(var(--bs-col) * 3.5);
    }

    .col-xxl-4H {
        flex: 0 0 calc(var(--bs-col) * 4.5);
        max-width: calc(var(--bs-col) * 4.5);
    }

    .col-xxl-5H {
        flex: 0 0 calc(var(--bs-col) * 5.5);
        max-width: calc(var(--bs-col) * 5.5);
    }
}
.wide-textarea {
    min-width: 100%;
}
.fontControl {
    font-size: 12px;
    height: 50%;
    padding: 5px;
}

.suggestions {
    border: 1px solid #ccc;
    max-width: 200px;
    position: absolute;
    background: #fff;
    display: none;
    z-index: 1000;
}

    .suggestions div {
        padding: 8px;
        cursor: pointer;
    }

        .suggestions div:hover {
            background: #f0f0f0;
        }

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    cursor: not-allowed;
    background-color: #eee !important;
    opacity: 1;
}

.disabled {
    cursor: not-allowed;
    background-color: #eee !important;
    opacity: 1;
}

/* Highlight mandatory controls */
.required.form-control,
.required.form-select,
.required input,
.required select,
.required textarea {
    border-color: #e63946 !important;
    box-shadow: 0 0 3px rgba(230,57,70,.4);
}

.required:focus {
    border-color: #d90429 !important;
    box-shadow: 0 0 4px rgba(217,4,41,.45);
}

label.required::after {
    content: " *";
    color: #e63946;
    font-weight: bold;
}

select option-bold {
    font-weight: 600; /* or bold */
}

.form-check-input[type="radio"] {
    border: 2px solid #333; /* Thicker, darker border */
    width: 15px;
    height: 15px;
}

.form-check-input:focus {
    box-shadow: 0 0 0 3px rgba(13,110,253,.3);
    border-color: #0d6efd;
}

/* Highlight mandatory controls */
.required.form-control,
.required.form-select,
.required input,
.required select,
.required textarea {
    border-color: #e63946 !important;
    box-shadow: 0 0 3px rgba(230,57,70,.4);
}

.required:focus {
    border-color: #d90429 !important;
    box-shadow: 0 0 4px rgba(217,4,41,.45);
}

label.required::after {
    content: " *";
    color: #e63946;
    font-weight: bold;
}

select option-bold {
    font-weight: 600; /* or bold */
}

.form-check-input[type="radio"] {
    border: 2px solid #333; /* Thicker, darker border */
    width: 14px;
    height: 14px;
    font-weight: 800;
    font-size: 1rem;
    font-family: Calibri,sans-serif;
}

.form-check-input:focus {
    box-shadow: 0 0 0 3px rgba(13,110,253,.3);
    border-color: #0d6efd;
}



/*form compact*/

/*.form-compact {
    --fz: .875rem;*/ /* base text 14px */
    /*--fz-sm: .75rem;*/ /* labels 12px */
    /*--pad-y: .3rem;*/ /* input padding */
    /*--pad-x: .5rem;
}

    .form-compact .form-label {*/
        /*font-size: var(--fz-sm);*/
        /*margin-bottom: .15rem;
        font-weight: 600;
        font-size: .95rem;
        font-family: Calibri,sans-serif;
    }

    .form-compact, .form-compact .form-control, .form-compact .form-select {
        font-size: var(--fz);
    }

        .form-compact .form-control,
        .form-compact .form-select {
            padding: var(--pad-y) var(--pad-x);
            height: auto;
            border: 1px solid #b6beca;
            box-shadow: inset 0 1px 1px rgba(0,0,0,.04);
            background-color: #ffffff;
            width: 100% !important;
            max-width: 100%;
            box-sizing: border-box;
            text-transform: uppercase;
        }

        .form-compact .input-group-text {
            padding: var(--pad-y) var(--pad-x);
            font-size: var(--fz);
        }*/


:root {
    --ui-font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Inter", sans-serif;
    --input-bg: #ffffff;
    --input-border: #c8d0dd; /* softer neutral border */
    --input-border-focus: #6ca0ff; /* subtle blue focus */
    --input-text: #222831; /* dark, not full-black */
    --input-placeholder: #6c757d; /* muted placeholder */
    --input-radius: 6px;
    --input-padding-y: .4rem;
    --input-padding-x: .55rem;
}

/* Apply elegant font + smoothing to compact form controls */
.form-compact,
.form-compact .form-control,
.form-compact .form-select,
.form-compact input,
.form-compact textarea {
    font-family: var(--ui-font-stack);
    font-size: .95rem; /* slightly larger for readability */
    line-height: 1.35;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--input-text);
    letter-spacing: 0.01em; /* tiny tracking for cleaner look */
    text-transform: none !important; /* remove uppercase forcing */
    
}

    /* Input / select base style */
    .form-compact .form-control,
    .form-compact .form-select {
        padding: var(--input-padding-y) var(--input-padding-x);
        height: auto;
        /*border: 1px solid var(--input-border);*/
        border: 1px solid #00000052;
        border-radius: var(--input-radius);
        background-color: var(--input-bg);
        box-shadow: inset 0 1px 2px rgba(15,20,30,0.03);
        transition: border-color .15s ease, box-shadow .15s ease, transform .08s ease;
        outline: none;
        width: 100% !important;
        box-sizing: border-box;
    }

        /* Focus state: clear and accessible */
        .form-compact .form-control:focus,
        .form-compact .form-select:focus {
            border-color: var(--input-border-focus);
            box-shadow: 0 0 0 0.18rem rgba(108,160,255,0.16);
            transform: translateY(-0.5px);
        }

        /* Placeholder style */
        .form-compact .form-control::placeholder,
        .form-compact .form-select::placeholder {
            color: var(--input-placeholder);
            opacity: 1;
            font-weight: 400;
            text-transform: none;
        }

.custom-agntcharges-modal {
    max-width: 50%;
}

@media (max-width: 768px) {
    .custom-agntcharges-modal {
        max-width: 100%;
        margin: 0;
    }
}

/* Keep your required red highlight but make it consistent with soft radius */
.required.form-control,
.required.form-select,
.required input,
.required textarea {
    border-color: #e63946 !important;
    box-shadow: 0 0 0 0.12rem rgba(230,57,70,.12);
    border-radius: var(--input-radius);
}

/* A small fix for the tiny input text in the header/labels */
.form-compact .form-label {
    font-weight: 600;
    font-size: .8rem;
    text-transform: none; /* keep labels readable, not all caps */
}



/* Optional: reduce uppercase usage site-wide in this compact form to avoid shouting */
.form-compact * {
    text-transform: none !important;
}

/* Radios: keep earlier custom style but tightened */
.form-check-input[type="radio"] {
    border: 2px solid #333;
    width: 16px;
    height: 16px;
}



        .form-compact .card {
            border-radius: .4rem;
            border: 1px solid #d5d8de;
            box-shadow: 0 1px 3px rgba(0,0,0,.06);
        }

        .form-compact .card-header {
            /*background: linear-gradient(90deg, #004A96, #0071CE, #26C6DA);
            color: #fff;
            font-weight: 800;*/
            /*background: linear-gradient(90deg, #004A96 0%,*/ /* dark blue */
            /*#0071CE 35%,*/ /* mid blue */
            /*#26C6DA 70%,*/ /* cyan */
            /*#2ecc71 100%*/ /* soft green */
            /*);
            color: #fff;*/

            background: linear-gradient(90deg, #004A96 0%, #0071CE 25%, #26C6DA 50%, #00b347 100% );
            color: #fff;

            font-weight: 600;
            /*background: linear-gradient(90deg, #004A96, #0071CE, #26C6DA);
            color: #fff;
            font-weight: 800;*/
            font-family: 'Times New Roman', Times, serif;
            font-size: 1.1rem;
        }

        .form-compact .card-body {
            padding: .6rem;
        }

        .form-compact .row > [class*="col"] {
            margin-bottom: .5rem;
        }

        .form-compact .table-sm td, .form-compact .table-sm th {
            padding: .35rem .5rem;
        }

        
.sticky-ops {
    position: sticky;
    top: 1rem;
}

/* Print: fit to 1–1.5 pages and avoid orphans */
@media print {
    body {
        zoom: 90%;
    }

    .card {
        page-break-inside: avoid;
    }

    .navbar, .nav, .btn, .sticky-ops {
        display: none !important;
    }
}

.Auto {
    
    border: 1px solid #5A8AD1 !important;
    /*font-weight: 800 !important;*/ /* Bold font */
}

.yellow-bulb {
    color: #facc15;
    font-size: 18px;
    text-shadow: 0 0 6px rgba(250, 204, 21, 0.7);
}

.fw-bold_s {
    margin-left: 10px;
    font-size: 13px;
    font-style: italic;
}

/*styling the drag & drop upload awb files*/
/* Drop zone */
.drop-zone {
    border: 2px dashed #0d6efd;
    border-radius: 10px;
    padding: 10px 10px;
    text-align: center;
    background: #f8fbff;
    cursor: pointer;
    transition: all .25s ease;
}

    /* Drag hover */
    .drop-zone.drag-over {
        background: #eef5ff;
        border-color: #0a58ca;
        transform: scale(1.01);
    }

    /* Icon */
    .drop-zone i {
        font-size: 36px;
        color: #0d6efd;
        margin-bottom: 10px;
    }

/* File info box */
.file-info {
    margin-top: 15px;
    padding: 10px;
    border-radius: 6px;
    background: #f1f5f9;
    display: none;
    justify-content: space-between;
    align-items: center;
}

.file-name {
    font-size: 14px;
    font-weight: 500;
}

.remove-file {
    cursor: pointer;
    color: #dc3545;
    font-size: 18px;
}

.ocr-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255,255,255,0.95);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.ocr-box {
    width: 350px;
    text-align: center;
}

#ocrStatus {
    font-size: 14px;
    color: #666;
}


.scanner-container {
    position: relative;
    width: 100%;
    height: 350px;
    overflow: hidden;
    border: 1px solid #ddd;
}

/* pdf preview */
/*#pdfPreview {
    width: 100%;
    height: 100%;
    border: none;
}*/

/* scanning glow */
#scannerGlow {
    position: absolute;
    left: 0;
    top: -80px;
    width: 100%;
    height: 80px;
    background: linear-gradient( to bottom, rgba(0,255,255,0), rgba(0,255,255,0.35), rgba(0,255,255,0) );
    box-shadow: 0 0 20px rgba(0,255,255,0.6);
    animation: scanGlow 3s linear infinite;
    pointer-events: none;
    z-index: 10; /* VERY IMPORTANT */

    display: none;
}

@keyframes scanGlow {

    0% {
        top: -80px;
    }

    100% {
        top: 100%;
    }
}

.ocr-status {
    font-size: 13px;
    color: #666;
    margin-bottom: 5px;
}

/* Highlight rows in grid.*/
.awb-issued-row {
    background-color: #ffe5b4 !important; 
    color: #000;
}
/* Text colour change*/
.status-active {
    color: green;
    font-weight: 600;
}

.status-inactive {
    color: red;
    font-weight: 600;
}
/*bold column in grid*/
.bold-cell {
    font-weight: bold;
}
/* End of CustomBootstrap.css */