/*
    Theme : Fast 70
    Author: Fast 70 Team
    Designed By: Yunus A. Polash
    Compnay: Fexpink Limited
    Email: info@fexpink.com
    Personal Email: yunus.a.polash@gmail.com
    Whatsapp: +8801303260848
*/

:root {
  --primary-color: #8b0000;
  --primary-deep: #790000;
  --primary-light: #971a1a;
  --black: #101011;
  --body-bg-day: #f0f0f0;
  --grey: #a0a0a0;
  --grey-text: #5f5f5f;
  --border-color-day: #dbdbdb;
  --sidebar-bg-day: linear-gradient(173deg, #8b0000 37.49%, #6c0000 92.18%);
  --font-english: "Inter", sans-serif;
  --font-arabic: "Noto Sans Arabic", sans-serif;
  /* Night Mode Colors */
  --sidebar-bg: #1b1b1b;
  --grey-dark: #2d2d2d;
  --body-bg-dark: #101011;
  --border-color-dark: #222224;
  --white: #ffffff;
  --inprogress: #00b5ff;
  --bs-dropdown-link-active-bg: #8b0000;
  --dark-border-color: #434343;

  /* ── Select2 / Filter template variables ── */
  --s2-hover-bg:         rgba(139, 0, 0, 0.08);
  --s2-selected-bg:      rgba(139, 0, 0, 0.12);
  --s2-subtle-bg:        rgba(139, 0, 0, 0.10);
  --s2-ghost-bg:         rgba(139, 0, 0, 0.04);
  --s2-badge-hover-bg:   rgba(139, 0, 0, 0.18);
  --s2-focus-border:     rgba(139, 0, 0, 0.56);
  --s2-hover-text:       var(--primary-color);
  --s2-badge-hover-text: #6c0000;
  --s2-dropdown-shadow:  0 4px 20px rgba(0,0,0,0.1);
  --s2-results-bg:      var(--white);
  --s2-classic-shadow:   0 4px 12px rgba(0,0,0,0.08);
  --s2-rate-color:       #22c55e;
  --s2-rate-hover-color: #16a34a;
  --s2-choice-remove-hover: #ffc0c0;
  --s2-group-color:      #888888;
  --s2-disabled-bg:      #f5f5f5;
  --s2-classic-choice-bg:#eeeeee;
  --s2-classic-border:   #dddddd;
  --s2-msg-disabled:     #fafafa;
  --s2-msg-disabled-text:#cccccc;
  --pf-tiktok:    #000000;
  --pf-instagram: #E1306C;
  --pf-youtube:   #FF0000;
  --pf-facebook:  #1877F2;
  --pf-telegram:  #0088cc;
  --pf-twitter:   #000000;
  --pf-whatsapp:  #25D366;
  --pf-kwai:      #F77304;
  --oa-cancel-bg:       #f8f9fa;
  --oa-cancel-color:    #dc3545;
  --oa-cancel-border:   #dc3545;
  --oa-cancel-hover-bg: #dc3545;
  --oa-success-bg:      #d4edda;
  --oa-success-color:   #155724;
  --oa-success-border:  #c3e6cb;
  --oa-danger-bg:       #f8d7da;
  --oa-danger-color:    #721c24;
  --oa-danger-border:   #f5c6cb;
}

/* Night mode Select2 variable overrides */
#dashboard.night-mode {
  --s2-hover-bg:         rgba(139, 0, 0, 0.25);
  --s2-selected-bg:      rgba(139, 0, 0, 0.35);
  --s2-subtle-bg:        rgba(139, 0, 0, 0.30);
  --s2-ghost-bg:         rgba(139, 0, 0, 0.15);
  --s2-badge-hover-bg:   rgba(139, 0, 0, 0.40);
  --s2-focus-border:     var(--primary-color);
  --s2-hover-text:       #ff4444;
  --s2-badge-hover-text: #ff6666;
  --s2-dropdown-shadow:  0 4px 20px rgba(0,0,0,0.4);
  --s2-results-bg:      var(--grey-dark);
  --s2-classic-shadow:   0 4px 12px rgba(0,0,0,0.5);
  --s2-rate-color:       #22c55e;
  --s2-rate-hover-color: #16a34a;
  --s2-choice-remove-hover: #ffc0c0;
  --s2-group-color:      var(--grey);
  --s2-disabled-bg:      var(--black);
  --s2-classic-choice-bg:#434343;
  --s2-classic-border:   #5d5d5d;
  --s2-msg-disabled:     var(--black);
  --s2-msg-disabled-text:#666666;
  --oa-cancel-bg:       #2d2d2d;
  --oa-cancel-color:    #ff6b6b;
  --oa-cancel-border:   #ff6b6b;
  --oa-cancel-hover-bg: #dc3545;
  --oa-success-bg:      rgba(34,197,94,0.15);
  --oa-success-color:   #4ade80;
  --oa-success-border:  rgba(34,197,94,0.30);
  --oa-danger-bg:       rgba(220,53,69,0.15);
  --oa-danger-color:    #ff6b6b;
  --oa-danger-border:   rgba(220,53,69,0.30);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  text-decoration: none !important;
}

body {
  font-family: var(--font-english);
  font-size: 16px;
  background: var(--body-bg-day);
}

.hidden {
  display: none;
}

/* to stop dark mode blinking on reload */
/* #dashboard {
  display: none;
} */

.primary_text_color {
  color: var(--primary-color) !important;
}

.text-black {
  color: var(--black);
}

.gray_text_color {
  color: var(--grey-text) !important;
}

.primary-bg {
  background: var(--primary-color);
  color: var(--white) !important;
  transition: 0.3s;
}

.primary-bg:active {
  background-color: var(--primary-deep) !important;
}

.custom-accordion:active {
  background-color: unset !important;
}

.body-bg {
  background: var(--body-bg-day);
}

.body-bg:active {
  background: var(--body-bg-day) !important;
}

.primary-bg:hover {
  background: var(--primary-deep);
  color: var(--white);
}

.text_8px {
  color: var(--white);
  font-family: Inter;
  font-size: 8px;
  font-weight: 700;
  line-height: normal;
}

.text_16px {
  color: var(--black);
  font-family: Inter;
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
}

.text_16px_gray_light {
  color: var(--grey-text);
  font-family: Inter;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
}

.text_14px {
  color: var(--black);
  font-family: Inter;
  font-size: 14px;
  font-weight: 500;
  line-height: normal;
}

.text_12px {
  color: var(--black);
  font-family: Inter;
  font-size: 12px;
  font-weight: 500;
  line-height: normal;
}

.text_18px {
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  line-height: normal;
}

.text_20px {
  color: var(--black);
  font-family: Inter;
  font-size: 20px;
  font-weight: 700;
  line-height: normal;
}

.text_22px {
  color: var(--black);
  font-family: Inter;
  font-size: 22px;
  font-weight: 700;
  line-height: normal;
}

.text_24px {
  color: var(--black);
  font-family: Inter;
  font-size: 24px;
  font-weight: 700;
  line-height: normal;
}

.text_28px {
  color: var(--primary-color);
  text-align: center;
  font-family: Inter;
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.text_32px {
  color: var(--black);
  font-family: Inter;
  font-size: 32px;
  font-weight: 700;
  line-height: normal;
}

.text_48px {
  color: var(--white);
  text-align: center;
  font-family: Inter;
  font-size: 48px;
  font-weight: 700;
}

.text_45px {
  font-family: Inter;
  font-size: 45px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.text_14px_primary {
  color: var(--primary-light);
  font-family: Inter;
  font-size: 14px;
  font-weight: 700;
  line-height: normal;
}

.section-space {
  margin-top: 25px;
}

.btn-primary {
  background: var(--primary-color);
  border-color: var(--primary-color);
  padding: 8px 20px;
  font-size: 16px;
}

.btn-primary:hover {
  background: var(--primary-deep);
  border-color: var(--primary-deep);
}

.dropdown-item.active {
  background: var(--primary-color);
}

#dashboard .form-control {
  height: 45px;
  background-color: var(--body-bg-day);
  border-color: var(--border-color-day);
  box-shadow: none;
  line-height: 1;
  display: flex;
  align-items: center;
  border-radius: 10px;
  font-size: 16px;
}

#dashboard.night-mode  .form-control{
  border-color: var(--dark-border-color);
}

#history-search .form-control{
  border-radius: 10px 0px 0px 10px!important;
}

.site_rtl #dashboard .form-control{
  background-position: left 0.75rem center;
}

.site_rtl #history-search .form-control{
  border-radius: 0px 10px 10px 0px!important;
}

.search_box #history-search .form-control{ border-radius: 10px!important;}


select.form-control {
  --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-image: var(--bs-form-select-bg-img),
    var(--bs-form-select-bg-icon, none);
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
}

/* ── Select2 — matches Fast70 form-control design ── */
.select2-container {
  width: 100% !important;
}

.select2-container--default .select2-selection--single {
  height: 45px;
  background-color: var(--body-bg-day);
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
  display: flex;
  align-items: center;
  transition: border-color 0.2s;
}

.select2-container--default .select2-selection--single:focus,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--s2-focus-border) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  display: flex;
  align-items: center;
  height: 45px;
  line-height: 45px;
  padding-left: 12px;
  padding-right: 30px;
  font-size: 16px;
  color: var(--black);
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--grey);
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 45px;
  width: 30px;
  right: 6px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--grey) transparent transparent transparent;
  border-width: 5px 4px 0 4px;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--grey) transparent;
  border-width: 0 4px 5px 4px;
}

/* Select2 selection icon + text */
.select2-container .select2-selection__icon {
  margin-right: 8px;
  display: inline-flex;
  align-items: center;
}

.select2-container .select2-selection__icon img {
  max-width: calc(1em + 3px);
  max-height: calc(1em + 3px);
  min-width: 1em;
  border-radius: 3px;
}

.select2-container .select2-selection__text {
  display: inline;
  vertical-align: middle;
}

.select2-container .select2-selection__id-1,
.select2-container .select2-selection__id-2,
.select2-container .select2-selection__id-3 {
  min-width: 22px;
}

/* Select2 Dropdown */
.select2-dropdown {
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  margin-top: 2px;
  z-index: 1060;
  overflow: hidden;
}

.select2-container--open .select2-dropdown--below {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.select2-container--open .select2-dropdown--above {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

/* Select2 Search inside dropdown */
.select2-search--dropdown {
  padding: 8px;
}

.select2-search--dropdown .select2-search__field {
  height: 40px;
  padding: 6px 12px 6px 32px;
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
  background: var(--body-bg-day);
  font-size: 14px;
  color: var(--black);
  outline: none;
}

.select2-search--dropdown .select2-search__field:focus {
  border-color: var(--s2-focus-border);
}

.select2-search--dropdown .select2-search__field::placeholder {
  color: var(--grey);
}

/* Select2 Results */
.select2-results__option {
  padding: 10px 12px;
  font-size: 14px;
  color: var(--black);
  border-bottom: 1px solid var(--border-color-day);
  transition: background 0.15s;
}

.select2-results__option:last-child {
  border-bottom: none;
}

.select2-results__option a {
  display: block;
  padding: 0;
  font-size: 14px;
  color: inherit;
  border-bottom: none;
}

.select2-results__option a:hover {
  background: none;
}

.select2-results__option--highlighted[aria-selected],
.select2-results__option:hover {
  background: var(--s2-hover-bg) !important;
  color: var(--primary-color) !important;
}

.select2-results__option[aria-selected="true"] {
  background: var(--s2-selected-bg) !important;
  color: var(--primary-color) !important;
  font-weight: 600;
}

.select2-results__option .svc-id {
  display: inline-block;
  background: var(--primary-color);
  color: var(--white);
  font-size: 11px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 10px;
  margin-right: 6px;
  min-width: 22px;
  text-align: center;
}

.select2-results__option .svc-name {
  font-weight: 500;
}

.select2-results__option .svc-rate {
  float: right;
  color: var(--grey-text);
  font-size: 12px;
}

/* Select2 results message */
.select2-results__message {
  padding: 12px;
  color: var(--grey-text);
  font-size: 14px;
}

/* Select2 Multiple */
.select2-container--default .select2-selection--multiple {
  min-height: 45px;
  background-color: var(--body-bg-day);
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
  padding: 4px 8px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--primary-color);
  color: var(--white);
  border: none;
  border-radius: 15px;
  padding: 2px 10px;
  font-size: 13px;
  margin: 3px 4px 3px 0;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--white);
  margin-right: 4px;
  font-weight: bold;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: var(--s2-choice-remove-hover);
}

/* Select2 Search box in neworder (search-dropdown) */
.search-dropdown .input-wrapper .form-control {
  height: 45px;
  border-radius: 8px;
  background: var(--body-bg-day);
  border: 1px solid var(--border-color-day);
  font-size: 16px;
  color: var(--black);
}

.search-dropdown .input-wrapper .form-control::placeholder {
  color: var(--grey);
}

.search-dropdown .input-wrapper .form-control:focus {
  border-color: var(--s2-focus-border);
}

/* ── Platform Filter Buttons ── */
.platform-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.pf-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border: 1px solid var(--border-color-day);
  border-radius: 25px;
  background: var(--white);
  color: var(--grey-text);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.pf-btn:hover {
  border-color: var(--primary-color);
  color: var(--primary-color);
  background: var(--s2-ghost-bg);
}

.pf-btn.active {
  background: var(--primary-color);
  color: var(--white);
  border-color: var(--primary-color);
}

.pf-btn .pf-icon {
  font-size: 14px;
  display: inline-flex;
  align-items: center;
}

/* ── Platform Selector Grid ── */
.platforms {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.platforms-item {
  flex: 1 1 auto;
}

.platforms-item-col-5 {
  flex: 0 0 calc(20% - 8px);
  min-width: 80px;
}

.platforms-item__with-icon {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 12px 8px;
  border: 1px solid var(--border-color-day);
  border-radius: 10px;
  background: var(--white);
  color: var(--grey-text);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.platforms-item__with-icon:hover {
  border-color: var(--primary-color);
  color: var(--primary-color);
  background: var(--s2-ghost-bg);
}

.platforms-item__with-icon.active {
  background: var(--primary-color);
  color: var(--white);
  border-color: var(--primary-color);
}

.platforms-item__icon {
  font-size: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.platforms-item__title {
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* ── Custom Card BG (details panel cards) ── */
.custom-card-bg {
  background: var(--white);
  border: 1px solid var(--border-color-day);
  border-radius: 10px;
}

@media (max-width: 768px) {
  .platforms-item-col-5 {
    flex: 0 0 calc(33.333% - 8px);
  }
}

@media (max-width: 480px) {
  .platforms-item-col-5 {
    flex: 0 0 calc(50% - 8px);
  }
  .pf-btn {
    padding: 6px 12px;
    font-size: 12px;
  }
}

/* ═══════════════════════════════════════════════════════
   SELECT2 / SEARCH / PLATFORM VISUAL STYLES (Fast70)
   Colors, backgrounds, borders, border-radius, shadows, font-sizes.
   Structural layout is in global.css — this file adds the look.
   ═══════════════════════════════════════════════════════ */

/* ─── Select2 Closed State ─────────────────────────── */
.select2-container .select2-selection--single {
  background: var(--body-bg-day);
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
}

.select2-container.select2-container--open .select2-selection--single {
  border-color: var(--s2-focus-border);
}

.select2-container .select2-selection--single .select2-selection__rendered {
  color: var(--black);
  font-size: 16px;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--grey);
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--grey) transparent transparent transparent;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--grey) transparent;
}

/* ─── Select2 Dropdown Panel ───────────────────────── */
.select2-dropdown {
  background: var(--white);
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.select2-container--open .select2-dropdown--above {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.select2-container--open .select2-dropdown--below {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

html[data-bs-theme="dark"]   .select2-results__options {
  background: #212529 !important;
}
html[data-bs-theme="dark"]  span.select2-results {
    background-color: #212529 !important;
}


html[data-bs-theme="dark"] .select2-results__option[aria-selected=true] .svc-name {
    color: #fafaff;
}


html[data-bs-theme="dark"] .select2-results__option .svc-name {
    color: #ffffff ;
}
html[data-bs-theme="dark"]  .select2-dropdown .select2-results__options .select2-results__option {
    color: #ffffff;
  
}
html[data-bs-theme="dark"]  .select2-results__option[aria-selected="true"] {
    background: rgb(139 0 0 / 90%) !important;
    color: #ffffff !important;
    font-weight: 600;
}

/* ─── Select2 Results ──────────────────────────────── */
.select2-results__options {
  background: var(--s2-results-bg);
  border-radius: 8px;
}


.select2-results__option {
  color: var(--black);
  font-size: 14px;
  border-radius: 4px;
}

.select2-dropdown .select2-results__options .select2-results__option {
  color: var(--black);
  background: transparent;
  border-radius: 4px;
  font-size: 14px;
}

.select2-dropdown .select2-results__options .select2-results__option a {
  color: var(--black);
  background: transparent;
}

/* Hover */
.select2-results__option:hover,
.select2-results__option--highlighted[aria-selected],
.select2-results__option.active {
  background: var(--s2-hover-bg);
}

.select2-results__option:hover a,
.select2-results__option--highlighted[aria-selected] a,
.select2-results__option.active a {
  color: var(--s2-hover-text);
  background: none;
}

.select2-dropdown .select2-results__options .select2-results__option:hover,
.select2-dropdown .select2-results__options .select2-results__option--highlighted[aria-selected],
.select2-dropdown .select2-results__options .select2-results__option.active {
  background: var(--s2-hover-bg);
}

.select2-dropdown .select2-results__options .select2-results__option:hover a,
.select2-dropdown .select2-results__options .select2-results__option--highlighted[aria-selected] a,
.select2-dropdown .select2-results__options .select2-results__option.active a {
  color: var(--s2-hover-text);
}

/* Selected */
.select2-results__option[aria-selected=true],
.select2-results__option.active[aria-selected=true] {
  background: var(--s2-selected-bg);
}

.select2-results__option[aria-selected=true] a,
.select2-results__option.active[aria-selected=true] a {
  color: var(--black);
  background: none;
}

.select2-dropdown .select2-results__options .select2-results__option[aria-selected=true],
.select2-dropdown .select2-results__options .select2-results__option.active[aria-selected=true] {
  background: var(--s2-selected-bg);
}

.select2-dropdown .select2-results__options .select2-results__option[aria-selected=true] a,
.select2-dropdown .select2-results__options .select2-results__option.active[aria-selected=true] a {
  color: var(--black);
}

/* Disabled & message */
.select2-container--default .select2-results__option[aria-disabled=true] {
  color: var(--grey);
}

.select2-container .select2-results__message {
  color: var(--grey);
  font-size: 13px;
}

.select2-container--default .select2-results__group {
  color: var(--s2-group-color);
  font-size: 11px;
}

/* ─── Select2 Search Field ─────────────────────────── */
.select2-search--dropdown {
  border-bottom: 1px solid var(--border-color-day);
}

.select2-search__field {
  border: 1px solid var(--border-color-day);
  border-radius: 6px;
  font-size: 13px;
  background: var(--body-bg-day);
  color: var(--black);
}

.select2-search__field:focus {
  border-color: var(--s2-focus-border);
}

.select2-search__field::placeholder {
  color: var(--grey);
}

.select2-search__field-icon {
  color: var(--grey);
  font-size: 12px;
}

/* ─── Select2 Service Structure (svc-id/name/rate) ── */
.select2-results__option .svc-id {
  font-size: 12px;
  font-weight: 600;
  color: var(--primary-color);
  background: var(--s2-subtle-bg);
  border-radius: 4px;
}

.select2-results__option .svc-name {
  color: var(--black);
}

.select2-results__option .svc-rate {
  font-size: 13px;
  font-weight: 500;
  color: var(--s2-rate-color);
}

/* Hover state for svc badges */
.select2-results__option:hover .svc-id,
.select2-results__option--highlighted[aria-selected] .svc-id {
  background: var(--s2-badge-hover-bg);
  color: var(--s2-badge-hover-text);
}

.select2-results__option:hover .svc-name,
.select2-results__option--highlighted[aria-selected] .svc-name {
  color: var(--s2-hover-text);
}

.select2-results__option:hover .svc-rate,
.select2-results__option--highlighted[aria-selected] .svc-rate {
  color: var(--s2-rate-hover-color);
}

/* Selected state for svc badges */
.select2-results__option[aria-selected=true] .svc-id {
  background: var(--primary-color);
  color: var(--white);
}

.select2-results__option[aria-selected=true] .svc-name {
  color: var(--black);
}

.select2-results__option[aria-selected=true] .svc-rate {
  color: var(--s2-rate-hover-color);
}

/* ─── Standalone svc badges ────────────────────────── */
.svc-id {
  background: var(--s2-subtle-bg);
  color: var(--primary-color);
  font-size: 11px;
  font-weight: 600;
  border-radius: 4px;
}

.svc-rate {
  color: var(--grey);
  font-size: 12px;
}

.select2-results__option[aria-selected=true] .svc-rate {
  color: var(--primary-color);
}

.select2-results__option--highlighted[aria-selected] .svc-rate {
  color: var(--primary-color);
}

.select2-selection__rendered .svc-id {
  font-size: 10px;
}

.select2-selection__rendered .svc-rate {
  font-size: 11px;
  color: var(--grey);
}

/* ─── Select2 Icon sizes ───────────────────────────── */
.select2-container .select2-selection__icon .fa,
.select2-container .select2-selection__icon .fas,
.select2-container .select2-selection__icon .far,
.select2-container .select2-selection__icon .fab {
  font-size: 13px;
}

.select2-results__option .select2-selection__icon .fa,
.select2-results__option .select2-selection__icon .fas,
.select2-results__option .select2-selection__icon .far,
.select2-results__option .select2-selection__icon .fab {
  font-size: 12px;
}

/* ─── Select2 Multiple ─────────────────────────────── */
.select2-container--default .select2-selection--multiple {
  background: var(--body-bg-day);
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--primary-color);
  border: 1px solid var(--primary-color);
  border-radius: 15px;
  color: var(--white);
  font-size: 13px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--white);
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: var(--s2-choice-remove-hover);
}

.select2-container--default .select2-selection--multiple .select2-selection__placeholder {
  color: var(--grey);
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
  border-color: var(--grey);
}

/* ─── Select2 Classic Theme ────────────────────────── */
.select2-container--classic .select2-selection--single {
  background: var(--white);
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
}

.select2-container--classic .select2-selection--single:focus {
  border-color: var(--primary-color);
}

.select2-container--classic .select2-selection--single .select2-selection__rendered {
  color: var(--black);
}

.select2-container--classic .select2-selection--single .select2-selection__placeholder {
  color: var(--grey);
}

.select2-container--classic.select2-container--open .select2-selection--single {
  border-color: var(--primary-color);
}

.select2-container--classic.select2-container--open .select2-dropdown {
  border: 1px solid var(--border-color-day);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.select2-container--classic.select2-container--disabled .select2-selection--single {
  background: #f9f9f9;
}

.select2-container--classic .select2-selection--multiple {
  background: var(--white);
  border: 1px solid #ddd;
  border-radius: 4px;
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice {
  background: #eee;
  border: 1px solid #ddd;
  border-radius: 3px;
  font-size: 12px;
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--grey);
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: var(--black);
}

/* ─── Select2 Default Theme ────────────────────────── */
.select2-container--default .select2-selection--single {
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
}

.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--primary-color);
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--grey);
}

.select2-container--default.select2-container--disabled .select2-selection--single {
  background: #f5f5f5;
}

.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered {
  color: var(--grey);
  font-style: italic;
}

.select2-container--default.select2-container--disabled .select2-selection--multiple {
  background: #f9f9f9;
}

.select2-close-mask {
  background: var(--white);
}

/* ─── Platform Filter Visual ───────────────────────── */
.platform-filter .pf-btn {
  border: 1px solid var(--border-color-day);
  border-radius: 25px;
  background: var(--white);
  color: var(--grey-text);
  font-size: 13px;
  font-weight: 500;
}

.platform-filter .pf-btn:hover {
  border-color: var(--primary-color);
  color: var(--primary-color);
  background: var(--s2-ghost-bg);
}

.platform-filter .pf-btn.active {
  border-color: var(--primary-color);
  background: var(--primary-color);
  color: var(--white);
}

.platform-filter .pf-btn .pf-icon .fab,
.platform-filter .pf-btn .pf-icon .fas,
.platform-filter .pf-btn .pf-icon .far,
.platform-filter .pf-btn .pf-icon .fa {
  font-size: 14px;
}

/* Platform-specific icon colors (non-active state) */
.platform-filter .pf-btn[data-platform="tiktok"] .pf-icon { color: var(--pf-tiktok); }
.platform-filter .pf-btn[data-platform="instagram"] .pf-icon { color: var(--pf-instagram); }
.platform-filter .pf-btn[data-platform="youtube"] .pf-icon { color: var(--pf-youtube); }
.platform-filter .pf-btn[data-platform="facebook"] .pf-icon { color: var(--pf-facebook); }
.platform-filter .pf-btn[data-platform="telegram"] .pf-icon { color: var(--pf-telegram); }
.platform-filter .pf-btn[data-platform="twitter"] .pf-icon { color: var(--pf-twitter); }
.platform-filter .pf-btn[data-platform="whatsapp"] .pf-icon { color: var(--pf-whatsapp); }
.platform-filter .pf-btn[data-platform="kwai"] .pf-icon { color: var(--pf-kwai); }
.platform-filter .pf-btn.active .pf-icon { color: var(--white); }

/* ─── Search Dropdown Visual ───────────────────────── */
.search-dropdown .input-wrapper .form-control {
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
  font-size: 14px;
  background: var(--body-bg-day);
  color: var(--black);
}

.search-dropdown .input-wrapper .form-control:focus {
  border-color: var(--s2-focus-border);
}

.search-dropdown .input-wrapper .form-control::placeholder {
  color: var(--grey);
}

.search-dropdown .input-wrapper .input-wrapper__prepend,
.search-dropdown .input-wrapper .input-wrapper__append {
  color: var(--grey);
}

.search-dropdown .input-wrapper .input-wrapper__prepend:hover,
.search-dropdown .input-wrapper .input-wrapper__append:hover {
  color: var(--primary-color);
}

.search-dropdown .list-group {
  border: 1px solid var(--border-color-day);
  border-radius: 8px;
  background: var(--white);
}

.search-dropdown .list-group-item {
  border-bottom: 1px solid var(--border-color-day);
  font-size: 13px;
  color: var(--black);
}

.search-dropdown .list-group-item:hover {
  background: var(--s2-hover-bg);
  color: var(--primary-color);
}

.search-dropdown .list-group-item.disabled {
  background: var(--s2-msg-disabled);
  color: var(--s2-msg-disabled-text);
}

.search-dropdown .list-group-item .svc-id {
  background: var(--s2-subtle-bg);
  color: var(--primary-color);
  font-size: 11px;
  font-weight: 600;
  border-radius: 4px;
}

.search-dropdown .list-group-item .svc-rate {
  color: var(--grey);
  font-size: 12px;
}

.search-dropdown .list-group-item:hover .svc-rate {
  color: var(--primary-color);
}

/* ─── Responsive Visual ────────────────────────────── */
@media (max-width: 767px) {
  .select2-container .select2-selection--single {
    border-radius: 8px !important;
  }
  .select2-container .select2-selection--single .select2-selection__rendered {
    font-size: 15px;
  }
  .select2-selection__rendered .svc-id {
    font-size: 12px;
  }
  .select2-selection__rendered .svc-rate {
    font-size: 12px;
    color: var(--grey);
  }
  .select2-dropdown {
    border-radius: 8px !important;
  }
  .select2-results__option {
    font-size: 15px !important;
    border-radius: 6px;
  }
  .select2-dropdown .svc-id,
  .select2-results__option .svc-id {
    font-size: 12px !important;
  }
  .select2-dropdown .svc-rate,
  .select2-results__option .svc-rate {
    font-size: 13px !important;
  }
  .select2-dropdown .svc-name,
  .select2-results__option .svc-name {
    font-size: 14px;
  }
  .search-dropdown .input-wrapper .form-control { font-size: 15px; }
  .select2-search__field { font-size: 15px; }
  .platform-filter .pf-btn {
    font-size: 12px;
    border-radius: 6px;
  }
  .platform-filter .pf-btn .pf-icon {
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .select2-container .select2-selection--single .select2-selection__rendered {
    font-size: 15px;
  }
  .select2-results__option {
    font-size: 15px !important;
  }
  .platform-filter .pf-btn {
    font-size: 11px;
  }
}

/* ─── Order Actions Visual ─────────────────────────── */
.btn-order-action {
  font-size: 12px;
  border-radius: 4px;
}

.btn-order-action[data-action="refill"] {
  background: var(--primary-color);
  color: var(--white);
  border-color: var(--primary-color);
}

.btn-order-action[data-action="cancel"] {
  background: #f8f9fa;
  color: #dc3545;
  border-color: #dc3545;
}

.btn-order-action[data-action="cancel"]:hover {
  background: #dc3545;
  color: var(--white);
}

#order-action-alert {
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
}

#order-action-alert.alert-success {
  background: #d4edda;
  color: #155724;
  border: 1px solid #c3e6cb;
}

#order-action-alert.alert-danger {
  background: #f8d7da;
  color: #721c24;
  border: 1px solid #f5c6cb;
}

/* ═══════════════════════════════════════════════════════
   DARK MODE — All visual overrides for night mode
   ═══════════════════════════════════════════════════════ */

/* Select2 closed state */

.night-mode .select2-container.select2-container--open .select2-selection--single {
  border-color: var(--primary-color) !important;
}

.night-mode .select2-container .select2-selection--single .select2-selection__rendered {
  color: var(--white) !important;
}

.night-mode .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--grey) !important;
}

.night-mode .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--grey) transparent transparent transparent !important;
}

.night-mode .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--grey) transparent !important;
}

/* Select2 dropdown panel */
.night-mode .select2-dropdown {
  background: var(--grey-dark) !important;
  border-color: var(--dark-border-color) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

/* Select2 search field */
.night-mode .select2-search--dropdown {
  border-bottom-color: var(--dark-border-color) !important;
}

.night-mode .select2-search__field {
  background: var(--black) !important;
  border-color: var(--dark-border-color) !important;
  color: var(--white) !important;
}

.night-mode .select2-search__field:focus {
  border-color: var(--primary-color) !important;
}

.night-mode .select2-search__field::placeholder {
  color: var(--grey) !important;
}

.night-mode .select2-search__field-icon {
  color: var(--grey) !important;
}

/* Select2 results */
.night-mode .select2-results__options {
  background: var(--s2-results-bg) !important;
}

.night-mode .select2-results__option {
  color: var(--white) !important;
}

.night-mode .select2-dropdown .select2-results__options .select2-results__option {
  color: var(--white) !important;
  background: transparent !important;
}

.night-mode .select2-dropdown .select2-results__options .select2-results__option a {
  color: var(--white) !important;
  background: transparent !important;
}

/* Hover */
.night-mode .select2-results__option:hover,
.night-mode .select2-results__option--highlighted[aria-selected],
.night-mode .select2-results__option.active {
  background: var(--s2-hover-bg) !important;
}

.night-mode .select2-results__option:hover a,
.night-mode .select2-results__option--highlighted[aria-selected] a,
.night-mode .select2-results__option.active a {
  color: var(--s2-hover-text) !important;
  background: transparent !important;
}

.night-mode .select2-dropdown .select2-results__options .select2-results__option:hover,
.night-mode .select2-dropdown .select2-results__options .select2-results__option--highlighted[aria-selected],
.night-mode .select2-dropdown .select2-results__options .select2-results__option.active {
  background: var(--s2-hover-bg) !important;
}

.night-mode .select2-dropdown .select2-results__options .select2-results__option:hover a,
.night-mode .select2-dropdown .select2-results__options .select2-results__option--highlighted[aria-selected] a,
.night-mode .select2-dropdown .select2-results__options .select2-results__option.active a {
  color: var(--s2-hover-text) !important;
}

/* Selected */
.night-mode .select2-results__option[aria-selected=true],
.night-mode .select2-results__option.active[aria-selected=true] {
  background: var(--s2-selected-bg) !important;
}

.night-mode .select2-results__option[aria-selected=true] a,
.night-mode .select2-results__option.active[aria-selected=true] a {
  color: var(--white) !important;
  background: transparent !important;
}

.night-mode .select2-dropdown .select2-results__options .select2-results__option[aria-selected=true],
.night-mode .select2-dropdown .select2-results__options .select2-results__option.active[aria-selected=true] {
  background: var(--s2-selected-bg) !important;
}

.night-mode .select2-dropdown .select2-results__options .select2-results__option[aria-selected=true] a,
.night-mode .select2-dropdown .select2-results__options .select2-results__option.active[aria-selected=true] a {
  color: var(--white) !important;
}

/* Disabled & message */
.night-mode .select2-container--default .select2-results__option[aria-disabled=true] {
  color: var(--s2-msg-disabled-text) !important;
}

.night-mode .select2-container .select2-results__message {
  color: var(--grey) !important;
}

.night-mode .select2-container--default .select2-results__group {
  color: var(--grey);
}

/* svc badges in dark mode */
.night-mode .select2-results__option .svc-id {
  background: var(--s2-subtle-bg) !important;
  color: var(--s2-hover-text) !important;
}

.night-mode .select2-results__option .svc-name {
  color: var(--white) !important;
}

.night-mode .select2-results__option .svc-rate {
  color: var(--s2-rate-color) !important;
}

.night-mode .select2-results__option:hover .svc-id,
.night-mode .select2-results__option--highlighted[aria-selected] .svc-id {
  background: var(--s2-badge-hover-bg) !important;
  color: var(--s2-badge-hover-text) !important;
}

.night-mode .select2-results__option:hover .svc-name,
.night-mode .select2-results__option--highlighted[aria-selected] .svc-name {
  color: var(--s2-hover-text) !important;
}

.night-mode .select2-results__option:hover .svc-rate,
.night-mode .select2-results__option--highlighted[aria-selected] .svc-rate {
  color: var(--s2-rate-hover-color) !important;
}

.night-mode .select2-results__option[aria-selected=true] .svc-id {
  background: var(--primary-color) !important;
  color: var(--white) !important;
}

.night-mode .select2-results__option[aria-selected=true] .svc-name {
  color: var(--white) !important;
}

.night-mode .select2-results__option[aria-selected=true] .svc-rate {
  color: var(--s2-rate-hover-color) !important;
}

.night-mode .select2-selection__rendered .svc-id {
  background: var(--s2-subtle-bg) !important;
  color: var(--s2-hover-text) !important;
}

.night-mode .select2-selection__rendered .svc-rate {
  color: var(--grey) !important;
}

/* Multiple selection dark */


.night-mode .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
  color: var(--white) !important;
}

.night-mode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--white) !important;
}

.night-mode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: var(--s2-choice-remove-hover) !important;
}

/* Classic theme dark */


.night-mode .select2-container--classic.select2-container--open .select2-selection--single {
  border-color: var(--primary-color) !important;
}

.night-mode .select2-container--classic .select2-selection--single .select2-selection__rendered {
  color: var(--white) !important;
}

.night-mode .select2-container--classic .select2-selection--single .select2-selection__placeholder {
  color: var(--grey) !important;
}



.night-mode .select2-container--classic .select2-selection--multiple .select2-selection__choice {
  background: #434343 !important;
  border-color: #5d5d5d !important;
  color: var(--white) !important;
}

/* Default theme dark */
.night-mode .select2-container--default .select2-selection--single {
  border-color: var(--dark-border-color) !important;
}

.night-mode .select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--primary-color) !important;
}

.night-mode .select2-container--default.select2-container--disabled .select2-selection--single {
  background: var(--black) !important;
}

.night-mode .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered {
  color: var(--s2-msg-disabled-text) !important;
}

.night-mode .select2-container--default.select2-container--disabled .select2-selection--multiple {
  background: var(--black) !important;
}

.night-mode .select2-close-mask {
  background: var(--black);
}

/* Platform filter dark */
.night-mode .platform-filter .pf-btn {
  background: var(--grey-dark) !important;
  border-color: var(--dark-border-color) !important;
  color: var(--grey) !important;
}

.night-mode .platform-filter .pf-btn:hover {
  border-color: var(--primary-color) !important;
  color: var(--primary-color) !important;
  background: var(--s2-ghost-bg) !important;
}

.night-mode .platform-filter .pf-btn.active {
  background: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
  color: var(--white) !important;
}

.night-mode .platform-filter .pf-btn[data-platform="tiktok"] .pf-icon { color: var(--white) !important; }
.night-mode .platform-filter .pf-btn[data-platform="instagram"] .pf-icon { color: var(--pf-instagram) !important; }
.night-mode .platform-filter .pf-btn[data-platform="youtube"] .pf-icon { color: var(--pf-youtube) !important; }
.night-mode .platform-filter .pf-btn[data-platform="facebook"] .pf-icon { color: var(--pf-facebook) !important; }
.night-mode .platform-filter .pf-btn[data-platform="telegram"] .pf-icon { color: var(--pf-telegram) !important; }
.night-mode .platform-filter .pf-btn[data-platform="twitter"] .pf-icon { color: var(--white) !important; }
.night-mode .platform-filter .pf-btn[data-platform="whatsapp"] .pf-icon { color: var(--pf-whatsapp) !important; }
.night-mode .platform-filter .pf-btn[data-platform="kwai"] .pf-icon { color: var(--pf-kwai) !important; }
.night-mode .platform-filter .pf-btn.active .pf-icon { color: var(--white) !important; }

/* Search dropdown dark */
.night-mode .search-dropdown .input-wrapper .form-control {
  background: var(--grey-dark) !important;
  border-color: var(--dark-border-color) !important;
  color: var(--white) !important;
}

.night-mode .search-dropdown .input-wrapper .form-control:focus {
  border-color: var(--primary-color) !important;
}

.night-mode .search-dropdown .input-wrapper .form-control::placeholder {
  color: var(--grey) !important;
}

.night-mode .search-dropdown .input-wrapper .input-wrapper__prepend,
.night-mode .search-dropdown .input-wrapper .input-wrapper__append {
  color: var(--grey) !important;
}

.night-mode .search-dropdown .input-wrapper .input-wrapper__prepend:hover,
.night-mode .search-dropdown .input-wrapper .input-wrapper__append:hover {
  color: var(--primary-color) !important;
}

.night-mode .search-dropdown .list-group {
  background: var(--grey-dark) !important;
  border-color: var(--dark-border-color) !important;
}

.night-mode .search-dropdown .list-group-item {
  color: var(--white) !important;
  border-bottom-color: var(--dark-border-color) !important;
}

.night-mode .search-dropdown .list-group-item:hover {
  background: var(--s2-hover-bg) !important;
  color: var(--s2-hover-text) !important;
}

.night-mode .search-dropdown .list-group-item.disabled {
  background: var(--black) !important;
  color: var(--s2-msg-disabled-text) !important;
}

.night-mode .search-dropdown .list-group-item .svc-id {
  background: var(--s2-subtle-bg) !important;
  color: var(--s2-hover-text) !important;
}

.night-mode .search-dropdown .list-group-item .svc-rate {
  color: var(--grey) !important;
}

.night-mode .search-dropdown .list-group-item:hover .svc-rate {
  color: var(--primary-color) !important;
}

/* Order actions dark */
.night-mode .btn-order-action[data-action="cancel"] {
  background: #2d2d2d;
  color: #ff6b6b;
  border-color: #ff6b6b;
}

.night-mode .btn-order-action[data-action="cancel"]:hover {
  background: #dc3545;
  color: var(--white);
}

.night-mode #order-action-alert.alert-success {
  background: rgba(34, 197, 94, 0.15);
  color: #4ade80;
  border-color: rgba(34, 197, 94, 0.3);
}

.night-mode #order-action-alert.alert-danger {
  background: rgba(220, 53, 69, 0.15);
  color: #ff6b6b;
  border-color: rgba(220, 53, 69, 0.3);
}

#dashboard .search_box .form-control {
  height: 35px;
}

.show-on-dark {
  display: none;
}

.border-style-remover:first-of-type>.accordion-header .accordion-button .border-style-remover:last-of-type>.accordion-header .accordion-button.collapsed,
.accordion-item:first-of-type,
.accordion-item:last-of-type {
  border-radius: 4px;
  overflow: hidden;
}

#dashboard .accordion-item {
  border-radius: 4px;
  overflow: hidden;
  border-radius: 4px;
  border: 1px solid var(--Day-Border-Color);
  background: var(--white);
  box-shadow: 0px 0px 8px 0px rgba(214, 214, 214, 0.25);
}

.custom-accordion {
  border-radius: 4px;
  padding: 10px 15px;
  box-shadow: none !important;
}

.custom-accordion[aria-expanded="true"] {
  background: var(--s2-subtle-bg);
  color: var(--primary-color);
}

.custom-accordion[aria-expanded="false"] {
  background: var(--white);
  color: var(--black);
}

#dashboard input:focus {
  background: var(--body-bg-day);
}

.extra-space-bottom {
  margin-bottom: 30px;
}

.status_btn {
  justify-content: center;
}

.color-invert {
  filter: invert(1);
}

.night-mode .color-invert {
  filter: invert(0);
}

a.btn_sidebar_toggler .icon {
  color: var(--primary-color);
}

.form-control:focus {
  border-color: var(--s2-focus-border) !important;
}

.service_filter_btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  height: 40px;
  width: 100%;
  padding: 6px 12px;
  text-decoration: none;
  border-radius: 8px;
  background: var(--primary-color);
  color: var(--white);
}

.service_filter_btn:focus,
.service_filter_btn:focus-visible,
.service_filter_btn:focus-within,
.service_filter_btn:target,
.service_filter_btn:active {
  background: var(--primary-color);
}

.custom_dropdown_style .dropdown-item {
  white-space: normal;
}

.nav_menu_btns .btn-outline-primary {
  background: var(--white);
  border: 1px solid var(--primary-color);
  border-radius: 50px;
  display: flex;
  align-items: center;
  gap: 3px;
  height: 35px;
  justify-content: center;
}

.nav_menu_btns .btn-primary {
  display: flex;
  align-items: center;
  gap: 3px;
  height: 35px;
  justify-content: center;
  border-radius: 50px;
  background: var(--primary-color);
  border: 1px solid var(--primary-color);
}

.languageChanger{
  font-size: 24px;
  display: flex;
  align-items: center;
  gap: 0px;
  color: var(--primary-color);
  justify-content: center;
  align-items: center;
  cursor: pointer;
  line-height: 0;
}
.languageChanger::after{
  display: none;
}

.currencyChangerTopHeader.dropdown-toggle {
  background: var(--primary-color);
  padding: 8px 10px;
  border-radius: 50px;
  color: var(--white);
  font-size: 14px;
  cursor: pointer;
}
.dropdown-item{
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 14px;
}
.dropdown-item .icon{
  font-size: 20px;
  line-height: 0;
}
.integration-fixed.integration-fixed__bottom-right {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 999;
}
/* end of common style */

/* sidebar */
#dashboard .sidebar::-webkit-scrollbar {
  width: 3px;
}

#dashboard .sidebar::-webkit-scrollbar-thumb {
  background-color: var(--primary-color);
  border-radius: 5px;
}

#dashboard .sidebar::-webkit-scrollbar-track {
  background-color: #f1f1f1;
  border-radius: 5px;
}

#dashboard .sidebar {
  width: 250px;
  background: var(--sidebar-bg-day);
  float: left;
  height: 100%;
  position: fixed;
  transition: 0.3s ease;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 3;
}

.sidebar-closed {
  transition: 0.3s ease;
}

.top_header .top_left {
  display: flex;
  align-items: center;
  gap: 20px;
}

.top_header.top_left {
  display: flex;
  align-items: center;
}

.top_left .header_logo_area {
  display: flex;
  align-items: center;
}

.top_header .top_right {
  display: flex;
  align-items: center;
  gap: 8px;
}

.top_right a{
  cursor: pointer;
}

.sidebar .logo_container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  background: var(--primary-color);
}

.user_sidebar_box {
  padding: 0 20px 20px 20px;
}

.btn_sidebar_toggler .icon {
  font-size: 35px;
  display: flex;
  color: #fff;
  cursor: pointer;
}

.card-wrapper .user_info {
  display: flex;
  flex-direction: column;
  background: var(--primary-deep);
  padding: 10px;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  color: #fff;
  position: relative;
  z-index: 1;
}

.card-wrapper .user_info::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: url("https://cdn.fexpink.com/fast70/images/pattern-dark.20747baf 1.png");
  opacity: 0.2;
  top: 0;
  left: 0;
  background-position: center;
  z-index: -1;
}

.user_info .user_balance {
  display: flex;
  color: var(--white);
}

.user_balance .balance {
  background: var(--primary-light);
  padding: 5px 20px;
  /* margin-right: 1px; */
  /* border-top-left-radius: 5px;
  border-bottom-left-radius: 5px; */
  border-radius: 5px;
}

.user_balance .changer {
  background: var(--primary-light);
  padding: 3px 10px;
  margin-left: 1px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.user_balance .changer a:not(.dropdown-item) {
  text-decoration: none;
  color: #fff;
}

.menu_wraper .menu_item {
  display: flex;
  padding: 5px 10px;
  border-radius: 3px;
}

.menu_item .icon {
  margin-right: 10px;
  color: var(--white);
  line-height: 0;
  font-size: 24px;
}

.menu_item .icon img {
  width: 24px;
}

.card-wrapper .user_badges {
  position: absolute;
  transform: rotate(45deg) translate(40px, -15px);
  background: var(--primary-light);
  padding: 3px 50px;
  top: 0;
  right: 0;
  text-align: center;
  color: var(--white);
  font-family: Inter;
  font-size: 14px;
  font-weight: 700;
}

.user_info .user_wrap {
  text-align: center;
}

.user_sidebar_box .card-wrapper {
  overflow: hidden;
  margin: 15px 0;
}

.user_sidebar_box .avatar {
  margin-bottom: 8px;
}

.menu_devider .text {
  color: var(--White, #fff);
}

.menu_devider,
.menu_item {
  margin-bottom: 10px;
  position: relative;
  display: flex;
  align-items: center;
}

.sidebar_bottom_part {
  position: relative;
}

.sidebar_bottom_part .version {
  position: absolute;
  bottom: 0;
  left: 0px;
  right: 0;
}

.sidebar_bottom_part .transparent_logo {
  transform: rotate(-16deg);
  width: 240px;
  position: relative;
  bottom: 25px;
  pointer-events: none;
  z-index: 0;
  mix-blend-mode: soft-light;
  left: 0;
}

.menu_devider span.line {
  position: absolute;
  width: calc(100% - 70px);
  height: 1px;
  background: var(--primary-light);
  top: 50%;
  right: 0;
}

.site_rtl .menu_devider span.line{
  left: 0px;
  right: inherit;
}

.menu_item .text {
  color: var(--white);
  
  font-size: 16px;
  font-weight: 500;
}
p,span, small,label {
   
    font-family: 'Tajawal', 'Inter', sans-serif;
}
p.text_16px.mb-1 {
   font-family: 'Tajawal', 'Inter', sans-serif;
}
.sidebar_bottom_part .version {
  color: #fff;
}

.menu_item.active {
  background: var(--primary-light);
  position: relative;
}

.menu_item.active::after {
  content: "";
  position: absolute;
  left: -22px;
  width: 7px;
  height: 80%;
  background: var(--white);
  border-radius: 40px;
  top: 50%;
  transform: translateY(-50%);
}

.site_rtl .menu_item.active::after{
  left: inherit;
  right: -22px;
}

.sidebar-closed .sidebar {
  transform: translateX(-250px);
  transition: 0.3s ease;
}

/****************************************/
/********************* full content *******************/
/****************************************/
.full_content {
  width: calc(100% - 250px);
  min-height: 100vh;
  float: left;
  margin-left: 250px;
  transition: 0.3s ease;
}

.full_content .top_header {
  display: flex;
}

.full_content .top_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--white);
  padding: 10px;
  height: 75px;
}

/* .full_content .body_content {
  padding: 30px 10px;
} */

.sidebar-closed .full_content {
  width: 100% !important;
  float: left;
  margin-left: 0 !important;
  transition: 0.3s ease;
}

.sidebar-open .header_logo_area {
  display: none;
}

.header_logo_area {
  display: flex;
  gap: 20px;
  flex-direction: row-reverse;
}

.top_header .search_box form {
  position: relative;
}

.top_header .search_box button {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  color: var(--primary-color);
  border: none;
  background: transparent;
}

.top_header .search_box input {
  padding: 8px 40px 8px 15px;
  border-radius: 30px;
  font-family: Inter;
  width: 100%;
}

.top_header .header_top_icon iconify-icon {
  font-size: 24px;
  color: black;
}

.header_top_icon,
.header_top_icon .night_icon,
.header_top_icon .day_icon {
  display: flex;
  line-height: 0;
}

.header_top_icon {
  font-size: 24px;
}

.top_header .header_user_top.dropdown-toggle {
  text-decoration: none;
  color: black;
}

.top_header .header_user_top.dropdown-toggle img {
  width: 30px;
}

section#account_asset .card-body {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.card-image {
  text-align: center;
}

.card-image {
  text-align: center;
  width: 70px;
  min-width: 70px;
  height: 70px;
  background: var(--body-bg-day);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#account_asset p {
  color: var(--Grey-Text, #5f5f5f);
}

#account_asset h3 {
  color: var(--Black, #101011);
}

.card.card_type_1 {
  border: 0;
  border-radius: 15px;
}

.card_type_1 .card-header {
  position: relative;
  z-index: 1;
  background: var(--white);
  padding: 15px 15px 20px 15px;
  border: 0;
  border-radius: 15px 15px 0px 0px;
}

.card_type_1 .card-header::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: url("https://cdn.fexpink.com/fast70/images/pattern-dark.20747baf 1.png");
  opacity: 0.12;
  top: 0;
  left: 0;
  background-position: center;
  z-index: -1;
}

.card_switcher {
  gap: 7px;
}

.card_type_1 .card-header .nav-link {
  border-radius: 30px;
  padding: 8px 15px;
  background: black;
  color: var(--white);
  display: flex;
  align-items: center;
  gap: 5px;
}

.card_type_1 .card-header .nav-link.active {
  background-color: #8b0000;
}

.card_type_1 .card-header .nav-link .icon {
  line-height: 0;
  font-family: 20px;
}

.card_type_1 .card-header .nav-link .icon img {
  width: 18px;
}

.dragable_section {
  gap: 7px;
}

.card-body-tab-bg.nav-link.active {
  border-radius: 4px;
  border: 1px solid var(--Primary-Light, #971a1a);
  background: rgba(139, 1, 1, 0.2);
}

.card-body-tab-bg.nav-link {
  padding: 5px 10px;
  color: var(--black) !important;
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  background: var(--body-bg-day);
  display: flex;
  align-items: center;
  min-width: 90px;
  justify-content: center;
}

.custom-dropdown-btn-bg {
  border-radius: 8px;
  border: 1px solid var(--border-color-day);
  background: var(--body-bg-day);
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  text-align: left;
  padding-right: 20px;
  height: 40px;
  /* display: flex;
  align-items: center; */
}

.custom-dropdown-btn-bg:hover {
  background: var(--border-color-day) !important;
  border-color: #8b00004d !important;
}

.custom-dropdown-btn-bg.show {
  border-color: var(--s2-focus-border) !important;
}

.custom-dropdown-btn-bg div {
  display: flex;
  overflow: hidden;
}

.btn.custom-dropdown-btn-bg.dropdown-toggle::after {
  right: 10px;
  position: absolute;
  top: 50%;
}

ul.nav.nav-pills.mb-3.dragable_section {
  flex-wrap: nowrap;
  overflow-y: auto;
}

.dragable_section {
  display: flex;
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.dragable_section::-webkit-scrollbar {
  display: none;
}

.custom-card-bg {
  border-radius: 8px;
  border: 1px solid var(--border-color-day);
  background: var(--body-bg-day);
}

.Warning_sec_gap {
  margin-top: 45px;
}

/*******************************/
/**************** order page ***************/
/*******************************/
#order_page .order_page_custom_design {
  gap: 10px;
}

#order_page .order_page_custom_design .order_btn {
  color: var(--primary-color);
  border: 1px solid var(--primary-color);
  display: flex;
  align-items: center;
  gap: 5px;
}

#order_page .order_page_custom_design .order_btn:hover,
#order_page .order_page_custom_design .order_btn.active {
  color: var(--bs-nav-pills-link-active-color);
  background-color: #8b0000 !important;
}

.order_page_custom_design span.icon {
  font-size: 20px;
  margin-right: 5px;
  line-height: 0;
}

#order_page .table_head_custom_bg {
  border-bottom: 1px solid var(--primary-color);
  background: var(--s2-subtle-bg);
  white-space: nowrap;
  height: 45px;
  display: flex;
  align-items: center;
  gap: 15px;
}

/* #order_page .status_btn {
  padding: 5px 12px;
  border-radius: 50px;
  background: var(--inprogress);
  white-space: nowrap;
  color: var(--white);
  font-size: 12px;
  text-align: center;
  width: auto;
} */

#order_page button#dropdownMenuButton {
  border-radius: 50px;
  background: var(--primary-color);
  padding: 5px 10px;
  font-size: 12px;
  border: 0;
}

.bg_green {
  background: #4caf50 !important;
}

.bg_Violet {
  background: #7b38ff !important;
}

.table-wrapper {
  width: 100%;
  overflow-x: auto;
  border: 0;
  display: flex;
  border-radius: 5px;
  min-width: 1200px;
}

.service_item,
.subscription_table,
.dreep_feed_table,
.update_table,
.refund_table,
.service_table {
  display: flex;
  border-bottom: 1px solid #ddd;
  padding: 8px;
  display: flex;
}

.service_item>div,
.subscription_table>div,
.refund_table>div,
.update_table>div,
.service_table>div,
.dreep_feed_table>div {
  display: flex;
  align-items: flex-start;
}

.custom_table_head {
  font-weight: bold;
  background-color: #f5f5f5;
}

.custom_table_head,
.service_item>div,
.subscription_table>div,
.refund_table>div,
.update_table>div,
.service_table div,
.dreep_feed_table>div {
  flex: 1;
  padding: 8px;
  vertical-align: top;
  line-break: anywhere;
}

.service_item .table_link a {
  color: #0d6efd;
  text-decoration: none;
  line-break: anywhere;
}

.status_btn {
  padding: 5px 10px;
  border-radius: 30px;
  color: white;
  background: #424242;
  text-align: center;
  white-space: nowrap;
  width: 100px;
}

.custom_table_head {
  background: var(--s2-subtle-bg);
  color: var(--primary-color);
  white-space: nowrap;
  display: flex;
  border-color: var(--primary-color);
  color: var(--primary-color);
}

.custom_table_head div {
  display: flex;
  vertical-align: middle;
}

.service_item button.btn.btn-primary.dropdown-toggle,
.subscription_table button.btn.btn-primary.dropdown-toggle,
.dreep_feed_table button.btn.btn-primary.dropdown-toggle {
  background: var(--primary-color);
  border: 0;
  padding: 5px 10px;
  border-radius: 30px;
  color: var(--white);
}

.bg_green {
  background-color: #28a745;
}

.bg_Violet {
  background-color: #6f42c1;
}

.bg_partials {
  background-color: #ff6347;
}

.bg_red {
  background-color: #dc143c;
}

/*******************************/
/***************** subscription page **************/
/*******************************/
.table_actions .dropdown {
  width: 100px;
}

.table_actions .dropdown button {
  width: 100%;
}

/* fund page */
.tab-card.active .card {
  border: 1px solid var(--primary-color);
}

.tab-card {
  height: 100%;
}

.tab-card .card {
  width: 131px;
  height: 100%;
}

.tab-card .card .card-body {
  padding: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.payment_method_box .card-body {
  margin-top: 15px;
}

.get-btn {
  display: flex;
  padding: 4px 20px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  text-decoration: none;
  border-radius: 4px;
  background: var(--primary-color);
  color: var(--white);
  gap: 5px;
}

/* child pannel */
.text_box_bg_img_full {
  position: relative;
  z-index: 1;
  border-radius: 20px;
  border: 0;
  overflow: hidden;
}

.text_box_bg_img_full .card-body {
  padding: 40px 30px;
}

.text_box_bg_img_full::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: url(https://cdn.fexpink.com/fast70/images/istockphoto-1542560677-612x612\ 1.png);
  opacity: 0.05;
  top: 0;
  left: 0;
  background-position: center;
  z-index: -1;
}

.custom-form-group {
  display: flex;
  gap: 13px;
}

.form-group {
  margin-bottom: 12px;
}

.form-group label {
  margin-bottom: 5px;
}

.form-group textarea {
  min-height: 300px;
}

.form-group textarea.massorder {
  min-height: 300px;
}

.select-text-sec {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.select-text-sec iconify-icon {
  position: absolute;
  right: 10px;
  cursor: pointer;
}

.select-text-sec input {
  padding-right: 30px;
}

.custom-accordion::after {
  display: none;
  /* Hide the default Bootstrap arrow icon */
}

.faq_acc .accordion-button {
  display: flex;
  justify-content: space-between;
}

.ticket_faq.faq_acc .accordion-button{
  background: var(--s2-subtle-bg);
    color: var(--primary-color);
}

/* Basic rotation styling */
.accordion-icon {
  transition: transform 0.3s ease;
  margin-left: auto;
  font-size: 20px;
}

.custom-accordion[aria-expanded="true"] .accordion-icon {
  transform: rotate(180deg);
}

/* dash account */
ul.dash-account-ul {
  list-style: none;
  padding: 0;
  font-weight: normal;
  float: left;
  width: 100%;
}

.dash_acctount_table .table {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.dash_acctount_table .table-header {
  background-color: #f8f9fa;
  font-weight: bold;
}

.dash_acctount_table .table-body {
  display: flex;
  flex-direction: column;
}

.dash_acctount_table .table-row {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #ddd;
}

.dash_acctount_table .table-row:last-child {
  border-bottom: 0;
}

.dash_acctount_table .table-cell {
  flex: 1;
  padding: 8px;
}

.dash_acctount_table .table-cell:nth-child(1) {
  text-align: left;
}

.dash_acctount_table .table-cell:nth-child(2) {
  text-align: right;
}

.dash_acctount_table .table-body .table-row:hover {
  background: rgba(139, 0, 0, 0.07);
}

section#account_asset .card {
  border: 1px solid var(--border-color-day);
  background: var(--white);
  box-shadow: 0px 0px 10px 0px rgba(142, 142, 142, 0.25);
  border-radius: 10px;
  overflow: hidden;
}

.night-mode section#account_asset .card{
  border-color: var(--dark-border-color);
  box-shadow: none;
}

/* refund page */
.refund_table_style {
  min-width: auto;
}

/* notification */
.notification_type_icon {
  text-align: center;
}

.notification_type_icon {
  font-size: 55px;
}

.custom_check_n_type {
  width: 1.4em;
  height: 1.4em;
  display: flex;
  appearance: auto;
  accent-color: var(--primary-color);
  margin: 0 auto;
  box-shadow: none !important;
}

.custom-check-box-notif {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.custom_level_style {
  background: var(--primary-color) !important;
  color: var(--white) !important;
  width: 170px;
  font-weight: normal;
  border-radius: 30px;
  padding: 6px 8px;
  margin-bottom: 10px;
}

.acc_features {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
}

.acc_features .feature_item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.feature_item  .icon{
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--s2-subtle-bg);
  border-radius: 40px;
}

.feature_item  .icon > span{
  line-height: 0;
}

.feature_item .activeIcon{
  display: none;
  line-height: 0;
}

.feature_item.active .inactiveIcon{
  display: none;
  line-height: 0;
}

.feature_item.active .activeIcon{
  display: block;
  line-height: 0;
}


.telegram_notification_margin_bottom {
  margin-bottom: 50px;
}

.custom-check-box-notif .form-check-label {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* update page */
#update_page .filter-btn {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px;
}

#update_page .status_btn {
  min-width: 276px;
}

#update_page .service_filter_btn::after {
  display: none;
}

#update_page .service_filter_btn:focus-visible {
  background: var(--primary-color);
}

/* affiliates page */
.info-box-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
}

.icon-box {
  display: flex;
  align-items: center;
  gap: 10px;
}

.icon-box .icon {
  width: 40px;
  height: 40px;
  font-size: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--body-bg-day);
  color: var(--primary-color);
  border-radius: 5px;
}

/* api page */
.full-width-table .custom-border-color {
  border-color: var(--grey);
}

.full-width-table table {
  font-weight: normal;
}

.custom_script_section {
  height: auto;
  background: rgb(24, 19, 19);
  border-radius: 20px;
  padding: 25px;
  color: var(--white);
}

/* service page */
.search_box_container input {
  position: relative;
  padding-right: 30px;
}

.search_box_container {
  display: flex;
  align-items: center;
  position: relative;
}

.search_box_container a.service_search_submit {
  position: absolute;
  right: 10px;
}

.service_icon_box {
  display: flex;
  gap: 8px;
  justify-content: center;
  align-items: center;
  padding: 8px;
}

.service_type_wrapper {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.service_type {
  padding: 10px 20px;
  background: var(--white);
  border-radius: 20px;
  border: 1px solid var(--border-color-day);
}

.service_filter_btn::after {
  display: none;
}

.service_table.service_heading {
  font-weight: bold;
}

.service_offer_block {
  width: 100%;
  text-align: center;
  margin-bottom: 0;
  padding: 0.5rem;
  background: var(--primary-color);
  color: var(--white);
}

.service_offer_block h4 {
  color: var(--white);
}

/* account page */
.my_account_table {
  font-weight: 400;
}

.my_account_table tr td:last-child {
  text-align: right;
}

/*************************** *********************/
/*************************** media query *********************/
/*************************** *********************/

@media only screen and (max-width: 1200px) {
  .card-image {
    width: 50px;
    min-width: 50px;
    height: 50px;
  }

  .card-image img {
    width: 60%;
  }

  #dashboard .sidebar {
    width: 250px;
  }

  .full_content {
    width: calc(100% - 250px);
    margin-left: 250px;
  }


  .text_22px {
    font-size: 18px;
  }
}

@media only screen and (max-width: 992px) {
  .section-space {
    margin-top: 20px;
  }

  .fast_70_header a.nav-link {
    text-align: center;
  }

  .header_btn_wrapper {
    margin-bottom: 15px;
  }

  .header_btn_wrapper .icon {
    font-size: 14px;
  }

  .text_8px {
    font-size: 8px;
  }

  .text_16px,
  .text_16px_gray_light {
    font-size: 14px;
  }

  .text_14px {
    font-size: 12px;
  }

  .text_12px {
    font-size: 10px;
  }

  .text_18px {
    font-size: 16px;
  }

  .text_20px {
    font-size: 18px;
  }

  .text_22px {
    font-size: 20px;
  }

  .text_24px {
    font-size: 22px;
  }

  .text_28px {
    font-size: 25px;
  }

  .text_32px {
    font-size: 28px;
  }

  .text_48px {
    font-size: 38px;
  }

  .text_45px {
    font-size: 35px;
  }

  .text_14px_primary {
    font-size: 12px;
  }

  .sidebar-closed .blur_effect {
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    right: 0;
    z-index: 9;
    backdrop-filter: blur(3px);
  }

  .sidebar-closed .body_content {
    overflow: hidden;
    position: fixed;
    width: 100%;
  }

  .search_box {
    display: none;
  }

  .sidebar_bottom_part {
    position: relative;
  }

  .top_header .search_box input {
    padding: 8px 35px 8px 15px;
  }

  .header_top_icon {
    line-height: 0;
  }

  .card-wrapper .user_info {
    padding: 8px;
  }

  .menu_item .text {
    font-size: 14px;
  }

  .top_header .header_user_top.dropdown-toggle img {
    width: 25px;
  }

  .service_table.service_heading {
    display: none;
  }

  .service_item,
  .subscription_table,
  .dreep_feed_table,
  .refund_table,
  .update_table {
    border-right: 1px solid #ddd;
  }

  .service_item:nth-child(odd),
  .subscription_table:nth-child(odd),
  .dreep_feed_table:nth-child(odd),
  .update_table:nth-child(odd),
  .refund_table:nth-child(odd) {
    border-right: none;
  }

  .service_item>div,
  .dreep_feed_table>div,
  .subscription_table>div,
  .refund_table>div,
  .update_table>div,
  .service_table>div {
    display: flex;
    justify-content: center;
    text-align: center;
    align-items: center;
  }

  .table-wrapper .service_item>div[data-label]::before,
  .table-wrapper .dreep_feed_table>div[data-label]::before,
  .table-wrapper .subscription_table>div[data-label]::before,
  .table-wrapper .refund_table>div[data-label]::before,
  .table-wrapper .service_table>div[data-label]::before,
  .table-wrapper .update_table>div[data-label]::before {
    content: attr(data-label);
    font-weight: bold;
    display: block;
    margin-bottom: 5px;
    color: var(--primary-light);
  }

  .dreep_feed_table:first-child,
  .subscription_table:first-child,
  .refund_table:first-child,
  .service_table:first-child,
  .update_table:first-child {
    display: none !important;
  }

  /* order table */

  .table-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    min-width: auto;
  }

  .subscription_table-wrapper {
    grid-template-columns: repeat(1, 1fr);
  }

  .service_item {
    display: grid;
    gap: 10px;
    padding: 15px 10px;
    grid-template-areas:
      "orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId"
      "orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate"
      "orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink"
      "orderCharge orderCharge orderCharge orderCount orderCount orderCount orderQnt orderQnt orderQnt orderRemain orderRemain orderRemain"
      "orderServ orderServ orderServ orderServ orderServ orderServ orderServ orderServ orderServ orderServ orderServ orderServ"
      "orderStas orderStas orderStas orderStas orderStas orderStas orderAction orderAction orderAction orderAction orderAction orderAction";
  }

  .service_item .table_id {
    grid-area: orderId;
    background: var(--primary-light);
    color: var(--white);
    width: max-content;
    margin: 0 auto;
    border-radius: 5px;
    padding: 8px;
  }

  .service_item .table_date {
    grid-area: orderDate;
  }

  .service_item .table_link {
    grid-area: orderLink;
  }

  .service_item .table_charge {
    grid-area: orderCharge;
  }

  .service_item .table_count {
    grid-area: orderCount;
  }

  .service_item .table_quantity {
    grid-area: orderQnt;
  }

  .service_item .table_service {
    grid-area: orderServ;
  }

  .service_item .table_remains {
    grid-area: orderRemain;
  }

  .service_item .table_status {
    grid-area: orderStas;
  }

  .service_item .table_actions {
    grid-area: orderAction;
  }

  .custom-flex-column {
    flex-direction: column;
  }

  .service_item:first-child {
    display: none !important;
  }

  /* .service_item:last-child {
    border: 0;
  } */

  /* dreep table */
  .dreep_feed_table {
    display: grid;
    gap: 10px;
    padding: 15px 10px;
    grid-template-areas:
      "orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId"
      "orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate orderDate"
      "orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink orderLink"
      "orderCharge orderCharge orderCharge orderCharge orderCharge orderQuantity orderQuantity orderQuantity orderQuantity orderQuantity orderQuantity orderQuantity"
      "orderservice orderservice orderservice orderservice orderservice orderservice orderservice orderservice orderservice orderservice orderservice orderservice"
      "orderRuns orderRuns orderRuns orderRuns orderRuns orderRuns orderInterval orderInterval orderInterval orderInterval orderInterval orderInterval"
      "orderStatus orderStatus orderStatus orderStatus orderStatus orderStatus orderAction orderAction orderAction orderAction orderAction orderAction";
  }

  .dreep_feed_table .table_id {
    grid-area: orderId;
    background: var(--primary-light);
    color: var(--white);
    width: max-content;
    margin: 0 auto;
    border-radius: 5px;
  }

  .dreep_feed_table .table_date {
    grid-area: orderDate;
  }

  .dreep_feed_table .table_link {
    grid-area: orderLink;
  }

  .dreep_feed_table .table_total_charge {
    grid-area: orderCharge;
  }

  .dreep_feed_table .table_Quantity {
    grid-area: orderQuantity;
  }

  .dreep_feed_table .dreep_table_Service {
    grid-area: orderservice;
  }

  .dreep_feed_table .table_Runs {
    grid-area: orderRuns;
  }

  .dreep_feed_table .table_Interval {
    grid-area: orderInterval;
  }

  .dreep_feed_table .table_status {
    grid-area: orderStatus;
  }

  .dreep_feed_table .table_actions {
    grid-area: orderAction;
  }

  /* subscriptions table */

  .subscription_table {
    display: grid;
    gap: 10px;
    padding: 15px 10px;
    grid-template-areas:
      "table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id"
      "table_created_at table_created_at table_created_at table_updated_at table_updated_at table_updated_at table_username table_username table_username table_quantity table_quantity table_quantity"
      "table_new_post table_new_post table_new_post table_new_post table_old_post table_old_post table_old_post table_old_post table_delay table_delay table_delay table_delay"
      "table_service table_service table_service table_service table_service table_service table_service table_service table_service table_service table_service table_service"
      "table_status table_status table_status table_status table_status table_status table_expiry table_expiry table_expiry table_expiry table_expiry table_expiry";
  }

  .subscription_table .table_id {
    grid-area: orderId;
    background: var(--primary-light);
    color: var(--white);
    width: max-content;
    margin: 0 auto;
    border-radius: 5px;
  }

  .subscription_table .table_id {
    grid-area: table_id;
  }

  .subscription_table .table_created_at {
    grid-area: table_created_at;
  }

  .subscription_table .table_updated_at {
    grid-area: table_updated_at;
  }

  .subscription_table .table_username {
    grid-area: table_username;
  }

  .subscription_table .table_quantity {
    grid-area: table_quantity;
  }

  .subscription_table .table_new_post {
    grid-area: table_new_post;
  }

  .subscription_table .table_old_post {
    grid-area: table_old_post;
  }

  .subscription_table .table_delay {
    grid-area: table_delay;
  }

  .subscription_table .table_service {
    grid-area: table_service;
  }

  .subscription_table .table_status {
    grid-area: table_status;
  }

  .subscription_table .table_expiry {
    grid-area: table_expiry;
  }

  /* refund-table */

  .refund_table {
    display: grid;
    gap: 10px;
    padding: 15px 10px;
    grid-template-areas:
      "table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id"
      "table_date table_date table_date table_date table_date table_date refund_amount refund_amount refund_amount refund_amount refund_amount refund_amount"
      "table_status table_status table_status table_status table_status table_status table_status table_status table_status table_status table_status table_status";
  }

  .refund_table .table_id {
    grid-area: table_id;
    background: var(--primary-light);
    color: var(--white) !important;
    width: max-content;
    margin: 0 auto;
    border-radius: 5px;
  }

  .refund_table .table_date {
    grid-area: table_date;
  }

  .refund_table .refund_amount {
    grid-area: refund_amount;
  }

  .refund_table .table_status {
    grid-area: table_status;
  }

  /* update_table */

  .update_table {
    display: grid;
    gap: 10px;
    padding: 15px 10px;
    grid-template-areas:
      "table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id"
      "table_date table_date table_date table_date table_date table_date table_date table_date table_date table_date table_date table_date"
      "refund_amount refund_amount refund_amount refund_amount refund_amount refund_amount refund_amount refund_amount refund_amount refund_amount refund_amount refund_amount"
      "table_status table_status table_status table_status table_status table_status table_status table_status table_status table_status table_status table_status";
  }

  .update_table .table_id {
    grid-area: table_id;
    background: var(--primary-light);
    color: var(--white) !important;
    width: max-content;
    margin: 0 auto;
    border-radius: 5px;
    padding: 8px;
  }

  .update_table .table_date {
    grid-area: table_date;
  }

  .update_table .refund_amount {
    grid-area: refund_amount;
  }

  .update_table .table_status {
    grid-area: table_status;
  }

  /* service table */
  .service_table {
    display: grid;
    gap: 10px;
    padding: 15px 10px;
    grid-template-areas:
      "orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId"
      "table_services table_services table_services table_services table_services table_services table_services table_services table_services table_services table_services table_services"
      "table_rate table_rate table_rate table_min_order table_min_order table_min_order table_max_order table_max_order table_max_order table_average_time table_average_time table_average_time"
      "table_details table_details table_details table_details table_details table_details table_details table_details table_details table_details table_details table_details";
    border-bottom: 0;
  }

  .service_table .table_id {
    grid-area: orderId;
    background: var(--primary-light);
    color: var(--white);
    width: max-content;
    margin: 0 auto;
    border-radius: 5px;
  }

  .service_table .table_services {
    grid-area: table_services;
  }

  .service_table .table_rate {
    grid-area: table_rate;
  }

  .service_table .table_min_order {
    grid-area: table_min_order;
  }

  .service_table .table_max_order {
    grid-area: table_max_order;
  }

  .service_table .table_average_time {
    grid-area: table_average_time;
  }

  .service_table .table_details {
    grid-area: table_details;
  }

  .service_table_custom {
    grid-template-columns: repeat(1, 1fr);
  }

  .Warning_sec_gap {
    margin-top: 30px;
  }

  .custom_check_n_type {
    width: 1.2em;
    height: 1.2em;
  }

  .order_page_custom_design iconify-icon {
    font-size: 18px;
  }

  .service_filter_btn {
    height: 45px;
  }

  .notification_type_icon {
    font-size: 40px;
  }
  .site_rtl .full_content{
    margin-right: 0px;
  }
}

@media only screen and (max-width: 768px) {
  .full_content {
    width: 100%;
    margin-left: 0;
  }
  .site_rtl .full_content{
    margin-right: 0px;
  }

  #dashboard .sidebar {
    z-index: 9999;
  }

  .custom_table_head,
  .service_item {
    flex-direction: column;
    text-align: left;
  }

  /* .text_8px {
    font-size: 8px;
  }

  .text_16px,
  .text_16px_gray_light {
    font-size: 14px;
  }

  .text_14px {
    font-size: 12px;
  }

  .text_12px {
    font-size: 10px;
  }

  .text_18px {
    font-size: 16px;
  }

  .text_20px {
    font-size: 18px;
  }

  .text_22px {
    font-size: 20px;
  }

  .text_24px {
    font-size: 22px;
  }

  .text_32px {
    font-size: 28px;
  }

  .text_14px_primary {
    font-size: 12px;
  } */

  #order_page .table_head_custom_bg,
  .service_item {
    gap: 5px;
  }

  .full_content .top_header {
    padding: 8px;
    height: 65px;
  }

  .card-wrapper .user_info {
    padding: 5px;
  }

  .menu_item .text {
    font-size: 13px;
  }

  .top_header .header_user_top.dropdown-toggle img {
    width: 20px;
  }

  .sidebar_bottom_part .transparent_logo {
    width: 200px;
  }

  .top_header .top_left {
    gap: 15px;
  }

  .service_item {
    gap: 5px;
  }

  .telegram_notification_margin_bottom {
    margin-bottom: 30px;
  }

  .custom_script_section {
    height: 300px;
  }

  .btn_sidebar_toggler .icon {
    font-size: 25px;
  }

  .subscription_table {
    display: grid;
    gap: 10px;
    padding: 15px 10px;
    grid-template-areas:
      "table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id table_id"
      "table_created_at table_created_at table_created_at table_created_at table_created_at table_created_at table_updated_at table_updated_at table_updated_at table_updated_at table_updated_at table_updated_at"
      "table_username table_username table_username table_username table_username table_username table_quantity table_quantity table_quantity table_quantity table_quantity table_quantity "
      "table_new_post table_new_post table_new_post table_new_post table_new_post table_new_post table_old_post table_old_post table_old_post table_old_post table_old_post table_old_post "
      "table_delay table_delay table_delay table_delay table_delay table_delay table_delay table_delay table_delay table_delay table_delay table_delay"
      "table_service table_service table_service table_service table_service table_service table_service table_service table_service table_service table_service table_service"
      "table_status table_status table_status table_status table_status table_status table_expiry table_expiry table_expiry table_expiry table_expiry table_expiry";
  }

  .service_table {
    grid-template-areas:
      "orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId orderId"
      "table_services table_services table_services table_services table_services table_services table_services table_services table_services table_services table_services table_services"
      "table_rate table_rate table_rate table_rate table_rate table_rate table_min_order table_min_order table_min_order table_min_order table_min_order table_min_order"
      "table_max_order table_max_order table_max_order table_max_order table_max_order table_max_order table_average_time table_average_time table_average_time table_average_time table_average_time table_average_time"
      "table_details table_details table_details table_details table_details table_details table_details table_details table_details table_details table_details table_details";
  }

}

@media only screen and (max-width: 767px) {
  /* .text_8px {
    font-size: 8px;
  } */

  .text_16px,
  .text_16px_gray_light {
    font-size: 12px;
  }

  .text_14px {
    font-size: 10px;
  }

  /* .text_12px {
    font-size: 10px;
  } */

  .text_18px {
    font-size: 16px;
  }

  .text_20px {
    font-size: 16px;
  }

  .text_22px {
    font-size: 18px;
  }

  .text_24px {
    font-size: 20px;
  }

  .text_28px {
    font-size: 23px;
  }

  .text_32px {
    font-size: 26px;
  }

  .text_48px {
    font-size: 35px;
  }

  .text_45px {
    font-size: 32px;
  }

  /* .text_14px_primary {
    font-size: 12px;
  } */
  .table-wrapper {
    grid-template-columns: repeat(1, 1fr);
  }

  .mobile-row-reverse {
    justify-content: center;
    align-items: center;
    flex-direction: column-reverse;
  }

  .mobile-row-reverse div {
    text-align: center;
  }

  .service_item,
  .subscription_table,
  .dreep_feed_table,
  .refund_table {
    border-right: 0;
  }

  .Warning_sec_gap {
    margin-top: 20px;
  }

  .custom_check_n_type {
    width: 1em;
    height: 1em;
  }

  .order_page_custom_design iconify-icon {
    font-size: 16px;
  }

  .notification_type_icon {
    font-size: 35px;
  }
}

@media only screen and (max-width: 550px) {
  .card-image {
    width: 40px;
    min-width: 40px;
    height: 40px;
  }

  .card-image img {
    width: 60%;
  }

  .text_28px {
    font-size: 20px;
  }

  .text_32px {
    font-size: 22px;
  }

  .text_22px {
    font-size: 14px;
  }

  .text_20px {
    font-size: 14px;
  }

  .text_48px {
    font-size: 25px;
  }

  .text_45px {
    font-size: 22px;
  }
}

/**************** site_rtl ***************/

/* dashboard layout */
.site_rtl .full_content {
  width: calc(100% - 250px);
  margin-right: 250px;
  transition: 0.3s ease;
  float: right;
}

.site_rtl .sidebar-closed .sidebar {
  transform: translateX(250px);
  transition: 0.3s ease;
}

.site_rtl .sidebar-closed .full_content {
  margin-right: 0 !important;
}

.site_rtl .user_balance .changer {
  margin-right: 1px;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

.site_rtl .user_balance .balance {
  margin-left: 1px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.site_rtl .menu_item .icon {
  margin-left: 10px;
}

.site_rtl .primary-bg {
  border-radius: 5px !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.site_rtl input.form-control.reverse_radius_search_input {
  border-radius: 5px !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

/*****************************************/
/*****************************************/
/*********************** night mode ******************/
/*****************************************/

.night-mode .text_16px,
.night-mode .text_14px,
.night-mode .text_12px,
.night-mode .text_20px,
.night-mode .text_22px,
.night-mode .text_24px,
.night-mode .text_32px,
.night-mode .text_16px_gray_light,
.night-mode iconify-icon,
.night-mode .top_header .header_top_icon iconify-icon,
.night-mode .top_header .header_user_top.dropdown-toggle,
.night-mode .form-control,
.night-mode #account_asset p,
.night-mode #account_asset h3,
.night-mode .card-body-tab-bg.nav-link.active,
.night-mode .card-body-tab-bg.nav-link,
.night-mode .dropdown-menu .dropdown-item,
.night-mode .text-black {
  color: var(--white) !important;
}

.night-mode .custom_table_head {
  border-bottom: 1px solid var(--Primary, #8b0000);
  background: var(--primary-color) !important;
  color: var(--White);
}

#dashboard.night-mode .sidebar,
.night-mode .sidebar .logo_container {
  background: var(--sidebar-bg);
}

.night-mode .card-wrapper .user_info,
.night-mode section#account_asset .card-body,
.night-mode .card,
#dashboard.night-mode .sidebar::-webkit-scrollbar-thumb,
.night-mode .table-header,
.night-mode .custom-border-color {
  background: var(--border-color-dark) !important;
}

.night-mode .card-wrapper .user_badges,
.night-mode .user_balance .balance,
.night-mode .user_balance .changer,
.night-mode .user_balance .changer,
.night-mode .menu_devider span.line,
.night-mode .menu_item.active,
.night-mode .menu_item.active::after,
.night-mode .form-control,
.night-mode .card_type_1 .card-header,
.night-mode .btn.custom-dropdown-btn-bg,
.night-mode .dropdown-item:focus,
.night-mode .dropdown-item:hover,
.night-mode .service_item,
.night-mode input:active,
.night-mode .accordion-item,
.night-mode .icon-box .icon,
.night-mode .service_type {
  background: var(--grey-dark) !important;
}

.night-mode .full_content .top_header {
  background: var(--sidebar-bg);
}

.night-mode .top_header .search_box input,
.night-mode .full_content,
.night-mode .card-body-tab-bg.nav-link,
.night-mode .dropdown-menu {
  background: var(--black);
}

.night-mode #order_page .order_page_custom_design .nav-link,
.night-mode .table-body .table-row:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--white);
  color: var(--white);
}

.night-mode .form-control::placeholder {
  color: var(--grey);
}

.night-mode .show-on-dark {
  display: block;
}

.night-mode .hide-on-dark {
  display: none;
}

.night-mode .primary_text_color {
  color: var(--primary-light) !important;
}

.night-mode .custom-accordion[aria-expanded="false"] {
  background: var(--border-color-dark);
  color: var(--white);
}

.night-mode .accordion-item {
  box-shadow: none !important;
}

/* ***************************************************************************************************************************** */
/* ***************************************************************************************************************************** */
/* ************************************************ before login pages style ********************************************************* */
/* *********************************************************************************************************************************** */
/* *********************************************************************************************************************************** */

/* common style start */
.title_wrapper {
  background: var(--primary-color);
  position: relative;
  padding: 100px 10px;
  z-index: 1;
}

.title_wrapper::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: url(https://cdn.fexpink.com/fast70/images/shade.png);
  opacity: 0.12;
  top: 0;
  left: 0;
  background-position: center;
  z-index: -1;
}

/* common style end */

/* header start */
.fast_70_header .navbar-brand img {
  width: 120px;
}

.header_btn_wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.header_btn_wrapper button {
  background: var(--primary-color);
  border-color: var(--primary-color);
  display: flex;
  align-items: center;
  gap: 5px;
  border-radius: 30px;
  padding: 5px 20px;
}

.header_btn_wrapper button:focus,
.header_btn_wrapper button:active {
  background: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
}

.header_btn_wrapper .icon {
  line-height: 0;
  font-size: 16px;
}

.header_btn_wrapper .btn-outline-primary {
  background: transparent;
  color: var(--primary-color);
}

.header_btn_wrapper button:hover {
  border-color: var(--primary-color);
  background: var(--primary-color);
  color: var(--white);
}

.fast_70_header a.nav-link.active {
  color: var(--primary-color);
}

/* header end */

/* sign up style start */
section.sign_up_sec {
  padding: 100px 10px;
  background: linear-gradient(180deg, #8b0000 0%, #250000 100%);
}

section.sign_up_sec h1 {
  margin-bottom: 40px;
}

.custom-input {
  border: 1px solid #8b0000;
  border-radius: 5px;
  display: flex;
  align-items: center;
  padding: 5px 10px;
  height: 45px;
}

.custom-input input {
  border: none;
  outline: none;
  flex: 1;
  box-shadow: none !important;
  font-weight: normal;
}

.custom-input .icon {
  color: #8b0000;
  font-size: 20px;
  line-height: 0;
}

.sign_up_sec .card {
  padding: 35px;
}

.outter_button button {
  padding: 10px 40px;
}

.custom_check.form-check-input:checked {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

.custom_check.form-check-input:focus {
  border-color: #8b00006e;
}

.already_have_acc p {
  text-align: center;
  font-weight: 400;
}

/* sign up style end */

/* sign in style start */
.lan_wrapper {
  display: flex;
  align-items: center;
}

#heroSection {
  position: relative;
  padding: 120px 0px;
  background: linear-gradient(180deg,rgba(139,0,0,1) 0%,rgba(0,0,0,1) 92%);
  color: var(--white);
}

#heroSection .sub_title {
  color: var(--white);
  font-weight: 400;
}

button#choose_lang {
  background: var(--primary-color);
  display: flex;
  align-items: center;
  gap: 5px;
  border-radius: 30px;
  padding: 5px 10px;
  color: #fff;
}

.sign_frm_style .form-group.mb-3 {
  background: var(--white);
  overflow: hidden;
  border-radius: 5px;
}

.custom_forgot_sec {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.custom_forgot_sec .form-check-label,
.custom_forgot_sec a {
  color: var(--white);
}

.sign_in_spe p {
  color: var(--white);
  text-align: left;
}

.section_gap {
  padding: 80px 0px;
}

.count_card_wrapper {
  border: 1px solid var(--primary-color) !important;
}

.count_card_wrapper .card-body {
  display: flex;
  gap: 13px;
  align-items: center;
}

.count_card_wrapper .icon {
  width: 100px;
  min-width: 100px;
  height: 100px;
  background: #ffd9d9;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.count_card_wrapper .icon img {
  width: 70px;
}

.count_card_wrapper .data-title {
  color: var(--black);
  text-align: left;
  margin-bottom: 3px;
}

.count_card_wrapper .data-amount {
  color: var(--primary-color);
  margin-bottom: 0;
}

.card_vertical .card-body {
  flex-direction: column;
  align-items: center;
}

.card_vertical .data-title {
  text-align: center;
}

.card_sec_btn {
  margin-top: 60px;
  text-align: center;
}

.why_fst_gap {
  margin-top: 60px;
}

.who_we_sec {
  text-align: left;
  background: #fff;
  padding: 70px 15px;
}

.who_we_sec h2 {
  text-align: left;
}

.acc_wrapper {
  background-image: url(https://cdn.fexpink.com/fast70/images/service_bg_img.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  padding: 50px 15px;
}

.service_tab_style {
  justify-content: center;
  gap: 10px;
  margin-bottom: 20px;
}

.service_tab_style .nav-link {
  display: flex;
  gap: 5px;
  align-items: center;
  background: var(--black);
  color: var(--white);
}

.service_tab_style .icon {
  line-height: 0;
}

.service_tab_style .nav-link.active {
  background: var(--primary-color);
}

.service_tab_style .icon {
  font-size: 20px;
}

.tab_content_wrapper {
  text-align: center;
}

.service_img img {
  width: 250px;
}

.section_bg {
  background: linear-gradient(rgba(3, 3, 3, 0.8), rgba(3, 3, 3, 0.8)),
    url("https://cdn.fexpink.com/fast70/images/get_started_bg.webp");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  color: var(--white);
  padding: 100px 20px;
}

.get_content_wrapper p {
  font-weight: 400;
  color: var(--white);
}

.review_bg {
  background-image: url(https://cdn.fexpink.com/fast70/images/service_bg_img.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.swiper.mySwiper {
  width: 100%;
}

.swiper-slide {
  text-align: center;
  padding: 10px 100px;
}

.swiper-button-next:after,
.swiper-button-prev:after {
  display: none;
}

.swiper-button-next,
.swiper-button-prev {
  width: 30px !important;
  height: 30px !important;
  font-size: 25px;
  background: #d9d9d9;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--primary-color) !important;
}

.stars {
  text-align: center;
}

.reviewer img {
  width: 80px;
  margin-bottom: 15px;
}

/* sign in style end */

/* footer style start */
.footer_wrapper {
  background: var(--primary-color);
  padding: 50px 25px;
  color: var(--white);
}

.footer_list_items li {
  display: flex;
  gap: 5px;
  align-items: center;
  color: var(--white);
  margin-bottom: 8px;
}

.footer_list_items li a {
  display: flex;
  gap: 5px;
  color: var(--white);
  font-weight: 400;
}

.footer_list_items .icon {
  font-size: 20px;
  line-height: 0;
}

.footer_logo_sec .text {
  color: var(--white);
}

.footer_logo {
  margin-bottom: 14px;
}

.footer_logo img {
  width: 220px;
}

.social-card {
  background: var(--white);
  padding: 7px 13px;
  color: var(--black);
  display: flex;
  align-items: center;
  gap: 5px;
  border-radius: 30px;
  justify-content: center;
  font-weight: 600;
  width: fit-content;
}

.social_wrapper {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 10px;
}
.social-card{
  width: 80%;
  min-width: 130px;
}
.social-card .icon {
  line-height: 0;
  font-size: 20px;
}

/* footer style end */

/* copy right start */
.copy_right_wrapper {
  padding: 15px 10px;
  align-items: center;
}

.payment_methods {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  flex-wrap: wrap;
}

.payment_methods img {
  width: 60px;
}

/* copy right start */

/* faq start */
.faq .accordion-button {
  box-shadow: none;
}

.faq h1 {
  color: var(--black);
}

.faq .sub_title {
  margin-bottom: 40px;
  text-align: center;
}

.faq_custom_btn {
  margin-top: 40px;
  text-align: center;
}

.faq_custom_btn button {
  width: auto;
}

/* faq end */

/* Services Page Modifying */
.social_media_wrap {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
}

.social_media_wrap .social_media_btn{
  display: flex;
  align-items: center;
  gap: 7px;
  justify-content: center;
  border: none;
  color: var(--black);
  padding: 8px 20px;
  border-radius: 10px;
  background: var(--body-bg-day);
}

.social_media_wrap .social_media_btn > div{
  pointer-events: none;
}

.social_media_wrap .social_media_btn.activeItem{
  background: var(--primary-color);
  color: var(--white);
}


/* Service Table */
.serv_category_card {
  background: var(--card-bg);
  border: 1px solid var(--primary-color);
  box-shadow: 0px 4px 33px rgba(0, 0, 0, 0.03);
  border-radius: 10px;
  margin-bottom: 25px;
  overflow: hidden;
}

.serv_category_card .serv_cat_card_header {
  text-align: center;
  background: var(--primary-color);
  padding: 15px 30px;
}

.serv_category_card .serv_cat_card_header .category_name {
  font-size: 18px;
  font-weight: 500;
  color: var(--white);
  text-align: center;
}

.serv_category_card .serv_cat_card_body {
  padding: 20px;
  background: var(--white);
}

.serv_category_card .serv_cat_card_body .service_item,
.serv_category_card .serv_cat_card_body .service_item.service_table_header {
  display: flex;
  flex-direction: row;
  gap: 15px;
  margin-bottom: 10px;
}

.serv_category_card .serv_cat_card_body .service_item.service_table_header {
  margin-bottom: 15px;
}

.serv_category_card
  .serv_cat_card_body
  .service_item.service_table_header
  > span {
  font-weight: 800;
  color: var(--black);
}

.serv_category_card .serv_cat_card_body .service_item .id {
  width: 8%;
}

.serv_category_card .serv_cat_card_body .service_item .services_name {
  width: 40%;
}

.serv_category_card .serv_cat_card_body .service_item .rate {
  width: 15%;
}

.serv_category_card .serv_cat_card_body .service_item .max_order,
.serv_category_card .serv_cat_card_body .service_item .min_order {
  width: 10%;
}

.serv_category_card .serv_cat_card_body .service_item .avg_time {
  width: 20%;
}

.serv_category_card .serv_cat_card_body .service_item .descriptions {
  width: 10%;
}

.serv_category_card .serv_cat_card_body .service_item.service {
  border-bottom: 1px solid var(--border-color-day);
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 0px;
  padding-right: 0px;
}

.serv_category_card .serv_cat_card_body .service_item .descriptions {
  text-align: end;
}

.serv_category_card .serv_cat_card_body .service_item.service > span.id > span,
.serv_category_card
  .serv_cat_card_body
  .service_item.service
  > span.min_order
  > span,
.serv_category_card
  .serv_cat_card_body
  .service_item.service
  > span.max_order
  > span,
.serv_category_card
  .serv_cat_card_body
  .service_item.service
  > span.rate
  > span {
  display: inline-flex;
  font-weight: 700;
  color: var(--white);
  text-align: center;
  justify-content: center;
  align-items: center;
  padding: 5px 15px;
  border-radius: 8px;
  background-color: #2b2b2b;
}

.serv_category_card .serv_cat_card_body .service_item:last-child {
  border-bottom: none !important;
  margin-bottom: 0px;
  padding-bottom: 0px;
}

.serv_category_card .serv_cat_card_body .service_item.service > span.id > span,
.serv_category_card
  .serv_cat_card_body
  .service_item.service
  > span.rate
  > span {
  color: var(--white);
}

.serv_category_card .serv_cat_card_body .service_item.service > span.avg_time {
  display: flex;
  align-items: center;
  max-height: 35px;
}

.serv_category_card .serv_cat_card_body .service_item.service .services_name {
  font-size: 16px;
  font-weight: 400;
  color: var(--black);
}

.serv_category_card .serv_cat_card_body .service_item.service > span.min_order,
.serv_category_card .serv_cat_card_body .service_item.service > span.max_order {
  display: flex;
  align-items: center;
  max-height: 35px;
}

.btn_descriptions {
  background: var(--primary-color);
  color: var(--white);
  font-weight: 700;
  font-size: 16px;
  padding: 8px 25px;
  border-radius: 10px;
  transition: 0.8s;
}

.btn_descriptions:hover {
  background: var(--primary-deep);
  color: var(--white);
  scale: 1.05;
}



.ticket_info_item {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px dashed var(--primary-color);
  padding: 10px 5px;
  margin-bottom: 10px;
}


.ticket-message-left.admin_ticket,
.ticket-message-right.user_ticket {
  margin-bottom: 20px;
}

.ticket-message-right.user_ticket .ticket-message {
  background: var(--primary-color);
  padding: 20px 20px;
  border-radius: 15px;
  margin-bottom: 5px;
  color: var(--white);
}

.ticket-message-left.admin_ticket .ticket-message {
  background: #0096c3;
  padding: 20px 20px;
  border-radius: 15px;
  margin-bottom: 5px;
  color: var(--white);
}

.card.card_chat .tickets-uploader {
  padding: 10px;
  background: transparent;
  border-radius: 10px;
  border: 1px dashed var(--primary-color);
  height: 60px;
  display: flex;
  align-items: center;
}

.card.card_chat .card-body {
  display: flex;
  gap: 20px;
  flex-direction: column;
  justify-content: space-between;
}



/* Services modal Design */
.services_dsc_modal {
  border-radius: 22px;
  border: none;
  overflow: hidden;
}

.modal__close {
  position: absolute;
  top: 10px;
  right: 10px;
}

.modal__close .btn_modal_close {
  width: 40px;
  background: #ff2c2c;
  font-size: 18px;
  color: var(--white);
  border-radius: 50px;
  height: 40px;
  cursor: pointer;
}

.services_dsc_modal .service_header {
  background: var(--primary-color);
  background-repeat: no-repeat;
  background-position: right center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 20px 20px 0px 0px;
  padding: 10px 10px;
  min-height: auto;
  height: auto;
  color: var(--white);
}

.more_info_btn {
  width: 30px;
  height: 30px;
  display: flex;
  background: var(--primary-color);
  color: var(--white) !important;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
}

.service_header #service_name {
  display: block;
  font-family: var(--font-text);
  font-size: 20px;
  font-weight: 700;
  text-align: start;
  color: var(--text-white);
  margin-top: 10px;
}

.services_dsc_modal .services_body {
  padding: 20px 25px;
  background: var(--card-bg);
}

.services_body .other_info {
  display: flex;
  justify-content: space-around;
  text-align: center;
  margin-bottom: 25px;
}

.services_body .other_info .info_item {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.services_body .other_info .info_item .icon {
  width: 40px;
  height: 40px;
  background: var(--primary-color);
  color: var(--white);
  font-size: 18px;
  border-radius: 50px;
  margin: 0 auto;
  line-height: 40px;
}

.services_body .other_info .info_item .text {
  color: var(--black);
}

.services_body .other_info .info_item .text h4 {
  font-size: 18px;
  text-align: center;
  margin-bottom: 5px;
}

.services_body .other_info .info_item .text > span {
  font-size: 16px;
  display: block;
}

.services_body #service_des {
  font-size: 16px;
  background: #ff000017;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 20px;
  color: var(--black);
}




/* media query */
@media only screen and (max-width: 991px) {

  .section_gap,
  .footer_wrapper {
    padding: 30px 0px;
  }

  .section_bg {
    padding: 50px 10px;
  }


  #heroSection{
    padding: 100px 0px;
  }


  .sign_up_sec .card {
    padding: 30px;
  }

  .footer_logo img {
    width: 150px;
  }

  .faq .sub_title {
    margin-bottom: 20px;
  }

  .faq_custom_btn {
    margin-top: 20px;
  }

  .outter_button button {
    padding: 8px 15px;
  }

  .count_card_wrapper .card-data h4,
  .count_card_wrapper .card-data p.text-center {
    text-align: left !important;
  }

  .card_vertical .card-body {
    flex-direction: column;
    align-items: left;
  }

  .count_card_wrapper .icon {
    width: 70px;
    min-width: 70px;
    height: 70px;
  }


  .count_card_wrapper .icon img {
    width: 50px;
    min-width: 50px;
  }

  .custom-input,
  #dashboard .form-control {
    height: 40px;
    border-radius: 7px;
  }

  .custom-input .icon {
    font-size: 18px;
  }

  .card_sec_btn {
    margin-top: 30px;
  }

  .why_fst_gap {
    margin-top: 75px;
  }

  .who_we_sec {
    padding: 30px 15px;
  }

  .service_img img {
    width: 200px;
  }

  .acc_wrapper {
    padding: 25px 15px;
  }

  .swiper-slide {
    padding: 10px 50px;
  }

  .social_media_wrap{
    grid-template-columns: repeat(4, 1fr);
  }
}

@media only screen and (max-width: 767px) {
  .mobile_reverse {
    flex-direction: column-reverse;
    gap: 10px;
  }

  .header_btn_wrapper button {
    padding: 5px 15px;
  }

  .sign_up_sec .card {
    padding: 20px;
  }

  .custom-input .icon {
    font-size: 18px;
  }

  .copy_right_wrapper p {
    text-align: center;
  }

  .payment_methods {
    justify-content: center;
  }

  .footer_logo img {
    width: 100px;
  }

  #update_page .status_btn {
    min-width: auto;
    width: fit-content;
  }

  .faq .sub_title {
    margin-bottom: 15px;
  }

  .faq_custom_btn {
    margin-top: 15px;
  }

  .count_card_wrapper .icon {
    width: 50px;
    min-width: 50px;
    height: 50px;
  }

  .count_card_wrapper .icon img {
    width: 30px;
    min-width: 30px;
  }

  .custom-input .icon,
  .service_tab_style .icon,
  .social-card .icon {
    font-size: 16px;
  }

  .card_sec_btn {
    margin-top: 25px;
  }

  .why_fst_gap {
    margin-top: 50px;
  }

  .service_img img {
    width: 100px;
  }

  
  
  .fav {
    position: absolute;
    top: 5px;
    left: 5px;
  }

  .serv_category_card .serv_cat_card_header .category_name {
    font-size: 18px;
  }

  .serv_category_card .serv_cat_card_body .service_item,
  .serv_category_card .serv_cat_card_body .service_item.service_table_header {
    display: grid;
  }

  .serv_category_card .serv_cat_card_body .service_item.service_table_header {
    display: none !important;
  }

  .serv_category_card .serv_cat_card_body .service_item .id {
    grid-area: id;
    width: 100%;
    text-align: center;
  }

  .serv_category_card .serv_cat_card_body .service_item.service .services_name {
    font-size: 14px;
    grid-area: services;
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
  }

  .serv_category_card .serv_cat_card_body .service_item .rate {
    position: relative;
    grid-area: price;
    width: 100%;
    text-align: center;
  }

  .serv_category_card .serv_cat_card_body .service_item .rate::before {
    content: "Rate Per 1000";
  }

  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.min_order {
    display: block;
    position: relative;
    grid-area: min;
    width: 100%;
    text-align: center;
  }

  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.max_order {
    display: block;
    position: relative;
    grid-area: max;
    width: 100%;
    text-align: center;
  }

  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.min_order::before {
    content: "Min Order";
  }

  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.max_order::before {
    content: "Max Order";
  }

  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.min_order::before,
  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.max_order::before,
  .serv_category_card .serv_cat_card_body .service_item .rate::before {
    font-family: var(--font-text);
    font-size: 12px;
    color: #8f8f8f;
    position: absolute;
    top: -20px;
    text-align: center;
    display: block;
    width: 100%;
  }

  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.avg_time {
    font-size: 14px;
    grid-area: avgTime;
    display: block;
    width: 100%;
    text-align: center;
  }

  .serv_category_card .serv_cat_card_body .service_item .descriptions {
    grid-area: desc;
    width: 100%;
    text-align: center;
  }

  .serv_category_card .serv_cat_card_body .service_item.service {
    position: relative;
    display: grid;
    grid-template-areas:
      "id id id id id id"
      "services services services services services services"
      " price price min min max max"
      " avgTime avgTime avgTime avgTime avgTime avgTime"
      " desc desc desc desc desc desc";
    gap: 10px;
  }

  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.id
    > span,
  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.min_order
    > span,
  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.max_order
    > span,
  .serv_category_card
    .serv_cat_card_body
    .service_item.service
    > span.rate
    > span {
    font-size: 14px;
    padding: 5px 18px;
  }

  .serv_category_card .serv_cat_card_body {
    padding: 10px;
  }

  .btn_descriptions {
    font-size: 14px;
    padding: 5px 30px;
  }

  .services_dsc_modal .service_header {
    padding: 15px;
  }

  .services_dsc_modal .services_body {
    padding: 20px 10px;
  }

  .service_header #service_name {
    font-size: 16px;
  }

  .services_body .other_info .info_item .text h4 {
    font-size: 14px;
    margin-bottom: 0px;
  }

  .services_body .other_info .info_item .text > span {
    font-size: 14px;
    font-weight: var(--font-extra-bold);
  }

  .services_body .other_info .info_item {
    gap: 5px;
  }

  .service_header .btn_scondary {
    padding: 5px 20px;
    font-size: 14px;
  }

  .services_body #service_des {
    font-size: 12px;
  }
  
}

@media (max-width: 550px) {
  .text_18px {
    font-size: 16px;
  }

  .text_32px {
    font-size: 18px;
  }

  .count_card_wrapper .card-body {
    flex-direction: column;
    align-items: flex-start;
  }

  .card_vertical .card-body {
    text-align: left;
  }

  .card_sec_btn {
    margin-top: 20px;
  }

  .why_fst_gap {
    margin-top: 30px;
  }

 #heroSection{
  padding: 120px 0px;
 }
  .section_bg {
    padding: 30px 10px;
  }
}

/* Fixing Some Critical Issues */

@media only screen and (max-width:992px) {
  #dashboard .sidebar{
    transform: translateX(-100%);
    z-index: 99999;
  }
  .site_rtl #dashboard .sidebar{
    transform: translateX(100%);
  }
   .site_rtl .full_content{
    margin-right: 0px;
    width: 100%;
  }
  .sidebar-open .blur_effect{
    display: none;
  }
  .full_content{
    width: 100%;
    margin-left: inherit;
    margin-right: inherit;
  }
  .sidebar-open .header_logo_area{
    display: flex;
  }
 #dashboard.sidebar-closed .sidebar{
    transform: translateX(0px)!important;
  }
  .sidebar-closed .blur_effect{
    display: block;
  }
  .menu_item{
    margin-bottom: 5px;
  }
  .header_logo_area{
    gap: 8px;
  }
  .top_header .top_right{
    gap: 3px;
  }
  .currencyChangerTopHeader.dropdown-toggle{
    padding: 5px 8px;
    font-size: 12px;
  }
  .header_logo_area .logo img{
    width: 100px;
  }
  .day_night_toggler span{
    line-height: 0px;
  }
}

@media only screen and (max-width:768px) {
  .social_media_wrap {
      grid-template-columns: repeat(2, 1fr);
  }
  .social_media_wrap .social_media_btn{
    font-size: 14px;
  }
}

@media only screen and (max-width:550px) {
  .acc_features{
    display: grid;
    grid-template-columns: 1fr;
  }
}

.night-mode .serv_cat_card_body{
  background: var(--grey-dark);
}

.night-mode .serv_category_card .serv_cat_card_body .service_item.service .services_name{
  color: var(--white);
}

.status_btn.status_In,
.status_btn.status_قيد {
  background: #0dc0fc !important;
}


.status_btn.status_مكتمل,
.status_btn.status_Completed {
  background: #1cb474 !important;
}
.status_btn.status_نشط,
.status_btn.status_Active {
  background: #795af6 !important;
}
.status_btn.status_قيد,
.status_btn.status_Pending {
  background: #eda417 !important;
}
.status_btn.status_قيد,
.status_btn.status_Processing {
  background: #795af6 !important;
}
.status_btn.Rejected,
.status_btn.مرفوض,
.status_btn.status_مُلغى,
.status_btn.status_Canceled {
  background: #ec3d3d !important;
}
.status_btn.status_جزئي,
.status_btn.status_Partial {
  background: #d116bf !important;
}
.status_btn.status_متوقف,
.status_btn.status_Paused {
  background: #ff5721 !important;
}
.status_btn.status_منتهي,
.status_btn.status_Expired {
  background: #795af6 !important;
}
.status_btn.status_خطأ,
.status_btn.status_Error {
  background: #e2ff5e;
}

/* ── Fast70-specific dark mode (platform grid, details card) ── */
/* Select2 / pf-btn / search-dropdown dark mode is in the DARK MODE block above. */

/* Platform selector grid */
.night-mode .platforms-item__with-icon {
  background: var(--grey-dark);
  border-color: var(--dark-border-color);
  color: var(--grey);
}

.night-mode .platforms-item__with-icon:hover {
  border-color: var(--primary-color);
  color: var(--primary-color);
  background: rgba(139, 0, 0, 0.15);
}

.night-mode .platforms-item__with-icon.active {
  background: var(--primary-color);
  color: var(--white);
  border-color: var(--primary-color);
}

/* Details panel card */
.night-mode .custom-card-bg {
  background: var(--grey-dark);
  border-color: var(--dark-border-color);
}

.night-mode .serv_category_card .serv_cat_card_body .service_item.service_table_header > span{
  color: var(--white)!important;
}

.night-mode .social_media_wrap .social_media_btn{
  background:  #101011;
  color: var(--white);
}

.night-mode .services_body .other_info .info_item .text{
  color: var(--white);
}

.night-mode .services_body #service_des{
  color: var(--white);
}

.night-mode #order_page .order_page_custom_design .nav-link, .night-mode .table-body .table-row:hover{
  border-color: var(--primary-color)!important;
  background: #2d2d2d;
}

.night-mode .ticket_faq.faq_acc .accordion-button{
  background: var(--s2-subtle-bg);
    color: var(--primary-color)
}

.blog_post_image {
  width: 100%;
  height: 350px;
  border-radius: 20px;
  overflow: hidden;
  border-radius: 30px;
}


ul.pagination.rtl-pagination {
  position: relative;
  justify-content: center;
  width: 100%;
}

.pagination {display: flex;
align-items: center;gap 5px;}


.pagination li a {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #7e00003d;
  color: white;
  width: 30pxhei20px;
}


.custom-shape-divider-bottom-1626276266 {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  transform: rotate(180deg);
}



.custom-shape-divider-bottom-1626276266 svg {
  position: relative;
  display: block;
  width: calc(100% + 1.3px);
  height: 70px;
  transform: rotateY(180deg);
}


.custom-shape-divider-bottom-1626276266 .shape-fill{
  fill: var(--body-bg-day);
}

header.fixed-top.set_bg {
  background: #fff;
}

.make_whiter button#choose_lang{
  background: var(--white);
  color: var(--primary-color);
}

.make_whiter .nav-link{
  color: var(--white);
}
.make_whiter .fast_70_header a.nav-link.active{
  color: var(--white);
}

.make_whiter .color-logo{
 display: none;
}

.white-logo {
  display: none;
}

.make_whiter  .white-logo {
  display: block;
}
.make_whiter .nav_menu_btns .btn-primary,
.make_whiter .header_btn_wrapper .btn-outline-primary{
  background: var(--white);
  color: var(--primary-color)!important;
}

.make_whiter button.navbar-toggler{
  background: var(--white);
}
.pagination{
  margin: 25px 0px;
}
.pagination li a {
  display: flex;
  width: 40px;
  height: 40px;
  margin: 5px;
  border-radius: 10px;
  opacity: 1;
  color: var(--black);
  background: var(--white);
}
.pagination li.active a:hover,
.pagination li.active a{
  background: var(--primary-color);
  color: var(--white);
}

@media only screen and (max-width: 991px) {
  .make_whiter .fast_70_header a.nav-link.active,
  .make_whiter .nav-link{
    color: var(--black);
  }
  #navbarSupportedContent{
    background: var(--white);
  }
  
  .social_wrapper{
    grid-template-columns: repeat(2, 1fr);
    gap: 5px;
  }
}

.navbar-icon{
  font-size: 18px;
  margin-left: 3px;
}