/*=========================================================
کتابخانه اختصاصی / ا Bootstrap 5  مطابق و  متشابه اسمی با
=========================================================*/

/*===== متغیرهای سراسری =====*/
:root {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    --bs-container-padding-x: 1rem;
}

/*===== باکس سایزینگ =====*/
*, *::before, *::after {
    box-sizing: border-box;
}

/*===== نمایش =====*/
.d-flex           { display: flex !important; }
.d-inline-flex    { display: inline-flex !important; }
.d-grid           { display: grid !important; }
.d-inline-grid    { display: inline-grid !important; }

/*===== فلکس - جهت =====*/
.flex-row             { flex-direction: row !important; }
.flex-row-reverse     { flex-direction: row-reverse !important; }
.flex-column          { flex-direction: column !important; }
.flex-column-reverse  { flex-direction: column-reverse !important; }

/*===== فلکس - پیچش =====*/
.flex-wrap            { flex-wrap: wrap !important; }
.flex-nowrap          { flex-wrap: nowrap !important; }
.flex-wrap-reverse    { flex-wrap: wrap-reverse !important; }

/*===== تراز محتوا =====*/
/* محور اصلی */
.justify-content-start    { justify-content: flex-start !important; }
.justify-content-end      { justify-content: flex-end !important; }
.justify-content-center   { justify-content: center !important; }
.justify-content-between  { justify-content: space-between !important; }
.justify-content-around   { justify-content: space-around !important; }
.justify-content-evenly   { justify-content: space-evenly !important; }

/* محور عرضی */
.align-items-start    { align-items: flex-start !important; }
.align-items-end      { align-items: flex-end !important; }
.align-items-center   { align-items: center !important; }
.align-items-baseline { align-items: baseline !important; }
.align-items-stretch  { align-items: stretch !important; }

/* تراز خودِ المان */
.align-self-start     { align-self: flex-start !important; }
.align-self-end       { align-self: flex-end !important; }
.align-self-center    { align-self: center !important; }
.align-self-baseline  { align-self: baseline !important; }
.align-self-stretch   { align-self: stretch !important; }

/*===== تراز محتوا در گرید =====*/
.align-content-start    { align-content: flex-start !important; }
.align-content-end      { align-content: flex-end !important; }
.align-content-center   { align-content: center !important; }
.align-content-between  { align-content: space-between !important; }
.align-content-around   { align-content: space-around !important; }
.align-content-stretch  { align-content: stretch !important; }

/*===== گپ‌ها (Gutters) =====*/
.g-0 { gap: 0 !important; }
.g-1 { gap: .25rem !important; }
.g-2 { gap: .5rem !important; }
.g-3 { gap: 1rem !important; }
.g-4 { gap: 1.5rem !important; }
.g-5 { gap: 3rem !important; }

.gx-0 { column-gap: 0 !important; }
.gx-1 { column-gap: .25rem !important; }
.gx-2 { column-gap: .5rem !important; }
.gx-3 { column-gap: 1rem !important; }
.gx-4 { column-gap: 1.5rem !important; }
.gx-5 { column-gap: 3rem !important; }

.gy-0 { row-gap: 0 !important; }
.gy-1 { row-gap: .25rem !important; }
.gy-2 { row-gap: .5rem !important; }
.gy-3 { row-gap: 1rem !important; }
.gy-4 { row-gap: 1.5rem !important; }
.gy-5 { row-gap: 3rem !important; }

/*===== Order =====*/
.order-0       { order: 0 !important; }
.order-1       { order: 1 !important; }
.order-2       { order: 2 !important; }
.order-3       { order: 3 !important; }
.order-4       { order: 4 !important; }
.order-5       { order: 5 !important; }
.order-first   { order: -1 !important; }
.order-last    { order: 6 !important; }

/*===== Container =====*/
/* Container اصلی (عرض ثابت و واکنش‌گرا) */
.container {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: calc(var(--bs-gutter-x) / 2);
    padding-left: calc(var(--bs-gutter-x) / 2);
}

/* نقاط شکست استاندارد برای سایزبندی */
@media (min-width: 576px) {
    .container {
        max-width: 540px; /* موبایل بزرگ */
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 720px; /* تبلت کوچک */
    }
}

@media (min-width: 992px) {
    .container {
        max-width: 960px; /* تبلت بزرگ / لپ‌تاپ کوچک */
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: 1140px; /* دسکتاپ معمولی */
    }
}

@media (min-width: 1400px) {
    .container {
        max-width: 1320px; /* مانیتور بزرگ */
    }
}

/* Container-fluid برای پر کردن کل عرض صفحه در همه حالت‌ها */
.container-fluid {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 576px)  { .container-sm  { max-width: 540px; } }
@media (min-width: 768px)  { .container-md  { max-width: 720px; } }
@media (min-width: 992px)  { .container-lg  { max-width: 960px; } }
@media (min-width: 1200px) { .container-xl  { max-width: 1140px; } }
@media (min-width: 1400px) { .container-xxl { max-width: 1320px; } }

.container-fluid { max-width: 100%; }

/*===== Row و Column =====*/
.row {
    display: flex;
    flex-wrap: wrap;
    margin-top:    calc(var(--bs-gutter-y) * -1);
    margin-right:  calc(var(--bs-gutter-x) / -2);
    margin-left:   calc(var(--bs-gutter-x) / -2);
}

.col,
.row > * {
    position: relative;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) / 2);
    padding-left:  calc(var(--bs-gutter-x) / 2);
}


/* ستون‌های خود تنظیم */
.col {
    flex: 1 0 0%;
}

/* ستون‌های خودکار */
.col-auto {
    flex: 0 0 auto;
    width: auto;
}

/* ستون‌های عددی محبوب (۱–۱۲) */
.col-1  { flex: 0 0 8.333333%;  max-width: 8.333333%;  }
.col-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
.col-3  { flex: 0 0 25%;        max-width: 25%;        }
.col-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
.col-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
.col-6  { flex: 0 0 50%;        max-width: 50%;        }
.col-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
.col-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
.col-9  { flex: 0 0 75%;        max-width: 75%;        }
.col-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
.col-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
.col-12 { flex: 0 0 100%;       max-width: 100%;       }

/*===== Responsive – SM =====*/
@media (min-width: 576px) {
    .order-sm-0       { order: 0 !important; }
    .order-sm-1       { order: 1 !important; }
    .order-sm-2       { order: 2 !important; }
    .order-sm-3       { order: 3 !important; }
    .order-sm-4       { order: 4 !important; }
    .order-sm-5       { order: 5 !important; }
    .order-sm-first   { order: -1 !important; }
    .order-sm-last    { order: 6 !important; }

    .col-sm           { flex: 1 0 0%; }
    .col-sm-auto      { flex: 0 0 auto; width: auto; }
    .col-sm-1  { flex: 0 0 8.333333%;  max-width: 8.333333%;  }
    .col-sm-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .col-sm-3  { flex: 0 0 25%;        max-width: 25%;        }
    .col-sm-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-sm-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .col-sm-6  { flex: 0 0 50%;        max-width: 50%;        }
    .col-sm-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .col-sm-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .col-sm-9  { flex: 0 0 75%;        max-width: 75%;        }
    .col-sm-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .col-sm-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .col-sm-12 { flex: 0 0 100%;       max-width: 100%;       }
}

/*===== Responsive – MD =====*/
@media (min-width: 768px) {
    .order-md-0       { order: 0 !important; }
    .order-md-1       { order: 1 !important; }
    .order-md-2       { order: 2 !important; }
    .order-md-3       { order: 3 !important; }
    .order-md-4       { order: 4 !important; }
    .order-md-5       { order: 5 !important; }
    .order-md-first   { order: -1 !important; }
    .order-md-last    { order: 6 !important; }

    .col-md           { flex: 1 0 0%; }
    .col-md-auto      { flex: 0 0 auto; width: auto; }
    .col-md-1  { flex: 0 0 8.333333%;  max-width: 8.333333%;  }
    .col-md-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .col-md-3  { flex: 0 0 25%;        max-width: 25%;        }
    .col-md-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-md-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .col-md-6  { flex: 0 0 50%;        max-width: 50%;        }
    .col-md-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .col-md-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .col-md-9  { flex: 0 0 75%;        max-width: 75%;        }
    .col-md-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .col-md-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .col-md-12 { flex: 0 0 100%;       max-width: 100%;       }
}

/*===== Responsive – LG =====*/
@media (min-width: 992px) {
    .order-lg-0       { order: 0 !important; }
    .order-lg-1       { order: 1 !important; }
    .order-lg-2       { order: 2 !important; }
    .order-lg-3       { order: 3 !important; }
    .order-lg-4       { order: 4 !important; }
    .order-lg-5       { order: 5 !important; }
    .order-lg-first   { order: -1 !important; }
    .order-lg-last    { order: 6 !important; }

    .col-lg           { flex: 1 0 0%; }
    .col-lg-auto      { flex: 0 0 auto; width: auto; }
    .col-lg-1  { flex: 0 0 8.333333%;  max-width: 8.333333%;  }
    .col-lg-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .col-lg-3  { flex: 0 0 25%;        max-width: 25%;        }
    .col-lg-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-lg-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .col-lg-6  { flex: 0 0 50%;        max-width: 50%;        }
    .col-lg-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .col-lg-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .col-lg-9  { flex: 0 0 75%;        max-width: 75%;        }
    .col-lg-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .col-lg-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .col-lg-12 { flex: 0 0 100%;       max-width: 100%;       }
}

/*===== Responsive – XL =====*/
@media (min-width: 1200px) {
    .order-xl-0       { order: 0 !important; }
    .order-xl-1       { order: 1 !important; }
    .order-xl-2       { order: 2 !important; }
    .order-xl-3       { order: 3 !important; }
    .order-xl-4       { order: 4 !important; }
    .order-xl-5       { order: 5 !important; }
    .order-xl-first   { order: -1 !important; }
    .order-xl-last    { order: 6 !important; }

    .col-xl           { flex: 1 0 0%; }
    .col-xl-auto      { flex: 0 0 auto; width: auto; }
    .col-xl-1  { flex: 0 0 8.333333%;  max-width: 8.333333%;  }
    .col-xl-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .col-xl-3  { flex: 0 0 25%;        max-width: 25%;        }
    .col-xl-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-xl-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .col-xl-6  { flex: 0 0 50%;        max-width: 50%;        }
    .col-xl-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .col-xl-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .col-xl-9  { flex: 0 0 75%;        max-width: 75%;        }
    .col-xl-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .col-xl-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .col-xl-12 { flex: 0 0 100%;       max-width: 100%;       }
}

/*===== Responsive – XXL =====*/
@media (min-width: 1400px) {
    .order-xxl-0       { order: 0 !important; }
    .order-xxl-1       { order: 1 !important; }
    .order-xxl-2       { order: 2 !important; }
    .order-xxl-3       { order: 3 !important; }
    .order-xxl-4       { order: 4 !important; }
    .order-xxl-5       { order: 5 !important; }
    .order-xxl-first   { order: -1 !important; }
    .order-xxl-last    { order: 6 !important; }

    .col-xxl           { flex: 1 0 0%; }
    .col-xxl-auto      { flex: 0 0 auto; width: auto; }
    .col-xxl-1  { flex: 0 0 8.333333%;  max-width: 8.333333%;  }
    .col-xxl-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .col-xxl-3  { flex: 0 0 25%;        max-width: 25%;        }
    .col-xxl-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-xxl-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .col-xxl-6  { flex: 0 0 50%;        max-width: 50%;        }
    .col-xxl-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .col-xxl-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .col-xxl-9  { flex: 0 0 75%;        max-width: 75%;        }
    .col-xxl-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .col-xxl-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .col-xxl-12 { flex: 0 0 100%;       max-width: 100%;       }
}

/*===== نمایش/مخفی کردن در همه‌ی سایزها =====*/
.d-none { display: none !important; }
.d-block { display: block !important; }

/* SM (≥576px) */
@media (min-width: 576px) {
    .d-sm-none  { display: none !important; }
    .d-sm-block { display: block !important; }
}

/* MD (≥768px) */
@media (min-width: 768px) {
    .d-md-none  { display: none !important; }
    .d-md-block { display: block !important; }
}

/* LG (≥992px) */
@media (min-width: 992px) {
    .d-lg-none  { display: none !important; }
    .d-lg-block { display: block !important; }
}

/* XL (≥1200px) */
@media (min-width: 1200px) {
    .d-xl-none  { display: none !important; }
    .d-xl-block { display: block !important; }
}

/* XXL (≥1400px) */
@media (min-width: 1400px) {
    .d-xxl-none  { display: none !important; }
    .d-xxl-block { display: block !important; }
}

/*===== Offsets – XS (کمتر از SM) =====*/
.offset-1  { margin-left: 8.333333%  !important; }
.offset-2  { margin-left: 16.666667% !important; }
.offset-3  { margin-left: 25%        !important; }
.offset-4  { margin-left: 33.333333% !important; }
.offset-5  { margin-left: 41.666667% !important; }
.offset-6  { margin-left: 50%        !important; }
.offset-7  { margin-left: 58.333333% !important; }
.offset-8  { margin-left: 66.666667% !important; }
.offset-9  { margin-left: 75%        !important; }
.offset-10 { margin-left: 83.333333% !important; }
.offset-11 { margin-left: 91.666667% !important; }

/* SM (≥576px) */
@media (min-width: 576px) {
    .offset-sm-1  { margin-left: 8.333333%  !important; }
    .offset-sm-2  { margin-left: 16.666667% !important; }
    .offset-sm-3  { margin-left: 25%        !important; }
    .offset-sm-4  { margin-left: 33.333333% !important; }
    .offset-sm-5  { margin-left: 41.666667% !important; }
    .offset-sm-6  { margin-left: 50%        !important; }
    .offset-sm-7  { margin-left: 58.333333% !important; }
    .offset-sm-8  { margin-left: 66.666667% !important; }
    .offset-sm-9  { margin-left: 75%        !important; }
    .offset-sm-10 { margin-left: 83.333333% !important; }
    .offset-sm-11 { margin-left: 91.666667% !important; }
}

/* MD (≥768px) */
@media (min-width: 768px) {
    .offset-md-1  { margin-left: 8.333333%  !important; }
    .offset-md-2  { margin-left: 16.666667% !important; }
    .offset-md-3  { margin-left: 25%        !important; }
    .offset-md-4  { margin-left: 33.333333% !important; }
    .offset-md-5  { margin-left: 41.666667% !important; }
    .offset-md-6  { margin-left: 50%        !important; }
    .offset-md-7  { margin-left: 58.333333% !important; }
    .offset-md-8  { margin-left: 66.666667% !important; }
    .offset-md-9  { margin-left: 75%        !important; }
    .offset-md-10 { margin-left: 83.333333% !important; }
    .offset-md-11 { margin-left: 91.666667% !important; }
}

/* LG (≥992px) */
@media (min-width: 992px) {
    .offset-lg-1  { margin-left: 8.333333%  !important; }
    .offset-lg-2  { margin-left: 16.666667% !important; }
    .offset-lg-3  { margin-left: 25%        !important; }
    .offset-lg-4  { margin-left: 33.333333% !important; }
    .offset-lg-5  { margin-left: 41.666667% !important; }
    .offset-lg-6  { margin-left: 50%        !important; }
    .offset-lg-7  { margin-left: 58.333333% !important; }
    .offset-lg-8  { margin-left: 66.666667% !important; }
    .offset-lg-9  { margin-left: 75%        !important; }
    .offset-lg-10 { margin-left: 83.333333% !important; }
    .offset-lg-11 { margin-left: 91.666667% !important; }
}

/* XL (≥1200px) */
@media (min-width: 1200px) {
    .offset-xl-1  { margin-left: 8.333333%  !important; }
    .offset-xl-2  { margin-left: 16.666667% !important; }
    .offset-xl-3  { margin-left: 25%        !important; }
    .offset-xl-4  { margin-left: 33.333333% !important; }
    .offset-xl-5  { margin-left: 41.666667% !important; }
    .offset-xl-6  { margin-left: 50%        !important; }
    .offset-xl-7  { margin-left: 58.333333% !important; }
    .offset-xl-8  { margin-left: 66.666667% !important; }
    .offset-xl-9  { margin-left: 75%        !important; }
    .offset-xl-10 { margin-left: 83.333333% !important; }
    .offset-xl-11 { margin-left: 91.666667% !important; }
}

/* XXL (≥1400px) */
@media (min-width: 1400px) {
    .offset-xxl-1  { margin-left: 8.333333%  !important; }
    .offset-xxl-2  { margin-left: 16.666667% !important; }
    .offset-xxl-3  { margin-left: 25%        !important; }
    .offset-xxl-4  { margin-left: 33.333333% !important; }
    .offset-xxl-5  { margin-left: 41.666667% !important; }
    .offset-xxl-6  { margin-left: 50%        !important; }
    .offset-xxl-7  { margin-left: 58.333333% !important; }
    .offset-xxl-8  { margin-left: 66.666667% !important; }
    .offset-xxl-9  { margin-left: 75%        !important; }
    .offset-xxl-10 { margin-left: 83.333333% !important; }
    .offset-xxl-11 { margin-left: 91.666667% !important; }
}

/*===== Flex-Center Utility =====*/
.flex-center {
    display:         flex !important;
    justify-content: center !important;
    align-items:     center !important;
}
