/*
 * UltraSMS shared UI polish layer.
 * Loaded after the vendor/theme styles so it can be removed safely if needed.
 */

:root {
  --usms-bg: #111827;
  --usms-bg-deep: #0b1426;
  --usms-panel: #ffffff;
  --usms-panel-soft: #f8fafd;
  --usms-border: #e6ebf4;
  --usms-border-strong: #d8e0ee;
  --usms-text: #1f2a44;
  --usms-text-soft: #526079;
  --usms-muted: #6b778f;
  --usms-field: #071a2f;
  --usms-field-border: #1c2b45;
  --usms-teal: #79cbc4;
  --usms-purple: #7367f0;
  --usms-orange: #e4562c;
  --usms-radius: 4px;
}

body.vertical-layout,
body.horizontal-layout {
  background: var(--usms-bg);
  color: var(--usms-text);
  font-family: "Inter", "Montserrat", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
}

body.vertical-layout *,
body.horizontal-layout * {
  letter-spacing: 0;
}

body.vertical-layout button,
body.vertical-layout input,
body.vertical-layout textarea,
body.vertical-layout select,
body.horizontal-layout button,
body.horizontal-layout input,
body.horizontal-layout textarea,
body.horizontal-layout select {
  font-family: inherit;
}

.dark-layout .app-content,
.semi-dark-layout .app-content,
body.vertical-layout .app-content,
body.horizontal-layout .app-content {
  background: var(--usms-bg);
}

.content-wrapper {
  color: #dce4f2;
}

body.blank-page .content-wrapper,
body.blank-page .content-body {
  color: #dce4f2;
}

body.blank-page p,
body.blank-page small,
body.blank-page label,
body.blank-page .form-label,
body.blank-page .form-check-label,
body.blank-page .custom-control-label,
body.blank-page .text-muted,
body.blank-page .text-body {
  color: #c7d0e2 !important;
}

.content-header .content-header-title,
.content-header-title,
.breadcrumb-item,
.breadcrumb-item a {
  color: #dce4f2 !important;
}

.breadcrumb-item.active,
.breadcrumb-item + .breadcrumb-item::before {
  color: #aeb8c9 !important;
}

.card,
.dark-layout .card,
.semi-dark-layout .card {
  background: var(--usms-panel);
  border: 1px solid var(--usms-border);
  border-radius: var(--usms-radius);
  box-shadow: none;
  color: var(--usms-text);
}

.card .card-header,
.dark-layout .card .card-header {
  background: transparent;
  border-bottom-color: var(--usms-border);
}

.card .card-title,
.card h1,
.card h2,
.card h3,
.card h4,
.card h5,
.card h6,
.dark-layout .card .card-title,
.dark-layout .card h1,
.dark-layout .card h2,
.dark-layout .card h3,
.dark-layout .card h4,
.dark-layout .card h5,
.dark-layout .card h6 {
  color: var(--usms-text);
  font-weight: 600;
}

.card p,
.card small,
.card .text-muted,
.dark-layout .card p,
.dark-layout .card small,
.dark-layout .card .text-muted {
  color: var(--usms-text-soft) !important;
}

.btn {
  border-radius: var(--usms-radius);
  font-weight: 500;
  box-shadow: none !important;
}

.btn-primary {
  background-color: var(--usms-purple) !important;
  border-color: var(--usms-purple) !important;
}

.btn-success {
  background-color: var(--usms-teal) !important;
  border-color: var(--usms-teal) !important;
  color: #071a2f !important;
}

.btn-info {
  background-color: #5dc6dd !important;
  border-color: #5dc6dd !important;
  color: #071a2f !important;
}

.btn-outline-secondary,
.btn-outline-primary,
.btn-outline-info {
  box-shadow: none !important;
}

.card .btn-outline-secondary,
.card .btn-outline-primary,
.card .btn-outline-info,
.modal-content .btn-outline-secondary,
.modal-content .btn-outline-primary,
.modal-content .btn-outline-info,
.table .btn-outline-secondary,
.table .btn-outline-primary,
.table .btn-outline-info {
  border-color: #34415d !important;
  color: #34415d !important;
}

.form-label,
label,
.dark-layout .form-label,
.dark-layout label {
  color: var(--usms-text-soft);
  font-weight: 500;
}

.form-control,
.form-select,
.input-group-text,
.dark-layout .form-control,
.dark-layout .form-select,
.dark-layout .input-group-text {
  background-color: var(--usms-field);
  border-color: var(--usms-field-border);
  border-radius: var(--usms-radius);
  color: #f7fbff !important;
  min-height: 2.45rem;
}

.form-control:disabled,
.form-control[readonly],
.dark-layout .form-control:disabled,
.dark-layout .form-control[readonly] {
  background-color: #2c3448;
  border-color: #3a4560;
  color: #f7fbff !important;
  opacity: 1;
}

.form-control::placeholder,
.dark-layout .form-control::placeholder {
  color: #d5dceb;
  opacity: 1;
}

.form-control:focus,
.form-select:focus,
.dark-layout .form-control:focus,
.dark-layout .form-select:focus {
  background-color: var(--usms-field);
  border-color: var(--usms-teal);
  box-shadow: 0 0 0 .12rem rgba(121, 203, 196, .25);
  color: #ffffff !important;
}

.form-select,
.dark-layout .form-select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='12' viewBox='0 0 16 12'%3E%3Cpath fill='none' stroke='%23f7fbff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M2 2.5 8 8.5l6-6'/%3E%3C/svg%3E") !important;
  background-position: right 1rem center !important;
  background-repeat: no-repeat !important;
  background-size: 1rem .75rem !important;
  padding-right: 2.75rem;
}

.form-select option {
  background-color: var(--usms-field);
  color: #ffffff;
}

.input-group {
  align-items: stretch;
}

.input-group .form-control,
.input-group .form-select,
.input-group .input-group-text {
  display: flex;
  align-items: center;
}

.card .input-group-text.bg-white,
.card .btn.bg-white,
.card .copy-to-clipboard.bg-white {
  background-color: #f7f9fd !important;
  border-color: var(--usms-border-strong) !important;
  color: #34415d !important;
}

.card .input-group-text.bg-white svg,
.card .btn.bg-white svg,
.card .copy-to-clipboard.bg-white svg {
  stroke: #34415d !important;
}

.select2-container--default .select2-selection--single,
.dark-layout .select2-container--default .select2-selection--single {
  background-color: var(--usms-field) !important;
  border-color: var(--usms-field-border) !important;
  border-radius: var(--usms-radius) !important;
  min-height: 2.45rem;
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.dark-layout .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #f7fbff !important;
  line-height: 2.45rem !important;
  padding-left: 1rem;
  padding-right: 2.75rem;
}

.select2-container--default .select2-selection--single .select2-selection__arrow,
.dark-layout .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 2.45rem !important;
  right: .75rem;
}

.select2-dropdown,
.dark-layout .select2-dropdown {
  background-color: #222a43 !important;
  border: 1px solid var(--usms-field-border) !important;
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, .35);
  color: #f7fbff !important;
}

.select2-search--dropdown {
  padding: .6rem;
}

.select2-search--dropdown .select2-search__field,
.dark-layout .select2-search--dropdown .select2-search__field {
  background-color: #2e3754 !important;
  border: 1px solid #67718e !important;
  border-radius: .45rem;
  color: #ffffff !important;
  outline: none;
}

.select2-container--default .select2-results__option,
.dark-layout .select2-container--default .select2-results__option {
  background-color: transparent !important;
  color: #f7fbff !important;
  font-weight: 500;
  padding: .75rem 1rem;
}

.select2-container--default .select2-results__option[aria-selected="true"],
.dark-layout .select2-container--default .select2-results__option[aria-selected="true"] {
  background-color: #394363 !important;
  color: #ffffff !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.dark-layout .select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--usms-accent) !important;
  color: #ffffff !important;
}

.select2-container--default .select2-results__option[aria-disabled="true"],
.dark-layout .select2-container--default .select2-results__option[aria-disabled="true"] {
  color: #9aa4bd !important;
}

.sync-dids-modal .select2-container--default .select2-selection--multiple,
.dark-layout .sync-dids-modal .select2-container--default .select2-selection--multiple {
  background-color: var(--usms-field) !important;
  border: 1px solid var(--usms-field-border) !important;
  border-radius: var(--usms-radius) !important;
  min-height: 2.75rem;
  padding: .35rem .45rem;
}

.sync-dids-modal .select2-container--default.select2-container--focus .select2-selection--multiple,
.dark-layout .sync-dids-modal .select2-container--default.select2-container--focus .select2-selection--multiple {
  border-color: var(--usms-accent) !important;
  box-shadow: 0 0 0 .15rem rgba(115, 103, 240, .2);
}

.sync-dids-modal .select2-container--default .select2-selection--multiple .select2-selection__choice,
.dark-layout .sync-dids-modal .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: rgba(115, 103, 240, .22) !important;
  border: 1px solid rgba(115, 103, 240, .55) !important;
  border-radius: .35rem;
  color: #ffffff !important;
  font-weight: 600;
  margin-top: .15rem;
  padding: .2rem .55rem .2rem 1.25rem;
}

.sync-dids-modal .select2-container--default .select2-selection--multiple .select2-selection__choice__remove,
.dark-layout .sync-dids-modal .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: #ffffff !important;
  left: .35rem;
}

.sync-dids-modal .select2-container--default .select2-search--inline .select2-search__field,
.dark-layout .sync-dids-modal .select2-container--default .select2-search--inline .select2-search__field {
  color: #ffffff !important;
  min-height: 1.75rem;
}

.sync-dids-dropdown.select2-dropdown,
.dark-layout .sync-dids-dropdown.select2-dropdown {
  background-color: #222a43 !important;
  border: 1px solid var(--usms-field-border) !important;
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, .35);
  color: #f7fbff !important;
}

.sync-dids-dropdown .select2-search--dropdown {
  padding: .6rem;
}

.sync-dids-dropdown .select2-search--dropdown .select2-search__field,
.dark-layout .sync-dids-dropdown .select2-search--dropdown .select2-search__field {
  background-color: #2e3754 !important;
  border: 1px solid #67718e !important;
  border-radius: .45rem;
  color: #ffffff !important;
  outline: none;
}

.sync-dids-dropdown .select2-results__option,
.dark-layout .sync-dids-dropdown .select2-results__option {
  color: #f7fbff !important;
  font-weight: 500;
  padding: .75rem 1rem;
}

.sync-dids-dropdown .select2-results__option[aria-selected="true"],
.dark-layout .sync-dids-dropdown .select2-results__option[aria-selected="true"] {
  background-color: #394363 !important;
  color: #ffffff !important;
}

.sync-dids-dropdown .select2-results__option--highlighted[aria-selected],
.dark-layout .sync-dids-dropdown .select2-results__option--highlighted[aria-selected] {
  background-color: var(--usms-accent) !important;
  color: #ffffff !important;
}

.ultrasms-country-dropdown.select2-dropdown,
.dark-layout .ultrasms-country-dropdown.select2-dropdown {
  background-color: #222a43 !important;
  border-color: #67718e !important;
  color: #f7fbff !important;
}

.ultrasms-country-dropdown .select2-results__option,
.dark-layout .ultrasms-country-dropdown .select2-results__option {
  color: #f7fbff !important;
}

.input-group-text svg,
.btn svg,
.dropdown-item svg,
.table svg {
  stroke-width: 2.25;
}

.table,
.dark-layout .table {
  color: var(--usms-text);
}

.table > :not(caption) > * > *,
.dark-layout .table > :not(caption) > * > * {
  background-color: var(--usms-panel);
  border-bottom-color: var(--usms-border);
  color: var(--usms-text);
}

.table thead th,
.dark-layout .table thead th,
table.dataTable thead th,
.dark-layout table.dataTable thead th {
  background-color: var(--usms-panel-soft) !important;
  border-color: var(--usms-border) !important;
  color: #354158 !important;
  font-size: .78rem;
  font-weight: 600;
}

.table tbody td,
.dark-layout .table tbody td {
  color: #2d3851 !important;
  vertical-align: middle;
}

.table-hover tbody tr:hover td,
.dark-layout .table-hover tbody tr:hover td {
  background-color: #fbfcff !important;
}

.dataTables_wrapper,
.dark-layout .dataTables_wrapper {
  color: var(--usms-text);
}

.dataTables_wrapper .dataTables_length label,
.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_info,
.dark-layout .dataTables_wrapper .dataTables_length label,
.dark-layout .dataTables_wrapper .dataTables_filter label,
.dark-layout .dataTables_wrapper .dataTables_info {
  color: var(--usms-text-soft) !important;
}

.dataTables_wrapper .dataTables_paginate .page-link {
  color: var(--usms-text-soft);
}

.dataTables_wrapper .page-item.active .page-link {
  background-color: var(--usms-teal);
  border-color: var(--usms-teal);
  color: #071a2f;
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_desc:after {
  color: #5c6880 !important;
  opacity: .9 !important;
}

.badge {
  border-radius: var(--usms-radius);
  font-weight: 500;
}

.dropdown-menu,
.dark-layout .dropdown-menu {
  background: #ffffff;
  border: 1px solid var(--usms-border);
  border-radius: var(--usms-radius);
  box-shadow: 0 12px 30px rgba(6, 17, 36, .16);
}

.dropdown-item,
.dark-layout .dropdown-item {
  color: var(--usms-text);
}

.dropdown-item:hover,
.dropdown-item:focus,
.dark-layout .dropdown-item:hover,
.dark-layout .dropdown-item:focus {
  background: #eef8f7;
  color: var(--usms-text);
}

.modal-content,
.dark-layout .modal-content {
  background: #ffffff;
  border-radius: var(--usms-radius);
  color: var(--usms-text);
}

.modal-header,
.modal-footer {
  border-color: var(--usms-border);
}

.modal-title,
.swal2-title {
  color: var(--usms-text) !important;
}

.swal2-popup {
  border-radius: var(--usms-radius) !important;
}

.alert {
  border-radius: var(--usms-radius);
}

.nav-tabs .nav-link,
.nav-pills .nav-link {
  border-radius: var(--usms-radius);
}

.main-menu,
.header-navbar,
.navbar-container {
  font-family: "Inter", "Montserrat", system-ui, sans-serif;
}

.main-menu {
  background: #0f1728 !important;
  border-right: 1px solid rgba(139, 151, 174, .14);
  box-shadow: none !important;
}

.main-menu .navbar-header,
.main-menu .main-menu-content,
.main-menu .navigation,
.main-menu.menu-dark,
.main-menu.menu-light {
  background: #0f1728 !important;
}

.main-menu .shadow-bottom {
  background: linear-gradient(180deg, #0f1728 30%, rgba(15, 23, 40, 0)) !important;
}

.main-menu .navigation {
  padding: .75rem .85rem 1.35rem !important;
}

.main-menu .navigation > li {
  margin: .35rem 0 !important;
}

.main-menu .navigation > li > a,
.main-menu .navigation .menu-content > li > a {
  align-items: center;
  background: transparent !important;
  border: 1px solid transparent;
  border-radius: 8px;
  box-shadow: none !important;
  color: #aab5c8 !important;
  display: flex;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0;
  min-height: 3.1rem;
  padding: .78rem 1rem !important;
}

.main-menu .navigation > li > a > svg,
.main-menu .navigation > li > a > i,
.main-menu .navigation .menu-content > li > a > svg,
.main-menu .navigation .menu-content > li > a > i {
  color: #7f8aa1 !important;
  height: 1.2rem;
  margin-right: 1rem !important;
  stroke: #7f8aa1 !important;
  width: 1.2rem;
}

.main-menu .navigation > li > a .menu-title,
.main-menu .navigation .menu-content > li > a .menu-item {
  color: inherit !important;
  line-height: 1.25;
}

.main-menu .navigation > li > a:hover,
.main-menu .navigation .menu-content > li > a:hover {
  background: rgba(31, 42, 62, .72) !important;
  color: #d7deeb !important;
}

.main-menu .navigation > li > a:hover > svg,
.main-menu .navigation > li > a:hover > i,
.main-menu .navigation .menu-content > li > a:hover > svg,
.main-menu .navigation .menu-content > li > a:hover > i {
  color: #d7deeb !important;
  stroke: #d7deeb !important;
}

.main-menu .navigation > li.open > a,
.main-menu .navigation > li.sidebar-group-active > a,
.main-menu .navigation > li.active > a {
  background: #1c2a2f !important;
  border-color: #78964f !important;
  color: #d9ff9c !important;
}

.main-menu .navigation > li.open > a > svg,
.main-menu .navigation > li.open > a > i,
.main-menu .navigation > li.sidebar-group-active > a > svg,
.main-menu .navigation > li.sidebar-group-active > a > i,
.main-menu .navigation > li.active > a > svg,
.main-menu .navigation > li.active > a > i {
  color: #d9ff9c !important;
  stroke: #d9ff9c !important;
}

.main-menu .navigation .menu-content {
  background: transparent !important;
  border-left: 1px solid #303a50;
  margin: .45rem 0 .65rem 1.85rem !important;
  padding: .25rem 0 .25rem .85rem !important;
}

.main-menu .navigation .menu-content > li {
  margin: .2rem 0 !important;
}

.main-menu .navigation .menu-content > li > a {
  color: #d4dbe8 !important;
  min-height: 2.8rem;
  padding: .65rem .85rem !important;
}

.main-menu .navigation .menu-content > li.active > a {
  background: #1c2a2f !important;
  border-color: #9fbe61 !important;
  box-shadow: 0 0 0 2px #f5f7fb !important;
  color: #d9ff9c !important;
}

.main-menu .navigation .menu-content > li.active > a > svg,
.main-menu .navigation .menu-content > li.active > a > i {
  color: #d9ff9c !important;
  stroke: #d9ff9c !important;
}

.main-menu .navigation .navigation-header span {
  color: #7f8aa1 !important;
  font-weight: 600;
}

.vertical-layout.vertical-menu-modern.menu-expanded .main-menu .navigation li.has-sub > a:after,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navigation li.has-sub > a:after,
.vertical-overlay-menu .main-menu .navigation li.has-sub > a:after {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23818da4' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") !important;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
}

.vertical-layout.vertical-menu-modern.menu-expanded .main-menu .navigation li.has-sub.open:not(.menu-item-closing) > a:after,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded .navigation li.has-sub.open:not(.menu-item-closing) > a:after,
.vertical-overlay-menu .main-menu .navigation li.has-sub.open:not(.menu-item-closing) > a:after {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d9ff9c' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") !important;
  transform: translateY(-50%) rotate(90deg);
}

.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu:not(.expanded) .navigation {
  padding-left: .75rem !important;
  padding-right: .75rem !important;
}

.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu:not(.expanded) .navigation > li > a {
  justify-content: center;
  min-height: 3rem;
  padding: .75rem !important;
}

.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu:not(.expanded) .navigation > li > a > svg,
.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu:not(.expanded) .navigation > li > a > i {
  margin-right: 0 !important;
}

.customer-account-card .customer-account-header {
  row-gap: 1rem;
}

.customer-account-card .uploadedAvatar {
  object-fit: cover;
}

.customer-account-card h5 {
  color: var(--usms-text);
  font-weight: 700;
}

.customer-account-card .customer-token-row {
  gap: .5rem;
  max-width: min(100%, 720px);
}

.customer-account-card .customer-token-field {
  flex: 1 1 620px;
  min-width: 420px;
}

.customer-account-card .customer-token-field .input-group-text:first-child {
  color: #34415d !important;
  flex: 0 0 auto;
  white-space: nowrap;
}

.customer-account-card .customer-token-field .form-control {
  min-width: 280px;
}

.customer-account-card .copy-to-clipboard {
  justify-content: center;
  min-width: 2.45rem;
}

.customer-account-card .customer-action-buttons {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

.customer-account-card .customer-action-buttons .btn {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  margin-bottom: .75rem !important;
  margin-right: 0 !important;
  min-height: 2.25rem;
  white-space: nowrap;
}

.customer-account-card .btn svg {
  flex: 0 0 auto;
  height: .95rem;
  margin-right: .35rem;
  width: .95rem;
}

@media (max-width: 767.98px) {
  .customer-account-card .customer-token-field {
    min-width: 0;
  }

  .customer-account-card .customer-account-actions {
    margin-left: 0 !important;
    width: 100%;
  }
}