/* =========================================
   1. GLOBAL STYLES (Parent - આખા સાઈટ માટે)
   ========================================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}

body {
    background-color: #f8f9fa; /* નોર્મલ પેજ માટે હળવો કલર */
    color: #333;
}

/* કોમન બટન સ્ટાઈલ જે ગમે ત્યાં વાપરી શકાય */
.btn-primary {
    background-color: #4e73df;
    color: #fff;
    padding: 12px 20px;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.btn-primary:hover {
    background-color: #2e59d9;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

.link-secondary {
    color: #6c757d;
    text-decoration: none;
    font-size: 13px;
    transition: 0.2s;
}

.link-secondary:hover {
    color: #4e73df;
}

/* =========================================
   2. LOGIN PAGE SPECIFIC (Child - ફક્ત લોગિન માટે)
   ========================================= */

/* જ્યારે બોડીમાં આ ક્લાસ હોય ત્યારે જ આ ડિઝાઈન લાગુ પડશે */
.login-page-body {
    background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), 
                url('https://images.unsplash.com/photo-1469854523086-cc02fe5d8800?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80');
    background-size: cover;
    background-position: center;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.login-card-container {
    width: 100%;
    max-width: 420px;
    padding: 15px;
}

.login-card {
    background: rgba(255, 255, 255, 0.95);
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

.login-header h2 {
    color: #222;
    font-size: 26px;
    margin-bottom: 20px;
}

.login-header p {
    font-size: 14px;
    color: #666;
    margin-bottom: 35px;
}

/* ઇનપુટ એનિમેશન */
.input-field-group {
    position: relative;
    margin-bottom: 25px;
    border-bottom: 2px solid #ddd;
}
/* ઓટોફિલ વખતે બેકગ્રાઉન્ડ કલર સફેદ રાખવા માટે */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
    -webkit-text-fill-color: #333 !important;
}

/* જ્યારે બ્રાઉઝર ઓટોફિલ કરે ત્યારે લેબલને ઉપર મોકલવા માટે */
input:-webkit-autofill ~ label {
    top: -15px !important;
    font-size: 12px !important;
    color: #4e73df !important;
    font-weight: 600 !important;
}
.input-field-group input {
    width: 100%;
    padding: 10px 0;
    background: none;
    border: none;
    outline: none;
    font-size: 16px;
}

.input-field-group label {
    position: absolute;
    top: 10px;
    left: 0;
    color: #999;
    pointer-events: none;
    transition: 0.3s ease all;
}

/* ઇનપુટ ફોકસ થાય ત્યારે લેબલ ઉપર જશે */
.input-field-group input:focus ~ label,
.input-field-group input:valid ~ label {
    top: -15px;
    font-size: 12px;
    color: #4e73df;
    font-weight: 600;
}

.input-field-group input:focus {
    border-bottom: 2px solid #4e73df;
}

.login-full-width {
    width: 100%;
    margin-top: 10px;
}

.form-footer {
    margin-top: 25px;
    font-size: 14px;
    display: flex;
    justify-content: space-around;
    align-items: center;
}


/* --- Navigation Wrapper --- */
.main-header {
    background: #ffffff;
    box-shadow: 0 2px 15px rgba(0,0,0,0.1);
    position: sticky;
    top: 0;
    z-index: 9999;
}

/* લોગો અને મેનુને નીચે લાવવા માટે ફ્લેક્સ ડાયરેક્શન બદલ્યું */
.nav-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column; /* લોગો ઉપર, મેનુ નીચે */
    align-items: center;
    padding: 10px 0;
}

.logo {
    padding-bottom: 10px;
    width: 100%;
    text-align: center;
}

.logo a {
    font-size: 26px;
    font-weight: 700;
    color: #333;
    text-decoration: none;
}
.logo span { color: #4e73df; }

/* Main Menu Items */
.main-menu {
    list-style: none;
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
}

.main-menu > li > a {
    display: block;
    padding: 12px 18px;
    color: #444;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    transition: 0.3s;
}

.main-menu > li:hover > a {
    color: #4e73df;
}

/* --- Dropdown Logic (The Fix) --- */

.submenu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%); /* મેનુને બરાબર વચ્ચે રાખવા */
    background: #fff;
    min-width: 220px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    display: none;
    padding: 10px;
    border-radius: 8px;
    border-top: 3px solid #4e73df;
}

.dropdown:hover > .submenu {
    display: block;
}
li.dropdown {
    position: relative;
}
/* Reports અને Quick જેવા લાંબા મેનુ માટે 2 કોલમ ગ્રીડ */
.dropdown:nth-last-child(2) .submenu, /* Reports માટે */
.dropdown:nth-child(2) .submenu {     /* Quick માટે */
    min-width: 500px;
    display: none; 
    grid-template-columns: 1fr 1fr; /* બે કોલમ */
    gap: 5px 20px;
}

.dropdown:hover:nth-last-child(2) .submenu,
.dropdown:hover:nth-child(2) .submenu {
    display: grid; /* હોવર પર ગ્રીડ દેખાશે */
}

.submenu li {
    list-style: none;
}

.submenu li a {
    display: block;
    padding: 8px 12px;
    font-size: 13px;
    color: #555;
    text-decoration: none;
    border-radius: 4px;
}

.submenu li a:hover {
    background: #f1f4fb;
    color: #4e73df;
}

/* Inner Submenu (Accounts/Tours) */
.has-inner { position: relative; }
.inner-submenu {
    position: absolute;
    left: 100%;
    top: 0;
    background: #fff;
    min-width: 180px;
    display: none;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    padding: 10px;
    border-radius: 5px;
}

.has-inner:hover > .inner-submenu {
    display: block;
}

/* Logout Styling */
.logout-btn { color: #e74a3b !important; }
.logout-btn:hover { background: #fff1f0; }

/* Hide default mobile menu stuff on desktop */
.menu-btn, .menu-icon { display: none; }

/* =========================================
   3. ADD PAX PAGE (Child - ફોર્મ ડિઝાઈન માટે)
   ========================================= */

/* --- Add Pax New Professional Look --- */
.main-content-wrapper {
    background-color: #f4f7f6;
    padding: 30px 10px;
    display: flex;
    justify-content: center;
}

.form-card {
    background: #ffffff;
    width: 100%;
    max-width: 1100px;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    overflow: hidden;
}

.form-header-banner {
    background: #4e73df;
    padding: 15px 25px;
    color: #ffffff;
}

.pax-form-body { padding: 25px; }

.section-head {
    background: #f8f9fc;
    padding: 8px 15px;
    color: #4e73df;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    margin: 20px 0 15px 0;
    border-left: 4px solid #4e73df;
}

.pax-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}

.pax-input-group { display: flex; flex-direction: column; }
.pax-input-group.full-width { grid-column: 1 / -1; }

.pax-input-group label {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 5px;
    color: #444;
}

.pax-input-group input, 
.pax-input-group select, 
.pax-input-group textarea {
    padding: 10px;
    border: 1px solid #d1d3e2;
    border-radius: 6px;
    font-size: 14px;
}

.pax-input-group input:focus {
    border-color: #4e73df;
    outline: none;
    box-shadow: 0 0 5px rgba(78, 115, 223, 0.2);
}

.gender-selection {
    display: flex;
    gap: 15px;
    font-size: 14px;
    padding-top: 10px;
}

.form-footer-btns {
    margin-top: 30px;
    display: flex;
    gap: 10px;
    border-top: 1px solid #eee;
    padding-top: 20px;
}

.btn-save {
    background: #4e73df;
    color: #fff;
    border: none;
    padding: 12px 30px;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
}

.btn-clear {
    background: #858796;
    color: #fff;
    border: none;
    padding: 12px 30px;
    border-radius: 6px;
    cursor: pointer;
}

.pax-success-msg {
    background: #d4edda;
    color: #155724;
    padding: 10px;
    text-align: center;
    border-radius: 5px;
    margin: 10px;
}

.form-footer-btns {
    margin-top: 30px;
    display: flex;
    gap: 15px; /* બન્ને બટન વચ્ચે જગ્યા */
    border-top: 1px solid #eee;
    padding-top: 20px;
    width: 100%;
}

.btn-save, .btn-clear {
    flex: 1; /* આ લાઈનથી બન્ને બટન સરખા ભાગે વહેંચાઈ જશે */
    padding: 12px 0px;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    border: none;
    text-align: center;
    font-size: 16px;
}

.btn-save {
    background: #4e73df;
    color: #fff;
}

.btn-clear {
    background: #858796;
    color: #fff;
}

/* મોબાઈલ વ્યુમાં બટન એકની નીચે એક આવી જશે */
@media (max-width: 600px) {
    .form-footer-btns {
        flex-direction: column;
    }
}


/* --- Compact DIV Based MIS Report --- */
.mis-container {
    max-width: 1000px; /* Container થોડું નાનું કર્યું */
    margin: 10px auto;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.tour-block {
    background: #fff;
    border-radius: 8px; /* બોર્ડર રેડિયસ ઓછી કરી */
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    margin-bottom: 20px; /* ગેપ ઘટાડ્યો */
    overflow: hidden;
    border: 1px solid #d1d3e2;
}

.tour-header {
    background: #4e73df;
    color: white;
    padding: 10px 15px; /* પેડિંગ ઘટાડ્યું */
    font-size: 16px; /* ફોન્ટ નાના કર્યા */
    font-weight: 700;
}

/* Header Row */
.mis-row-header {
    display: grid;
    grid-template-columns: 2.2fr 0.8fr 1fr 1fr 1fr;
    background: #f8f9fc;
    padding: 6px 15px; /* પેડિંગ ઘટાડ્યું */
    border-bottom: 1px solid #e3e6f0;
    font-weight: 700;
    color: #333;
    font-size: 11px; /* હેડર ફોન્ટ નાના કર્યા */
    text-transform: uppercase;
}

/* Data Row Styling */
.mis-data-row {
    display: grid;
    grid-template-columns: 2.2fr 0.8fr 1fr 1fr 1fr;
    padding: 6px 15px; /* રો ની હાઇટ ઘટાડવા માટે પેડિંગ ઓછું કર્યું */
    border-bottom: 1px solid #f1f4fb;
    align-items: center;
    font-size: 13px; /* મેઈન ડેટા ફોન્ટ સાઈઝ ઘટાડી */
}

.mis-data-row:hover {
    background: #f8f9fc;
}

/* Office & Zone Strips */
.office-strip {
    background: #eaecf4;
    padding: 5px 15px;
    font-weight: 700;
    font-size: 12px;
    color: #444;
    border-left: 4px solid #4e73df;
}

.zone-strip {
    background: #f4f6ff;
    padding: 4px 30px; /* લેફ્ટ માર્જિન ઓછું કર્યું */
    font-weight: 600;
    color: #2e59d9;
    font-size: 12px;
    border-bottom: 1px solid #e3e6f0;
}

/* Overall Total Row */
.overall-total {
    background: #f0f2f9;
    font-weight: 700;
    color: #111;
}

.amt { 
    text-align: right; 
    font-family: 'Consolas', monospace; /* નંબરો એક લાઈનમાં દેખાય તે માટે */
    font-size: 12px;
}

.pax-link { 
    font-weight: 700; 
    color: #4e73df; 
    text-decoration: none;
    font-size: 12px;
}

.pax-link:hover {
    text-decoration: underline;
}

/* --- Prospect MIS Specific Grid --- */
.prospect-grid {
    display: grid;
    /* 8 Columns: Area(2.5fr), Statuses(1fr each), Total(1fr) */
    grid-template-columns: 2.5fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    padding: 6px 15px;
    border-bottom: 1px solid #f1f4fb;
    align-items: center;
    font-size: 12px; /* થોડા નાના ફોન્ટ જેથી 8 કોલમ સમાઈ જાય */
}

.prospect-header {
    background: #f8f9fc;
    font-weight: 700;
    color: #4e73df;
    text-transform: uppercase;
    font-size: 10px;
    border-bottom: 2px solid #e3e6f0;
}

.prospect-total-row {
    background: #eef2ff;
    font-weight: 700;
}

.num-center { text-align: center; font-family: 'Consolas', monospace; }

/* --- User Calling MIS Specific Grid --- */
.calling-grid {
    display: grid;
    /* 8 Columns: User(2fr), Statuses(1fr each) */
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    padding: 8px 15px;
    border-bottom: 1px solid #f1f4fb;
    align-items: center;
    font-size: 13px;
}

.calling-header {
    background: #f8f9fc;
    font-weight: 700;
    color: #4e73df;
    text-transform: uppercase;
    font-size: 11px;
    border-bottom: 2px solid #e3e6f0;
}

/* --- Monthly Report Specific --- */
.monthly-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr; /* Month and Count */
    padding: 8px 15px;
    border-bottom: 1px solid #f1f4fb;
    align-items: center;
    font-size: 13px;
}

.monthly-header {
    background: #f8f9fc;
    font-weight: 700;
    color: #4e73df;
    text-transform: uppercase;
    font-size: 11px;
    border-bottom: 2px solid #e3e6f0;
}

.month-name {
    font-weight: 600;
    color: #333;
}

.lead-count {
    text-align: right;
    font-family: 'Consolas', monospace;
    font-weight: 700;
    color: #4e73df;
}

.total-summary {
    background: #4e73df;
    color: white;
    padding: 10px 15px;
    font-weight: 700;
    display: flex;
    justify-content: space-between;
}

/* --- Upload Page Specific --- */
.upload-card {
    background: white;
    max-width: 500px;
    margin: 30px auto;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    text-align: center;
    border: 1px solid #e3e6f0;
}

.file-input-wrapper {
    border: 2px dashed #d1d3e2;
    padding: 30px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    background: #f8f9fc;
    transition: 0.3s;
}

.file-input-wrapper:hover {
    border-color: #4e73df;
    background: #f0f2f9;
}

.btn-upload {
    background: #4e73df;
    color: white;
    border: none;
    padding: 10px 25px;
    border-radius: 5px;
    font-weight: 700;
    cursor: pointer;
    width: 100%;
}

.result-box {
    margin-top: 15px;
    padding: 10px;
    border-radius: 5px;
    font-size: 14px;
    text-align: left;
}
/* --- Custom File Upload Styling --- */
.file-upload-wrapper {
    position: relative;
    margin-bottom: 25px;
}

/* અસલી બટન ને છુપાવવા માટે */
.file-upload-wrapper input[type="file"] {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 2;
}

/* આપણું નવું કસ્ટમ બટન */
.custom-file-label {
    display: block;
    background: #f8f9fc;
    border: 2px dashed #d1d3e2;
    padding: 30px 20px;
    border-radius: 10px;
    color: #4e73df;
    font-weight: 600;
    transition: all 0.3s ease;
    text-align: center;
    cursor: pointer;
}

.file-upload-wrapper:hover .custom-file-label {
    background: #f0f2f9;
    border-color: #4e73df;
    transform: translateY(-2px);
}

.upload-icon {
    font-size: 30px;
    display: block;
    margin-bottom: 10px;
}

/* ફાઈલ સિલેક્ટ થયા પછી નામ બતાવવા માટે (Optional JS) */
.file-name-display {
    display: block;
    margin-top: 10px;
    font-size: 12px;
    color: #1cc88a;
    font-weight: bold;
}

/* --- Manager Dashboard Professional Look --- */
.mngr-main-container {
    padding: 20px;
    background-color: #f8f9fc; /* થોડો વ્હાઇટ-બ્લુ શેડ */
}

/* Professional Header Banner */
.mngr-header-banner {
    background: linear-gradient(45deg, #4e73df 0%, #224abe 100%);
    color: white;
    padding: 18px 25px;
    border-radius: 8px 8px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.mngr-header-banner h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

/* Filter Card - Better Spacing */
.mngr-filter-card {
    background: white;
    padding: 25px;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    margin-bottom: 25px;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    align-items: flex-end;
    border: 1px solid #e3e6f0;
    border-top: none;
}

.mngr-filter-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mngr-filter-group label {
    font-size: 11px;
    font-weight: 800;
    color: #4e73df;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.mngr-filter-control {
    padding: 10px 12px;
    border: 1px solid #d1d3e2;
    border-radius: 6px;
    font-size: 14px;
    color: #6e707e;
    transition: border-color 0.2s;
    outline: none;
}

.mngr-filter-control:focus {
    border-color: #4e73df;
    box-shadow: 0 0 0 0.2rem rgba(78, 115, 223, 0.1);
}

/* Buttons Styling */
.btn-mngr-primary {
    background-color: #4e73df;
    color: white !important;
    border: none;
    padding: 10px 22px;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    font-size: 14px;
}

.btn-mngr-primary:hover {
    background-color: #2e59d9;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(78,115,223,0.3);
}

.btn-mngr-secondary {
    background-color: #f8f9fc;
    color: #4e73df;
    border: 1px solid #d1d3e2;
    padding: 10px 20px;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    font-size: 14px;
    transition: all 0.2s;
}

.btn-mngr-secondary:hover {
    background-color: #eaecf4;
    color: #2e59d9;
}

/* Lead Grid Design */
.mngr-lead-grid {
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    border: 1px solid #e3e6f0;
}

.mngr-grid-row {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr 1.2fr 1fr 0.8fr;
    border-bottom: 1px solid #f1f4fb;
    align-items: center;
    transition: background 0.2s;
}

/* Customer Name ને નોર્મલ ડાર્ક કલર આપવા માટે */
.mngr-grid-row .grid-cell-name {
    font-weight: 700;
    color: #3a3b45; /* બ્લુ ને બદલે ડાર્ક ગ્રે/બ્લેક */
    font-size: 14px;
}

.mngr-grid-header {
    background: #f8f9fc;
    border-bottom: 2px solid #e3e6f0;
    color: #4e73df;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.8px;
}

.mngr-grid-cell {
    padding: 15px 18px;
    font-size: 13.5px;
    color: #5a5c69;
}

.mngr-grid-row:hover {
    background-color: #f4f6ff; /* Hover પર લાઈટ બ્લુ ઈફેક્ટ */
}

/* Status Badges - Rounded & Modern */
.mngr-badge {
    padding: 5px 12px;
    border-radius: 50px; /* સંપૂર્ણ રાઉન્ડ */
    font-size: 10.5px;
    font-weight: 800;
    display: inline-block;
    text-align: center;
    min-width: 85px;
}

.mngr-status-PENDING { background: #fff9e6; color: #f6c23e; border: 1px solid #ffeeba; }
.mngr-status-INFOSENT { background: #e2f5fb; color: #36b9cc; border: 1px solid #bee5eb; }
.mngr-status-POSITIVE { background: #e6f9f0; color: #1cc88a; border: 1px solid #c3e6cb; }
.mngr-status-CLOSE { background: #ffebee; color: #e74a3b; border: 1px solid #f5c6cb; }
.mngr-status-DEFAULT { background: #f8f9fc; color: #858796; border: 1px solid #d1d3e2; }

/* --- Display PAX Search Box & Results Style --- */

.pax-search-container {
    width: 95%;
    max-width: 1200px;
    margin: 20px auto;
    background: #fff;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.pax-search-container h2 {
    color: #2c3e50;
    font-size: 1.5rem;
    margin-bottom: 20px;
    border-bottom: 2px solid #f1f1f1;
    padding-bottom: 10px;
}

.pax-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px;
    align-items: end;
}

.pax-form-group {
    display: flex;
    flex-direction: column;
}

.pax-form-group label {
    font-weight: 600;
    margin-bottom: 5px;
    color: #555;
    font-size: 14px;
}

.pax-form-group select, 
.pax-form-group input {
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
    outline: none;
}

.pax-form-group select:focus, 
.pax-form-group input:focus {
    border-color: #4e73df;
}

/* Results Table Card Style */
.pax-results-wrapper {
    width: 95%;
    max-width: 1200px;
    margin: 20px auto;
    overflow-x: auto; /* For Mobile Swipe */
}

.pax-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.pax-table thead {
    background: #4e73df;
    color: white;
}

.pax-table th {
    padding: 15px;
    text-align: left;
    font-weight: 500;
}

.pax-table td {
    padding: 12px 15px;
    border-bottom: 1px solid #eee;
    font-size: 13.5px;
}

/* Alternate Row Colors */
.pax-row-group-odd { background-color: #ffffff; }
.pax-row-group-even { background-color: #f8f9fc; }

.pax-action-icons img {
    transition: transform 0.2s;
    margin-right: 5px;
}

.pax-action-icons img:hover {
    transform: scale(1.2);
}

.pax-badge {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
}

/* Mobile Responsive Adjustments */
@media screen and (max-width: 768px) {
    .pax-table thead { display: none; } /* Hide header on mobile if needed */
    .pax-table td {
        display: block;
        text-align: right;
        border-bottom: 1px solid #ddd;
    }
    .pax-table td::before {
        content: attr(data-label);
        float: left;
        font-weight: bold;
    }
}

/* --- PAX Table Professional Styles --- */

/* એડ્રેસને ૨ લાઈન પછી કટ (Truncate) કરવા માટે */
.address-text {
    display: -webkit-box;
    -webkit-line-clamp: 2; /* ૨ લાઈન પછી ઓટોમેટિક '...' આવશે */
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 12.5px;
    color: #666;
    line-height: 1.5;
    margin-top: 5px;
    max-width: 280px; /* કોલમની પહોળાઈ નિયંત્રિત કરવા માટે */
}

/* એક્શન બટન્સનો લુક (તમારા સ્ક્રીનશોટ મુજબ ફિક્સ) */
.action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    margin: 0 3px;
    transition: all 0.3s ease;
    text-decoration: none;
    font-size: 14px;
    background-color: #fff;
}

/* View Button - Blue */
.btn-view {
    border: 1px solid #4e73df;
    color: #4e73df;
}
.btn-view:hover {
    background-color: #4e73df;
    color: #fff;
}

/* Edit Button - Yellow/Orange */
.btn-edit {
    border: 1px solid #f6c23e;
    color: #f6c23e;
}
.btn-edit:hover {
    background-color: #f6c23e;
    color: #fff;
}

/* Print Button - Green */
.btn-print {
    border: 1px solid #1cc88a;
    color: #1cc88a;
}
.btn-print:hover {
    background-color: #1cc88a;
    color: #fff;
}

/* ટેબલ રો (Row) પર હોવર ઇફેક્ટ */
.pax-table-row:hover {
    background-color: #f1f4fb !important;
}

/* મોબાઈલ માટે રિસ્પોન્સિવ ટેબલ કન્ટેનર */
.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
}

/* --- Left Menu / Booking Status Dashboard Styles --- */

.booking-dashboard {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 10px;
    background-color: #f8f9fc;
}

/* Card Container */
.status-card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    overflow: hidden;
    border-left: 4px solid #4e73df; /* Side accent */
}

/* Header Styling */
.status-header {
    background: #f8f9fc;
    color: #4e73df;
    padding: 10px 15px;
    font-weight: bold;
    font-size: 13px;
    text-transform: uppercase;
    border-bottom: 1px solid #e3e6f0;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Table Styling */
.status-table {
    width: 100%;
    border-collapse: collapse;
}

.status-table td {
    padding: 8px 15px;
    border-bottom: 1px solid #f8f9fc;
    font-size: 13px;
    color: #5a5c69;
}

.status-table tr:last-child td {
    border-bottom: none;
}

/* Data Alignment */
.status-table td:last-child {
    text-align: right;
    font-weight: 700;
    color: #333;
}

/* Section Dividers (Month/Target) */
.month-row {
    background-color: #eaecf4;
    font-weight: bold !important;
    color: #4e73df !important;
    font-size: 11px !important;
    text-align: center !important;
    text-transform: uppercase;
}

/* Status Colors */
.text-success { color: #1cc88a !important; }
.text-danger { color: #e74a3b !important; }

/* Tour Specific Header */
.tour-card {
    border-left: 4px solid #1cc88a;
}
.tour-card .status-header {
    color: #1cc88a;
}

/* Dashboard Task Container - Compact Version */
/* Container Wrapper */
.task-wrapper {
    margin: 5px 0;
    font-family: 'Segoe UI', Arial, sans-serif;
    border: 1px solid #d1d3e2;
    border-radius: 6px;
    background: #fff;
    overflow: hidden;
}

/* Header Row - પાછો Blue કરી દીધો */
.task-header-row {
    display: flex;
    background-color: #4e73df; /* Original Theme Blue */
    color: #ffffff;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

/* Task Data Row */
.task-data-row {
    display: flex;
    align-items: center;
    padding: 6px 12px;
    border-bottom: 1px solid #e3e6f0;
    color: #222; /* Dark Text as requested */
    font-size: 13px;
}

.task-data-row:hover {
    background-color: #f8f9fc;
}

/* Column Widths */
.col-date { flex: 0 0 100px; font-weight: 600; }
.col-details { flex: 1; min-width: 0; padding-right: 10px; }
.col-cat { flex: 0 0 100px; color: #333; }
.col-prio { flex: 0 0 90px; }
.col-action { flex: 0 0 75px; text-align: center; }

/* Priority Badges */
.prio-badge {
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
}
.prio-high { background-color: #ffe5e5; color: #e74a3b; }
.prio-medium { background-color: #fff4e5; color: #f6c23e; }
.prio-low { background-color: #e5f7ed; color: #1cc88a; }

/* Done Button - પાછો Green કરી દીધો */
.btn-task-done {
    background-color: #1cc88a; /* Original Theme Green */
    color: #fff;
    border: none;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 11px;
    cursor: pointer;
    font-weight: 600;
    transition: 0.2s;
}
.btn-task-done:hover {
    background-color: #17a673;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Pagination */
.task-pagination {
    display: flex;
    justify-content: center;
    padding: 10px;
    background: #f8f9fc;
    gap: 5px;
}
.task-pagination a {
    padding: 4px 10px;
    font-size: 12px;
    text-decoration: none;
    color: #4e73df;
    border: 1px solid #dddfeb;
    border-radius: 3px;
    background: #fff;
}
.task-pagination a.active {
    background: #4e73df;
    color: #fff;
}

/* Add Task Container */
.add-task-wrapper {
    background: #fff;
    border: 1px solid #d1d3e2;
    border-radius: 8px;
    overflow: hidden;
    font-family: 'Segoe UI', sans-serif;
    max-width: 350px; /* સાઈડબાર કે ડેશબોર્ડ માટે પરફેક્ટ સાઈઝ */
}

/* Header */
.add-task-header {
    background-color: #4e73df;
    color: white;
    padding: 10px 15px;
    font-size: 13px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
}

/* Form Body */
.add-task-body {
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 10px; /* દરેક ઇનપુટ વચ્ચેની જગ્યા */
}

/* Inputs & Selects */
.task-input {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 13px;
    color: #333;
    box-sizing: border-box; /* Padding થી બોક્સ બહાર ના જાય તે માટે */
}

.task-input:focus {
    border-color: #4e73df;
    outline: none;
    box-shadow: 0 0 5px rgba(78, 115, 223, 0.2);
}

/* Buttons */
.btn-group {
    display: flex;
    gap: 10px;
    margin-top: 5px;
}

.btn-add {
    flex: 2;
    background-color: #1cc88a;
    color: white;
    border: none;
    padding: 10px;
    border-radius: 4px;
    font-weight: bold;
    cursor: pointer;
}

.btn-clear {
    flex: 1;
    background-color: #f8f9fc;
    color: #333;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 4px;
    cursor: pointer;
}

.btn-add:hover { background-color: #17a673; }
.btn-clear:hover { background-color: #eaecf4; }

/* Main Dashboard Container */
.dashboard-container {
    padding: 20px;
    background-color: #f4f7f6;
    min-height: 100vh;
}

/* Flex Row for 3 Columns */
.dashboard-row {
    display: flex;
    flex-wrap: wrap; /* મોબાઈલ માટે સપોર્ટ */
    gap: 15px; /* કોલમ વચ્ચેની જગ્યા */
    align-items: flex-start;
}

/* Column Widths */
.left-col {
    flex: 0 0 250px; /* Booking Status માટે ફિક્સ સાઈઝ */
}

.center-col {
    flex: 1; /* વચ્ચેનું ટેબલ બાકીની બધી જગ્યા લેશે */
    min-width: 400px;
}

.right-col {
    flex: 0 0 320px; /* Add Task ફોર્મ માટે ફિક્સ સાઈઝ */
}

/* Card Styling for each block */
.card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    padding: 5px; /* અંદરની સ્પેસિંગ ઓછી રાખી છે જેથી કોમ્પેક્ટ લાગે */
}

/* Responsive (મોબાઈલ માટે) */
@media (max-width: 992px) {
    .dashboard-row {
        flex-direction: column;
    }
    .left-col, .center-col, .right-col {
        flex: 1 1 100%;
        width: 100%;
    }
}

/* Leg Loader Main Container */
.leg-container {
    display: flex;
    gap: 20px;
    padding: 20px;
    background-color: #f8f9fc;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    min-height: 500px;
}

/* Left Sidebar Tabs */
.leg-tabs {
    flex: 0 0 130px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.tab-btn {
    padding: 12px 15px;
    cursor: pointer;
    border: 1px solid #d1d3e2;
    background: #ffffff;
    color: #4e73df;
    font-weight: 700;
    border-radius: 6px;
    text-align: center;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.tab-btn:hover {
    background-color: #eaecf4;
    border-color: #4e73df;
}

.tab-btn.active {
    background-color: #4e73df;
    color: #ffffff;
    border-color: #4e73df;
    box-shadow: 0 4px 8px rgba(78, 115, 223, 0.3);
}

/* Right Side Form Content */
.leg-form-content {
    flex: 1;
    background: #ffffff;
    padding: 25px;
    border-radius: 10px;
    border: 1px solid #e3e6f0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.leg-section {
    display: none; /* By default બધું છુપાયેલું રહેશે */
    animation: fadeIn 0.4s ease;
}

.leg-section.active {
    display: block; /* જે એક્ટિવ હશે તે જ દેખાશે */
}

/* Form Heading */
.leg-section h3 {
    margin-top: 0;
    color: #333;
    font-size: 18px;
    border-bottom: 2px solid #4e73df;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

/* Grid Layout for Inputs */
.input-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.input-group {
    display: flex;
    flex-direction: column;
}

.input-group label {
    font-size: 12px;
    font-weight: 700;
    color: #5a5c69;
    margin-bottom: 5px;
    text-transform: uppercase;
}

/* Input Styling */
.task-input {
    padding: 10px;
    border: 1px solid #d1d3e2;
    border-radius: 5px;
    font-size: 14px;
    color: #444;
    transition: border-color 0.2s;
}

.task-input:focus {
    border-color: #4e73df;
    outline: none;
    box-shadow: 0 0 5px rgba(78, 115, 223, 0.2);
}

/* Action Button */
.btn-update-leg {
    background-color: #1cc88a;
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    margin-top: 20px;
    transition: background 0.3s;
}

.btn-update-leg:hover {
    background-color: #17a673;
}

/* Status Message Styling */
.status-msg {
    margin-left: 15px;
    font-size: 13px;
    font-weight: 600;
}

/* Simple Animation */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Responsive */
@media (max-width: 768px) {
    .leg-container { flex-direction: column; }
    .leg-tabs { flex-direction: row; flex-wrap: wrap; }
    .input-grid { grid-template-columns: 1fr; }
}


/* ============================================================
   TCV & LOADER MASTER STYLES
   ============================================================ */

/* --- TCV Loader (Left Sidebar & Right Table) --- */
.tour-sidebar-card {
    background: #fff;
    border: 1px solid #d1d3e2;
    border-radius: 5px;
    width: 300px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.tour-header-blue {
    background-color: #5d78ff;
    color: white;
    padding: 12px;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: 5px 5px 0 0;
    font-size: 14px;
    letter-spacing: 1px;
}

.tour-btn {
    display: block;
    margin: 10px;
    padding: 12px;
    text-align: center;
    border: 1px solid #4e73df;
    border-radius: 5px;
    color: #4e73df;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    transition: all 0.3s;
}

.tour-btn:hover, .tour-btn.active {
    background-color: #4e73df;
    color: white;
}

/* --- Right Side Passenger Table --- */
.pax-card {
    background: #fff;
    border: 1px solid #d1d3e2;
    border-radius: 5px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    width: 100%;
}

.pax-header-green {
    background-color: #2ecc71;
    color: white;
    padding: 12px 20px;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
    font-size: 16px;
}

.pax-table {
    width: 100%;
    border-collapse: collapse;
}

.pax-table th {
    background-color: #f8f9fc;
    color: #4e73df;
    text-align: left;
    padding: 12px 15px;
    border-bottom: 2px solid #e3e6f0;
    font-size: 14px;
    text-transform: uppercase;
}

.pax-table td {
    padding: 12px 15px;
    border-bottom: 1px solid #e3e6f0;
    font-size: 14px;
    color: #333;
}

.pax-table tr:hover {
    background-color: #f1f3f9;
}

.btn-tcv {
    background-color: #4e73df;
    color: white;
    padding: 6px 15px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 12px;
    display: inline-block;
    transition: 0.3s;
}

.btn-tcv:hover {
    background-color: #2e59d9;
}

/* --- TCV Voucher Print Layout --- */
.tcv-wrapper {
    background: #ffffff;
    max-width: 850px;
    margin: 20px auto;
    padding: 40px;
    border: 1px solid #e1e1e1;
    color: #333;
    line-height: 1.6;
}

.tcv-title-main {
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    color: #4e73df;
    text-transform: uppercase;
    border-bottom: 2px solid #4e73df;
    padding-bottom: 10px;
    margin-bottom: 30px;
}

.leg-card {
    flex: 1;
    min-width: 380px;
    border: 1px solid #d1d3e2;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 20px;
}

.leg-card-header {
    background: #4e73df;
    color: #ffffff;
    padding: 10px;
    text-align: center;
    font-weight: bold;
}

.leg-row {
    display: flex;
    border-bottom: 1px solid #eee;
    padding: 8px 12px;
}

.leg-label { flex: 1; font-weight: bold; color: #555; }
.leg-value { flex: 2; color: #000; }

@media print {
    .no-print { display: none; }
    .tcv-wrapper { border: none; margin: 0; width: 100%; }
}


/* --- TCV A4 Print Design code start here--- */
.tcv-print-container {
    background: #ffffff;
    max-width: 800px; /* A4 width standard */
    margin: 0 auto;
    padding: 20px;
    font-family: 'Calibri', sans-serif;
    color: #333;
}

.tcv-header-title {
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    color: #4e73df;
    border-bottom: 2px solid #4e73df;
    padding-bottom: 5px;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.tcv-intro-text {
    font-size: 15px;
    margin-bottom: 15px;
    line-height: 1.4;
}

/* 2x2 Grid for Legs */
.tcv-grid-layout {
    display: grid;
    grid-template-columns: 1fr 1fr; /* બે કોલમ */
    gap: 15px;
    margin-bottom: 15px;
}

.leg-box {
    border: 1px solid #ccc;
    border-radius: 6px;
    overflow: hidden;
}

.leg-box-header {
    background: #4e73df;
    color: #fff;
    padding: 6px;
    text-align: center;
    font-weight: bold;
    font-size: 13px;
}

.leg-data-row {
    display: flex;
    border-bottom: 1px solid #eee;
    padding: 5px 10px;
    font-size: 12px;
}

.leg-data-row:last-child { border-bottom: none; }

.leg-key {
    flex: 1;
    font-weight: bold;
    color: #555;
}

.leg-val {
    flex: 1.5;
    color: #000;
}

.tcv-important-note {
    background: #f9f9f9;
    padding: 10px;
    border-left: 4px solid #4e73df;
    font-size: 13px;
    margin-bottom: 15px;
    text-align: justify;
}

.tcv-signature {
    font-size: 14px;
    line-height: 1.5;
}

/* A4 Print Optimization */
@media print {
    @page {
        size: A4;
        /* ઉપર 2.5 ઇંચ (આશરે 6.5cm) જગ્યા લોગો માટે છોડવા માટે */
        margin-top: 1.5in; 
        margin-bottom: 1cm;
        margin-left: 1cm;
        margin-right: 1cm;
    }
    
    body { 
        background: #fff; 
    }
    
    .no-print { 
        display: none; 
    }
    
    .tcv-print-container {
        width: 100%;
        margin: 0;
        padding: 0;
        border: none;
    }
}

/* સ્ક્રીન પર જોતી વખતે પણ થોડી જગ્યા દેખાય તે માટે */
.tcv-print-container {
    background: #ffffff;
    max-width: 800px;
    margin: 30px auto; /* સ્ક્રીન પર ઉપરથી 40px નીચે દેખાશે */
    padding: 20px;
    font-family: 'Calibri', sans-serif;
    color: #333;
}
/* --- TCV A4 Print Design code complete here--- */

/* Money Receipt Wrapper start code here */
.mr-container {
    max-width: 900px;
    margin: 20px auto;
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    font-family: 'Calibri', sans-serif;
}

/* Search Box */
.mr-search-box {
    display: flex;
    gap: 10px;
    justify-content: center;
    background: #f8f9fc;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 25px;
}

.mr-input {
    padding: 8px 12px;
    border: 1px solid #d1d3e2;
    border-radius: 4px;
}

.mr-btn-search {
    background: #4e73df;
    color: white;
    border: none;
    padding: 8px 20px;
    border-radius: 4px;
    cursor: pointer;
}

/* Form Grid System */
.mr-row {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 15px;
}

.mr-col {
    flex: 1;
    min-width: 200px;
}

.mr-label {
    font-weight: bold;
    color: #4e73df;
    display: block;
    margin-bottom: 5px;
    font-size: 14px;
}

.mr-data-box {
    background: #f1f3f9;
    padding: 8px;
    border-radius: 4px;
    min-height: 20px;
    border-bottom: 1px solid #ddd;
}

/* Payment Section */
.mr-payment-card {
    border: 1px solid #e3e6f0;
    padding: 20px;
    border-radius: 8px;
    background: #fff;
    margin-top: 20px;
}

.mr-submit-btn {
    background: #1cc88a;
    color: white;
    border: none;
    padding: 12px 40px;
    border-radius: 5px;
    font-weight: bold;
    cursor: pointer;
    margin-top: 20px;
}

/* Success Message */
.mr-success {
    background: #d4edda;
    color: #155724;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
    text-align: center;
}
/* Money Receipt Wrapper complete code here */

/* Money Receipt Printmr.php Styles */
/* General Body Styles */
.receipt-body {
    background: #fdfdfd;
    margin: 0;
    padding: 0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #333;
}

/* Main Receipt Card */
.receipt-card {
    width: 190mm;
    margin: 50px auto; 
    padding: 20px;
    background: #fff;
    box-sizing: border-box;
}

/* Sections Header */
.receipt-section {
    background: #f8f9fc;
    padding: 8px 12px;
    font-weight: 700;
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 5px;
    border-left: 4px solid #4e73df;
    color: #4e73df;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Flex Rows for Details */
.receipt-info-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0px;
}

.receipt-info-col, .receipt-info-full {
    display: flex;
    align-items: baseline;
    margin-bottom: 7px;
    padding-left: 11px;
}

.receipt-info-col { flex: 1; }
.receipt-info-full { width: 100%; }

/* Label and Value Consistency */
.receipt-label {
    font-size: 13px;
    color: #666;
    min-width: 100px;
    display: inline-block;
}

.receipt-value {
    font-size: 14px;
    font-weight: 600;
    color: #000;
    border-bottom: 1px solid #eee;
    flex: 1;
    padding-bottom: 2px;
}

/* Table Styling */
.receipt-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0px;
}

.receipt-table td {
    padding: 6px;
    border: 1px solid #eaecf4;
    font-size: 13px;
}

.receipt-highlight {
    background-color: #fcfcfc;
    font-weight: 700;
}

/* Specific Row Colors */
.row-success { color: #1cc88a; font-size: 15px !important; }
.row-danger { color: #e74a3b; font-size: 15px !important; }

/* Amount in Words Area */
.amount-word-section {
    padding-top: 10px;
    border-top: 1px dashed #d1d3e2;
    display: flex;
}

.amount-word-value {
    color: #2e59d9;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

/* Footer Styling */
.receipt-footer {
    margin-top: 10px;
    font-size: 11px;
    color: #858796;
    line-height: 1.6;
}

/* --- ACTIONS SECTION (Professional Buttons) --- */
.no-print-actions {
    margin-top: 30px;
    text-align: center;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}

.btn-shared {
    padding: 10px 25px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    transition: all 0.3s ease;
    cursor: pointer;
    border: none;
}

.btn-print-now {
    background: #1cc88a;
    color: white;
    margin-right: 10px;
}

.btn-print-now:hover {
    background: #17a673;
    box-shadow: 0 4px 8px rgba(28, 200, 138, 0.3);
}

.btn-back-manager {
    background: #4e73df;
    color: white;
    box-shadow: 0 4px 6px rgba(78, 115, 223, 0.2);
}

.btn-back-manager:hover {
    background: #2e59d9;
    box-shadow: 0 6px 12px rgba(78, 115, 223, 0.3);
    transform: translateY(-1px);
}

.btn-back-manager i {
    margin-right: 8px;
}

/* Print Styling */
@media print {
    @page {
        margin-top: 3cm !important; 
        margin-bottom: 1cm;
        margin-left: 1cm;
        margin-right: 1cm;
    }

    body {
        margin: 0 !important;
        padding: 0 !important;
    }

    .receipt-card {
        margin-top: 0 !important; 
        padding: 0 !important;
        width: 100% !important;
        box-shadow: none !important;
    }

    .no-print, .no-print-actions {
        display: none !important;
    }
}
/* Money Receipt Printmr.php Styles complete here*/

/* start dispaly Pax Details View Styles */
/* સિમેટ્રિકલ ડિઝાઇન - image_9faed3.png મુજબ */

.pax-container {
    max-width: 1000px;
    margin: 40px auto;
    padding: 0 20px;
    font-family: 'Segoe UI', sans-serif;
}

/* બ્લુ હેડર કાર્ડ */
.pax-header-card {
    background: #4e73df; /* તમારા અપડેટ પેજ જેવો બ્લુ કલર */
    color: white;
    padding: 20px 30px;
    border-radius: 10px 10px 0 0; /* ઉપરના ખૂણા ગોળ */
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pax-header-content h2 { margin: 0; font-size: 22px; font-weight: 600; }
.pax-header-content p { margin: 5px 0 0; font-size: 14px; opacity: 0.9; }

.pax-btn-back {
    background: rgba(255, 255, 255, 0.2);
    color: white;
    text-decoration: none;
    padding: 8px 20px;
    border-radius: 5px;
    font-size: 14px;
    border: 1px solid rgba(255, 255, 255, 0.4);
    transition: 0.3s;
}

.pax-btn-back:hover { background: white; color: #4e73df; }

/* બોડી કાર્ડ */
.pax-body-card {
    background: white;
    padding: 30px;
    border-radius: 0 0 10px 10px; /* નીચેના ખૂણા ગોળ */
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    border: 1px solid #e3e6f0;
    border-top: none;
}

.pax-section-title {
    color: #4e73df;
    border-left: 4px solid #4e73df;
    padding-left: 10px;
    margin-bottom: 20px;
    font-size: 16px;
    text-transform: uppercase;
}

/* સિમેટ્રિકલ ગ્રીડ */
.pax-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* બે કોલમમાં સેટિંગ */
    gap: 25px;
}

.pax-item {
    display: flex;
    flex-direction: column;
}

.pax-item label {
    font-size: 12px;
    color: #858796;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 5px;
}

.pax-item span {
    font-size: 16px;
    color: #3a3b45;
    padding-bottom: 5px;
    border-bottom: 1px solid #f8f9fc;
}

.pax-blue-text { color: #4e73df !important; font-weight: bold; }
.pax-green-text { color: #1cc88a !important; font-weight: bold; }

.pax-footer-info {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px dashed #e3e6f0;
}

.pax-remark { color: #5a5c69; font-size: 14px; margin-bottom: 5px; }
/* complete dispaly Pax Details View Styles */

/*start veiw reports css*/
.report-container {
    padding: 20px;
    max-width: 1200px;
    margin: 0 auto;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.user-section {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    margin-bottom: 30px;
    overflow: hidden;
}

.user-card-header {
    background: #4a90e2;
    color: white;
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.report-grid-header {
    display: grid;
    grid-template-columns: 1fr 3fr 1fr;
    background: #f8f9fa;
    padding: 10px 20px;
    font-weight: bold;
    border-bottom: 1px solid #eee;
}

.report-row {
    display: grid;
    grid-template-columns: 1fr 3fr 1fr;
    padding: 12px 20px;
    border-bottom: 1px solid #f1f1f1;
    align-items: center;
}

.report-row:hover { background: #fafafa; }

.time-tag { color: #666; font-size: 0.9em; }
.activity-text { color: #333; word-break: break-all; }
.score-badge {
    justify-self: start;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.85em;
    font-weight: bold;
}

.score-good { background: #e6fffa; color: #38a169; }
.score-bad { background: #fff5f5; color: #e53e3e; }

.footer-summary {
    background: #fdfae6;
    padding: 15px 20px;
    text-align: right;
    font-weight: bold;
}
/*Complete view reports css*/


/* ==========================================================================
   Dashboard Task Grid Layout Styles (Complete & Synced with PHP)
   ========================================================================== */

/* મેઈન કન્ટેનર */
.task-wrapper {
    background: #fff;
    border: 1px solid #e1e8ed;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* 🔥 ગ્રીડ લોજિક: હેડર અને ડેટા રો બંનેમાં એક સરખું કોલમ સ્ટ્રક્ચર */
.task-header-row, .task-data-row {
    display: grid;
    /* 5 કોલમ: Due Time (1.2), Details (4.5), Category (1.2), Priority (1.2), Action Track (2) */
    grid-template-columns: 1.2fr 4.5fr 1.2fr 1.2fr 2fr; 
    align-items: center;
    padding: 12px 20px;
}

/* હેડર રો નો લુક */
.task-header-row {
    background: #4a77d4; /* તમારો બ્લુ કલર */
    color: white;
    font-weight: bold;
    font-size: 13px;
    text-transform: uppercase;
    border-bottom: 2px solid #3b62b0;
    letter-spacing: 0.5px;
}

/* ડેટા રો નો લુક */
.task-data-row {
    border-bottom: 1px solid #f1f1f1;
    font-size: 14px;
    background: #fff;
    transition: background 0.2s ease;
}
.task-data-row:last-child {
    border-bottom: none;
}
.task-data-row:hover {
    background: #f8faff; /* હોવર કરતાં હલકો કલર */
}

/* લૉક થયેલા (બીજા નંબરના) ટાસ્ક માટે ઝાંખો લુક */
.row-locked {
    background: #fcfcfc;
    opacity: 0.6;
}

/* સેન્ટર એલાઈનમેન્ટ કરવા માટે (Category, Priority, Action) */
.col-cat, .col-prio, .col-action {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

/* ટાસ્ક સમય અને તારીખ માટે */
.due-time-text { color: #000; font-weight: bold; font-size: 14px; }
.due-date-text { font-size: 11px; color: #777; margin-top: 2px; }

/* ટાસ્ક વિગતો અને નામ માટે */
.task-name-text { color: #2c3e50; font-weight: 500; font-size: 13.5px; line-height: 1.4; }
.task-est-text { font-size: 11px; color: #7f8c8d; margin-top: 4px; }

/* Category ટેક્સ્ટ */
.col-cat { color: #475569; font-weight: 600; font-size: 13.5px; }

/* Priority Badges (High, Medium, Low) */
.prio-badge {
    padding: 4px 12px;
    border-radius: 4px;
    font-weight: bold;
    font-size: 11px;
    text-transform: uppercase;
    display: inline-block;
}
.prio-high { background: #ffebe9; color: #ff4d4f; border: 1px solid #ffa39e; }
.prio-medium { background: #fff7e6; color: #fa8c16; border: 1px solid #ffd591; }
.prio-low { background: #f6ffed; color: #52c41a; border: 1px solid #b7eb8f; }

/* Live Timer Badges */
.timer-badge {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: bold;
    margin-top: 6px;
}
.timer-normal { background: #e6f7ff; color: #1890ff; border: 1px solid #91d5ff; }
.timer-over { background: #fff1f0; color: #f5222d; border: 1px solid #ffa39e; animation: pulse 1.5s infinite; }

/* Locked Badge આઈકોન */
.lock-badge {
    display: inline-block;
    background: #f5f5f5;
    color: #8c8c8c;
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 11px;
    border: 1px solid #d9d9d9;
    margin-top: 6px;
    font-weight: 500;
}

/* Action Form (Buttons Group) */
.action-form { margin: 0; display: flex; gap: 6px; justify-content: center; }

/* ટાઈમર બટન્સનું કોમન સ્ટાઈલિંગ */
.btn-timer {
    border: none;
    padding: 6px 14px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 0.2s ease;
}
.btn-start { background: #52c41a; color: #fff; }
.btn-start:hover { background: #389e0d; box-shadow: 0 2px 4px rgba(82,196,26,0.2); }

.btn-pause { background: #faad14; color: #fff; }
.btn-pause:hover { background: #d46b08; box-shadow: 0 2px 4px rgba(250,173,20,0.2); }

.btn-done { background: #1890ff; color: #fff; }
.btn-done:hover { background: #096dd9; box-shadow: 0 2px 4px rgba(24,144,255,0.2); }

.btn-disabled { background: #f5f5f5; color: #bfbfbf; border: 1px solid #d9d9d9; cursor: not-allowed; }
.btn-wait { background: #f0f0f0; color: #8c8c8c; cursor: not-allowed; border: 1px solid #d9d9d9; padding: 6px 18px; }

/* Pagination (પેજીનેશન લિંક્સ) */
.task-pagination {
    display: flex;
    justify-content: center;
    padding: 15px;
    background: #fafafa;
    border-top: 1px solid #f1f1f1;
    gap: 6px;
}
.task-pagination a {
    padding: 5px 12px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    color: #555;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    background: #fff;
    transition: 0.2s;
}
.task-pagination a.active {
    background: #4a77d4;
    color: #fff;
    border-color: #4a77d4;
}
.task-pagination a:hover:not(.active) {
    background: #f5f5f5;
    color: #4a77d4;
}

/* જો કોઈ ટાસ્ક પેન્ડિંગ ન હોય ત્યારનો મેસેજ બોક્સ */
.no-tasks-msg {
    text-align: center; 
    padding: 30px; 
    color: #8c8c8c; 
    font-size: 14px; 
    border: 1px solid #e1e8ed; 
    border-radius: 8px; 
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.04);
    font-weight: 500;
}

/* ટાઈમર ઓવર ટાઈમ થાય ત્યારે બ્લિંક થવાની ઈફેક્ટ */
@keyframes pulse {
    0% { opacity: 1; }
    50% { opacity: 0.6; }
    100% { opacity: 1; }
}
/*  Complete fatchtaskondashboard