@font-face {
        font-family: Vazir;
        src: url('fonts/vazir/Vazir-Regular-FD.eot');
        src: url('fonts/vazir/Vazir-Regular-FD.woff2') format('woff'),
            /* FF39+,Chrome36+, Opera24+*/
            url('fonts/vazir/Vazir-Regular-FD.woff') format('woff2'),
            /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
            url('fonts/vazir/Vazir-Regular-FD.ttf') format('truetype');
    }
    
            * {
            box-sizing: border-box;
        }

    body,
    option {
        font-family: Vazir;
        /* --bs-gutter-x: 0 !important; */
    }

    /* حذف فلش بالا و پایین کنار برای تمام inputهای نوع number */
    input[type=number]::-webkit-outer-spin-button,
    input[type=number]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    input[type=number] {
        -moz-appearance: textfield;
    }
        
    .page_title_intro {
    	border-right: 5px solid #ffc310;
    	background: #fffae2;
    	margin: 15px;
    	padding: 10px 15px;
    }
    
    .page_title_intro h3{
    	animation: saleIntro 1.6s ease-out forwards;
    }    

@keyframes saleIntro {
    0% {
        /*font-size: 28px;*/
        color: #222;
    }
    30% {
        font-size: 32px;
        color: #e60000; /* قرمز جلب توجه */
    }
    100% {
        /*font-size: 28px;*/
        color: #222;
    }
}  

    .popular_customers_list p {
    	border-right: 2px solid;
    	cursor: pointer;
    	background: #ebebeb63;
    	text-align: center;
    	font-size: 13px;
    	transition: background 0.3s ease, color 0.3s ease;
    	padding: 5px 0;
    	border-radius: 5px;
    }
    
    .popular_customers_list p:hover {
        background: #fff4ba;
    }

    @media only screen and (max-width: 767px) {

        .product-header,
        .product-row {
            font-size: 10px !important;
        }
    }

    a {
        text-decoration: none;
    }

    #main_top_menu {
        position: fixed;
        right: -261px;
        /*top: 10%;*/
        width: 261px;
        background: #1e1d1db8;
        transition: all 0.5s ease;
        z-index: 999;
        border-radius: 10px;
        backdrop-filter: blur(5px);
        max-height: 450px;
    	overflow-y: auto;
    	top: 25%;
    }

    #main_top_menu.show {
        right: 0 !important;
    }

    #main_top_menu div {
        margin: 5px 0;
    }

    #fast_side-btn {
        position: fixed !important;
        top: 50% !important;
        right: 0;
        width: 20px !important;
        height: 75px !important;
        border-radius: 20px 0 0 20px !important;
        transform: translate(0, -50%) !important;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: rgb(118, 179, 211) !important;
        transition: all .55s cubic-bezier(.38, .11, .01, 1);
        animation: pulse-animation 1.5s infinite;
        cursor: pointer;
        z-index: 1000;
        color: #fefefe;
    }

    .navbar-toggler {
        display: block !important;
        /* مهم برای نادیده گرفتن استایل‌های پیشفرض بوتسترپ */
    }

    @keyframes pulse-animation {
        0% {
            box-shadow: 0 0 0 0 rgba(118, 179, 211, 0.4);
        }

        70% {
            box-shadow: 0 0 0 10px rgba(118, 179, 211, 0);
        }

        100% {
            box-shadow: 0 0 0 0 rgba(118, 179, 211, 0);
        }
    }

    .custom-navbar {
        background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d);
        background-size: 400% 400%;
        /* animation: gradientBG 15s ease infinite; */
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
        /* border-radius: 0 0 15px 15px; */
        padding: 10px 0;
        border-bottom: 2px solid rgba(255, 255, 255, 0.1);
    }

    #navbarContent {
        background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d);
        background-size: 400% 400%;
        /* animation: gradientBG 15s ease infinite; */
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
        border-radius: 0 0 15px 15px;
        padding: 10px 0;
        border-bottom: 2px solid rgba(255, 255, 255, 0.1);
        cursor: pointer;
    }
    
    .customer_input {
     padding-right: 5px;
     border-right-width: 2px;
     border-right-style: solid;
     border-top-width: 2px;
     border-top-style: solid;
     border-left-width: 2px;
     border-left-style: solid;
     border-bottom-width: 2px;
     border-bottom-style: solid;
     background-color: #d1f4f4;
    }

    @keyframes gradientBG {
        0% {
            background-position: 0% 50%;
        }

        50% {
            background-position: 100% 50%;
        }

        100% {
            background-position: 0% 50%;
        }
    }

    .nav-text {
        color: white !important;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
        font-weight: 500;
        font-size: 1.1rem;
    }

    #tarikh {
        padding: 8px 10px;
        backdrop-filter: blur(5px);
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        /* text-align: center; */
        font-size: 15px;
    }

    .navbar-toggler {
    	border: none;
    	padding: 8px 12px;
    	background: rgba(255, 255, 255, 0.2);
    	backdrop-filter: blur(5px);
    	transition: all 0.3s ease;
    }

    .navbar-toggler:hover {
        background: rgba(255, 255, 255, 0.3);
        transform: scale(1.05);
    }

    .navbar-toggler-icon {
        filter: brightness(0) invert(1);
    }

    .welcome-text {
        position: relative;
        padding-right: 10px;
    }

    .welcome-text::before {
        content: "";
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        height: 60%;
        width: 2px;
        background: rgba(255, 255, 255, 0.3);
    }

    /* General Styles */
    #main_top_menu .col-12 {
        margin-bottom: 5px;
    }

    /* Base Button Style */
    #main_top_menu button {
        width: 100%;
        padding: 15px 0;
        border: none;
        border-radius: 8px;
        font-weight: 600;
        font-size: 14px;
        cursor: pointer;
        transition: all 0.3s;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Button Hover Effect */
    #main_top_menu button:hover {
        opacity: 0.9;
        transform: translateY(-2px);
    }

    /* Icon Styles */
    #main_top_menu button i {
        font-size: 18px;
        margin-left: 8px;
    }

    /* Specific Button Colors */
    .btn-forosh {
        background: linear-gradient(135deg, #3a7bd5, #00d2ff);
        color: white;
    }

    .btn-kharid {
        background: linear-gradient(135deg, #6c757d, #adb5bd);
        color: white;
    }

    .btn-customers {
        background: linear-gradient(135deg, #8e2de2, #4a00e0);
        color: white;
    }

    .btn-products {
        background: linear-gradient(135deg, #f46b45, #eea849);
        color: white;
    }

    .btn-hazineh {
        background: linear-gradient(135deg, #ff416c, #ff4b2b);
        color: white;
    }

    .btn-daramad {
        background: linear-gradient(135deg, #11998e, #38ef7d);
        color: white;
    }

    .btn-transaction {
        background: linear-gradient(135deg, #1565C0, #1E88E5);
        color: white;
    }

    .btn-cheque {
        background: linear-gradient(135deg, #FFD700, #D4AF37);
        color: #333;
    }

    .btn-kharoj-az-anbar {
        background: linear-gradient(135deg, #fd7e14, #e74c3c);
        color: white;
    }

    #searchInput {
        border-radius: 20px;
        padding: 13px;
    }

    /* استایل اصلی صفحه‌بندی */
    .pagination-controls {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
        margin-top: 20px;
    }

    /* دکمه‌های صفحه‌بندی */
    .pagination-btn {
        padding: 8px 16px;
        border: none;
        border-radius: 6px;
        background-color: #4a6cf7;
        color: white;
        font-weight: 500;
        cursor: pointer;
        transition: all 0.3s ease;
        display: flex;
        align-items: center;
        gap: 5px;
    }

    /* دکمه غیرفعال */
    .pagination-btn:disabled {
        background-color: #cccccc;
        cursor: not-allowed;
        opacity: 0.7;
    }

    /* هاور دکمه‌ها */
    .pagination-btn:not(:disabled):hover {
        background-color: #3a5ce4;
        transform: translateY(-1px);
    }

    /* متن صفحه‌بندی */
    .pagination-info {
        font-size: 14px;
        color: #555;
        padding: 0 10px;
    }

    /* استایل اصلی برای زیرمنوها */
    .submenu {
        background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d) !important;
        background-size: 400% 400% !important;
        min-width: 200px;
        border-radius: 8px !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
        z-index: 999;
    }

    .submenu .dropdown-item {
        color: white !important;
        padding: 8px 15px;
        border-radius: 4px;
        transition: all 0.3s;
    }
    
    .submenu .dropdown-item.clicked {
        background-color: rgba(255, 255, 255, 0.2) !important;
        transform: translateX(5px);
        transition: all 0.3s ease;
    }

    /* نشانگر برای مواردی که زیرمنو دارند */
    .nav-item.dropdown>a:after {
        /* content: " ▼"; */
        font-size: 0.7em;
        margin-right: 5px;
    }

    .dropdown .dropdown>a:after {
        /* content: " ◄"; */
        position: absolute;
        left: 10px;
        top: 50%;
        transform: translateY(-50%);
    }

    /* انیمیشن برای نمایش زیرمنوها */
    .submenu {
        animation: fadeIn 0.3s ease-in-out;
    }

    @keyframes fadeIn {
        from {
            opacity: 0;
            transform: translateY(10px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* استفاده از breakpoint های استاندارد بوتسترپ */
    @media (max-width: 575.98px) {

        /* xs */
        .container,
        .container-fluid {
            width: 100vw;
            max-width: 100vw;
            margin-left: calc(-50vw + 50%);
            margin-right: calc(-50vw + 50%);
            padding-left: 0;
            padding-right: 0;
        }
        
         .navbar-toggler {
        	position: fixed;
        	left: 5px;
        }
    }

    @media (min-width: 576px) and (max-width: 767.98px) {
        
    .navbar-toggler {
    	position: fixed;
    	left: 5px;
    }
        
    .navbar-toggler {
    	left: 10px;
    	position: relative;
    }

        /* sm */
    .container,
    .container-fluid {
            width: 100vw;
            max-width: 100vw;
            margin-left: calc(-50vw + 50%);
            margin-right: calc(-50vw + 50%);
            padding-left: 0;
            padding-right: 0;
        }
    }

    .nav-tabs .nav-link.active {
        background-color: #5262f7 !important;
        color: white !important;
        border-color: #6b53f2 #7754e9 #fff !important;
        font-weight: bold;
    }

    .nav-tabs .nav-link:hover {
        border-color: #6b53f2 #7754e9 #fff;
        background-color: #f8f9fa;
    }

    .btn-reports {
        width: 100%;
        padding: 10px;
        border: none;
        border-radius: 5px;
        background-color: #6c757d;
        color: white;
        text-align: right;
        margin-bottom: 5px;
        transition: all 0.3s;
    }

    .btn-reports:hover {
        background-color: #5a6268;
    }

    .btn-permissions {
        width: 100%;
        padding: 10px;
        border: none;
        border-radius: 5px;
        background-color: #17a2b8;
        color: white;
        text-align: right;
        margin-bottom: 5px;
        transition: all 0.3s;
    }

    .btn-permissions:hover {
        background-color: #138496;
    }

    :root {
        --primary-color: #4e73df;
        --secondary-color: #f8f9fc;
        --accent-color: #36b9cc;
        --border-color: #e3e6f0;
        --shadow-color: rgba(58, 59, 69, 0.15);
    }

    .add_forms {
        border: 1px solid var(--border-color);
        border-radius: 10px;
        padding: 25px;
        margin-bottom: 25px;
        background: #ffffff;
        box-shadow: 0 0.15rem 1.75rem 0 var(--shadow-color);
        /* transition: all 0.3s ease; */
    }

    .add_forms:hover {
        box-shadow: 0 0.5rem 2rem 0 var(--shadow-color);
        /* transform: translateY(-3px); */
    }

    :root {
        --primary-color: #4e73df;
        --secondary-color: #f8f9fc;
        --accent-color: #36b9cc;
        --border-color: #e3e6f0;
        --shadow-color: rgba(58, 59, 69, 0.15);
        --success-color: #1cc88a;
        --danger-color: #e74a3b;
        --warning-color: #f6c23e;
    }

    .header {
        text-align: center;
        margin-bottom: 30px;
    }

    .customer-info-card {
        background: linear-gradient(135deg, #ffffff 0%, #f5f7ff 100%);
        border-radius: 12px;
        padding: 12px;
        margin-bottom: 12px;
        box-shadow: 0 0.35rem 1.5rem 0 var(--shadow-color);
        border-left: 5px solid var(--primary-color);
        transition: all 0.3s ease;
        position: relative;
        overflow: hidden;
    }

    .customer-info-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 0.75rem 2rem 0 var(--shadow-color);
    }

    .customer-info-card::before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 5px;
        background: linear-gradient(to left, var(--primary-color), var(--accent-color));
    }

    .info-header {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
        padding-bottom: 15px;
        border-bottom: 1px solid var(--border-color);
    }

    .info-header i {
        font-size: 24px;
        color: var(--primary-color);
        margin-left: 10px;
    }

    .info-header h3 {
        margin: 0;
        color: #4e4e4e;
        font-weight: 700;
    }

    .info-item {
        display: flex;
        margin-bottom: 15px;
        align-items: flex-start;
    }

    .info-icon {
        width: 32px;
        height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: rgba(78, 115, 223, 0.1);
        border-radius: 50%;
        margin-left: 15px;
        color: var(--primary-color);
        flex-shrink: 0;
    }

    .info-content {
        flex: 1;
    }

    .info-title {
        font-weight: 600;
        color: #5a5c69;
        margin-bottom: 3px;
        font-size: 0.9rem;
    }

    .info-value {
        color: #4e4e4e;
        font-size: 1.1rem;
        margin: 0;
    }

    /*.table-header,*/
    /*.table-row {*/
    /*    display: flex;*/
    /*    align-items: center;*/
    /*    padding: 12px 15px;*/
    /*    transition: all 0.3s ease;*/
    /*}*/
    
    .table-header, .table-row {
    	display: flex;
    	align-items: center;
    	padding: 12px 15px;
    	transition: all 0.3s ease;
    	margin-bottom: 2px;
    }

    .table-header {
        background-color: #4b6584;
        color: white;
        font-weight: bold;
        border-radius: 8px 8px 0 0;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        margin-bottom: 5px;
    }

    .table-cell {
        flex: 1 1 25%;
        padding: 8px 10px;
        word-break: break-word;
    }

    .table-actions {
        flex: 1 1 25%;
        display: flex;
        justify-content: center;
        gap: 8px;
    }

    /* حذف تمام borderها */
    .table-header,
    .table-row {
        border: none !important;
    }

    /* ایجاد طرح راه راه (زیکزاک) برای ردیفها */
    .table-row:nth-child(odd) {
        background-color: #f8f9fa;
    }

    .table-row:nth-child(even) {
        background-color: #e9ecef;
    }

    .table-row:hover {
        background-color: #dee2e6;
        transform: translateY(-1px);
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    }

    #search_customer_result,
    #search_product_result {
        width: 100%;
        max-height: 250px;
        overflow-y: auto;
        background: #fff !important;
        border: 1px solid #ced4da;
        border-radius: 0 0 0.375rem 0.375rem;
        border-top: none;
        margin-top: 0;
        z-index: 1000;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        display: none;
        /* position: absolute; */
        position: relative;
    }

    #search_customer_result div,
    #search_product_result div {
        padding: 0.75rem 1rem;
        border-bottom: 1px solid #f0f0f0;
        cursor: pointer;
        transition: all 0.2s ease;
    }


    /* استایل مخصوص چاپ */
    @media print {
        body * {
            visibility: hidden;
        }

        #printSection,
        #printSection * {
            visibility: visible;
        }

        #printSection {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            margin: 1cm !important;
            padding: 1cm !important;
            box-sizing: border-box;
        }

        .no-print {
            display: none !important;
        }

        .table-header {
            background-color: #f1f1f1 !important;
            color: black !important;
            -webkit-print-color-adjust: exact;
            print-color-adjust: exact;
            font-size: 16px !important;
            padding: 12px 15px !important;
        }

        .table-row:nth-child(odd) {
            background-color: #f8f9fa !important;
            -webkit-print-color-adjust: exact;
            print-color-adjust: exact;
        }

        .table-row:nth-child(even) {
            background-color: #e9ecef !important;
            -webkit-print-color-adjust: exact;
            print-color-adjust: exact;
        }

        #printSection h3,
        #printSection h4 {
            margin-bottom: 15px !important;
        }
    }