/*@import "theme.css";*/
* {
    margin: 0;
    padding: 0;
}

body, input, textarea, select, button, label {
    font-family: var(--font-family-sans-serif) !important;
}

body {
    direction: rtl;
    font-size: 14px;
    /*font-family: Tahoma, Verdana, Arial, Helvetica;*/

    text-align: right;
}

.loading {
    display: inline-block;
    min-width: 50px;
    min-height: 24px;
    text-align: center;
    background: url(../img/spinner2-50.gif) no-repeat center center;
}

.line-through {
    text-decoration: line-through;
    color: #b8bb85;
}

#navbarApp.navbar-top {
    margin: 0;
    padding: 0;
}

#navbarApp a.navbar-link {
    display: inline-block;
    padding: 10px;
    text-decoration: none;
    color: #fff;
}

div.form {
    padding: 10px;
    background: #eee;
}

div.form input, select {
    padding: 5px;
}

.cursor_pointer {
    cursor: pointer;
}

a.disabled {
    pointer-events: none;
    cursor: default;
    color: var(--gray);
}

.borderless, .borderless > li, .borderless > td, .borderless > th, .borderless > tr > td, .borderless > tr > th, .borderless > thead > tr > td, .borderless > tbody > tr > td {
    border: none;
}

.scrolled_600 {
    max-height: 600px;
    overflow: auto;
}

.scrolled_400 {
    max-height: 400px;
    overflow: auto;
}

.scrolled_800 {
    max-height: 800px;
    overflow: auto;
}

.rtl {
    direction: rtl
}

.ltr {
    direction: ltr
}

/*ul.navbar-nav li a.active {*/
/*    !*color: #000;*!*/
/*}*/
#bottomSection .admin-links {
    margin-top: 2px;
    padding-top: 5px;
}

#bottomSection .admin-links ul {
    display: block !important;
    text-align: center;
}

#bottomSection .admin-links ul li {
    display: inline-block !important;
    margin-left: 5px;
}

#bottomSection {
    /* position: absolute;*/
    /*bottom: 10px;*/
    /*left: 0;*/
    /*right: 0;*/
    margin-top: 300px;
}

#bottomSection .copyright {
    font-size: 0.7rem;
    color: #999;
}

a {
    font-weight: bold;
}

a:hover {
    text-decoration: none;
    font-weight: normal;
}

/*.btn-info:hover {*/
/*    background: #F7D600;*/
/*    border-color: #F7D600;*/
/*}*/
/*.btn-info {*/
/*    background: #bea70e;*/
/*    border-color: #bea70e;*/
/*}*/

.navbar-right .dropdown-menu {
    position: absolute;
    right: 0;
    z-index: 1050;
    top: 30px;
}

.navbar-left .dropdown-menu {
    position: absolute;
    left: 0;
    z-index: 1050;
    top: 30px;
}

.required:after {
    content: '*';
    color: var(--danger);
}

.error {
    color: var(--danger);
}

input::-webkit-input-placeholder {
    color: var(--placeholder) !important;
}

input:-moz-placeholder {
    color: var(--placeholder) !important;
}

.blink, blink {
    -webkit-animation: blinker 1.5s linear infinite;
    -moz-animation: blinker 1.5s linear infinite;
    -o-animation: blinker 1.5s linear infinite;
    animation: blinker 1.5s linear infinite;
    /*color: red;*/
    /*font-family: sans-serif;*/
}

@keyframes blinker {
    100% {
        background-color: var(--placeholder-box);
        /*opacity: 0;*/
    }
    50% {
        background-color: var(--placeholder-box-0);
    }
}

.text-blink {
    -webkit-animation: tblinker 1.5s linear infinite;
    -moz-animation: tblinker 1.5s linear infinite;
    -o-animation: tblinker 1.5s linear infinite;
    animation: tblinker 1.5s linear infinite;
    /*color: red;*/
    /*font-family: sans-serif;*/
}

@keyframes tblinker {
    50% {
        opacity: 0;
    }
}

.placeholder {
    width: 100%;
    /*background: url("../img/placeholder.png") center center;*/
    background-color: var(--placeholder-box);
    background-size: auto;
    text-align: center;
    vertical-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 1.5rem;
}

.flex-list {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: 0;
    list-style: none;
}

.flex-item {
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px 20px;
    text-align: center;
    /*min-width: 240px;*/
    flex: 0 0 21%; /* حدود 4 در هر ردیف */
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s;
}

.flex-list.flex-240 .flex-item {
    min-width: 240px;
}

.flex-list.flex-200 .flex-item {
    min-width: 200px;
    padding: 10px;
}

.flex-list.flex-150 .flex-item {
    min-width: 100px;
    padding: 5px;
}

.flex-list.flex-100 .flex-item {
    min-width: 100px;
    padding: 5px;
}

.flex-list.flex-0 .flex-item {
    min-width: 0;
    flex-grow: 1;
}

.flex-item.flex-200 {
    min-width: auto;
    width: 200px !important;
    height: auto;
}

.flex-item img {
    max-width: 100%;
    border-radius: 8px;
}

.flex-item:hover {
    transform: translateY(-4px);
    background-color: #f0f0f0;
    text-decoration: none;
}

a.flex-item-link:hover {
    text-decoration: none;
}

.flex-item a {
    display: block;
    color: inherit;
    text-decoration: none;
}

.flex-item .item-image {
    display: block;
    width: 200px;
    height: 220px;
    background-size: cover;
    border-radius: 5px;
}

.flex-item .item-title {
    padding-top: 15px;
}

.loader {
    width: 50px;
    padding: 8px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--cyan);
    --_m: conic-gradient(#0000 10%, #000),
    linear-gradient(#000 0 0) content-box;
    -webkit-mask: var(--_m);
    mask: var(--_m);
    -webkit-mask-composite: source-out;
    mask-composite: subtract;
    animation: l3 1s infinite linear;
}

@keyframes l3 {
    to {
        transform: rotate(1turn)
    }
}

.toggle-input {
    display: none;
}

/* استایل ظاهری ظرف اصلی */
.toggle-label {
    position: relative;
    display: inline-block;
    width: 80px;
    height: 35px;
    background-color: var(--dark);
    border-radius: 20px;
    cursor: pointer;
    transition: 0.3s;
    overflow: hidden;
    user-select: none;
}

/* ایجاد دایره متحرک (دکمه) */
.toggle-label::before {
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    background-color: white;
    border-radius: 50%;
    top: 2.5px;
    left: 3px;
    transition: 0.3s;
}

/* وقتی چک‌باکس انتخاب شد (حالت فعال) */
.toggle-input:checked + .toggle-label {
    background-color: var(--success); /* رنگ سبز برای بله */
}

.toggle-input:checked + .toggle-label::before {
    transform: translateX(44px); /* حرکت دکمه به سمت راست */
}

/* تنظیمات متن */
.toggle-text-yes, .toggle-text-no {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-family: Tahoma, sans-serif;
    font-size: 12px;
    color: white;
}

.toggle-text-yes {
    left: 10px;
    opacity: 0;
}

.toggle-text-no {
    right: 10px;
    opacity: 1;
}

.toggle-input:checked + .toggle-label .toggle-text-yes {
    opacity: 1;
}

.toggle-input:checked + .toggle-label .toggle-text-no {
    opacity: 0;
}