/* Desktop contract workspace
   One viewport, one active panel, and one scroll owner inside each panel. */
body.ua-p-subscriber-contracts:not(.ua-android-app) #uaShellMain,
body.ua-p-subscriber-contracts:not(.ua-android-app) #uaWorkspaceHost,
body.ua-p-subscriber-contracts:not(.ua-android-app) #uaWorkspaceHost > .ua-wm-stage,
body.ua-p-subscriber-contracts:not(.ua-android-app) #uaWorkspaceHost > .ua-wm-stage > .ua-wm-pane.is-current {
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

html.ua-in-frame:has(body.ua-p-subscriber-contracts),
html.ua-in-frame body.ua-p-subscriber-contracts,
html.ua-in-frame body.ua-p-subscriber-contracts :is(#uaShellRoot, #uaShellMain, #uaWorkspaceHost) {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

html.ua-in-frame body.ua-p-subscriber-contracts #uaShellMain {
  flex: 1 1 auto !important;
}

html.ua-in-frame body.ua-p-subscriber-contracts #uaWorkspaceHost > .subscriber-contracts.is-desktop,
.ua-wm-pane.is-current > .subscriber-contracts.is-desktop {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

.subscriber-contracts.is-desktop {
  --sct-bg: #050d17;
  --sct-panel: #0b1828;
  --sct-panel-2: #0e1e31;
  --sct-input: #061423;
  --sct-line: rgba(137, 166, 199, .22);
  --sct-line-strong: rgba(137, 166, 199, .38);
  --sct-text: #edf4fb;
  --sct-muted: #91a5bb;
  --sct-gold: #f4bd2f;
  --sct-cyan: #47bce7;
  --sct-violet: #a58bfa;
  --sct-green: #42d9a2;
  --sct-red: #ff7a83;
  direction: rtl;
  box-sizing: border-box;
  width: 100% !important;
  height: calc(100dvh - 124px) !important;
  min-height: 0 !important;
  max-height: calc(100dvh - 124px) !important;
  overflow: hidden !important;
  padding: 10px 12px;
  background:
    radial-gradient(circle at 88% -15%, rgba(42, 126, 181, .21), transparent 34%),
    linear-gradient(180deg, #071321 0%, var(--sct-bg) 100%);
  color: var(--sct-text);
}

html.ua-in-frame body.ua-p-subscriber-contracts .subscriber-contracts.is-desktop {
  height: 100% !important;
  max-height: 100% !important;
}

.subscriber-contracts.is-desktop *,
.subscriber-contracts.is-desktop *::before,
.subscriber-contracts.is-desktop *::after {
  box-sizing: border-box;
}

.subscriber-contracts.is-desktop .sct-main {
  display: flex;
  width: 100%;
  height: calc(100dvh - 144px) !important;
  min-height: 0;
  max-height: calc(100dvh - 144px) !important;
  max-width: none;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
}

html.ua-in-frame body.ua-p-subscriber-contracts .subscriber-contracts.is-desktop .sct-main {
  height: 100% !important;
  max-height: 100% !important;
}

.subscriber-contracts.is-desktop .sct-main > * {
  order: 0 !important;
}

.subscriber-contracts.is-desktop .sct-heading {
  display: flex;
  min-height: 58px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 13px;
  border: 1px solid rgba(244, 189, 47, .26);
  border-radius: 13px;
  background: linear-gradient(100deg, rgba(14, 31, 51, .98), rgba(10, 23, 38, .98));
  box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
}

.subscriber-contracts.is-desktop .sct-heading > div {
  min-width: 0;
}

.subscriber-contracts.is-desktop .sct-heading > div > span,
.subscriber-contracts.is-desktop .sct-card-head > div > span {
  display: block;
  color: var(--sct-cyan);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
}

.subscriber-contracts.is-desktop .sct-heading h1 {
  margin: 1px 0 2px;
  color: #fff;
  font-size: 19px !important;
  line-height: 1.25;
}

.subscriber-contracts.is-desktop .sct-heading p {
  margin: 0;
  color: var(--sct-muted);
  font-size: 11px !important;
  line-height: 1.35;
}

.subscriber-contracts.is-desktop .sct-heading > a {
  display: inline-flex !important;
  min-width: 188px;
  min-height: 38px !important;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 8px;
  margin: 0 !important;
  padding: 0 13px !important;
  border: 1px solid var(--sct-line-strong) !important;
  border-radius: 9px !important;
  background: #102238 !important;
  color: #dce8f3 !important;
  font-size: 11px !important;
  text-decoration: none !important;
}

.subscriber-contracts.is-desktop .sct-alert {
  display: flex;
  min-height: 38px;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
  margin: 0 !important;
  padding: 7px 12px !important;
  border-radius: 9px !important;
  font-size: 11px !important;
}

.subscriber-contracts.is-desktop .sct-alert.is-success {
  border: 1px solid rgba(66, 217, 162, .35) !important;
  background: rgba(66, 217, 162, .1) !important;
  color: #8af0ca !important;
}

.subscriber-contracts.is-desktop .sct-alert.is-error {
  border: 1px solid rgba(255, 122, 131, .35) !important;
  background: rgba(255, 122, 131, .1) !important;
  color: #ffacb2 !important;
}

.subscriber-contracts.is-desktop .sct-tabs {
  position: relative;
  z-index: 3;
  display: flex;
  min-height: 44px;
  flex: 0 0 auto;
  gap: 6px;
  margin: 0;
  padding: 5px;
  border: 1px solid var(--sct-line);
  border-radius: 12px;
  background: rgba(6, 17, 30, .95);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .16);
}

.subscriber-contracts.is-desktop .sct-tabs a {
  position: relative;
  display: flex !important;
  min-width: 132px;
  min-height: 34px !important;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 7px;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #91a6bc !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  transition: background .16s ease, border-color .16s ease, color .16s ease;
}

.subscriber-contracts.is-desktop .sct-tabs a i {
  color: #7890aa;
  font-size: 13px;
}

.subscriber-contracts.is-desktop .sct-tabs a b {
  display: inline-flex;
  min-width: 21px;
  height: 21px;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  border-radius: 999px;
  background: #14273d;
  color: #aec0d2;
  font-size: 9px;
}

.subscriber-contracts.is-desktop .sct-tabs a:hover {
  border-color: var(--sct-line) !important;
  background: #0e2034 !important;
  color: #dbe7f2 !important;
}

.subscriber-contracts.is-desktop .sct-tabs a.is-active {
  border-color: rgba(71, 188, 231, .42) !important;
  background: linear-gradient(135deg, rgba(71, 188, 231, .18), rgba(40, 103, 153, .12)) !important;
  color: #f7fbff !important;
  box-shadow: inset 0 -2px 0 var(--sct-cyan);
}

.subscriber-contracts.is-desktop .sct-tabs a.is-active i {
  color: var(--sct-cyan);
}

.subscriber-contracts.is-desktop .sct-tabs a.is-active b {
  background: rgba(71, 188, 231, .2);
  color: #bcecff;
}

.subscriber-contracts.is-desktop .sct-panels {
  position: relative;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

/* The bulk export panel is a compact form, not a list workspace. Let its
   content define the panel height while the data-heavy panels keep the
   single-viewport scroll model above. */
.subscriber-contracts.is-desktop[data-active-panel="bulk-export"] .sct-panels {
  flex: 0 0 auto;
  overflow: visible;
}

.subscriber-contracts.is-desktop .sct-panels > [data-sct-panel] {
  display: none !important;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
}

.subscriber-contracts.is-desktop[data-active-panel="bulk-export"] .sct-panels > [data-sct-panel="bulk-export"] {
  height: auto;
}

.subscriber-contracts.is-desktop[data-active-panel="subscribers"] .sct-panels > [data-sct-panel="subscribers"] {
  display: grid !important;
}

.subscriber-contracts.is-desktop[data-active-panel="contracts"] .sct-panels > [data-sct-panel="contracts"],
.subscriber-contracts.is-desktop[data-active-panel="templates"] .sct-panels > [data-sct-panel="templates"],
.subscriber-contracts.is-desktop[data-active-panel="history"] .sct-panels > [data-sct-panel="history"],
.subscriber-contracts.is-desktop[data-active-panel="bulk-export"] .sct-panels > [data-sct-panel="bulk-export"] {
  display: flex !important;
}

.subscriber-contracts.is-desktop .sct-card {
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 10px 11px;
  border: 1px solid var(--sct-line);
  border-radius: 12px;
  background: linear-gradient(150deg, rgba(13, 29, 48, .98), rgba(8, 20, 34, .98));
  box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
}

.subscriber-contracts.is-desktop .sct-card-head {
  display: flex;
  min-height: 34px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.subscriber-contracts.is-desktop .sct-card-head h2 {
  margin: 1px 0 0;
  color: #fff;
  font-size: 14px !important;
}

.subscriber-contracts.is-desktop .sct-card-head > i,
.subscriber-contracts.is-desktop .sct-card-head > b {
  display: inline-flex;
  min-width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  border: 1px solid rgba(71, 188, 231, .28);
  border-radius: 8px;
  background: rgba(71, 188, 231, .08);
  color: var(--sct-cyan);
  font-size: 11px;
}

.subscriber-contracts.is-desktop .sct-workspace {
  grid-template-columns: minmax(330px, .8fr) minmax(520px, 1.2fr);
  gap: 9px;
  align-items: stretch;
}

.subscriber-contracts.is-desktop .sct-main.no-editor .sct-workspace {
  grid-template-columns: 1fr;
}

.subscriber-contracts.is-desktop .sct-workspace > .sct-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.subscriber-contracts.is-desktop .sct-search {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: minmax(0, 1fr) 92px;
  gap: 7px;
}

.subscriber-contracts.is-desktop :is(
  .sct-search input,
  .sct-editor input:not([type="checkbox"]),
  .sct-editor textarea,
  .sct-details input:not([type="checkbox"]),
  .sct-details textarea,
  .sct-mapping-row input
) {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  border: 1px solid rgba(71, 188, 231, .3) !important;
  border-radius: 8px !important;
  background: var(--sct-input) !important;
  color: #f2f7fc !important;
  outline: none !important;
  box-shadow: inset 3px 0 0 rgba(71, 188, 231, .22) !important;
  font-size: 12px !important;
}

.subscriber-contracts.is-desktop :is(
  .sct-search input,
  .sct-editor input:not([type="checkbox"]),
  .sct-details input:not([type="checkbox"]),
  .sct-mapping-row input
) {
  height: 38px !important;
  padding: 0 10px !important;
}

.subscriber-contracts.is-desktop :is(.sct-editor textarea, .sct-details textarea) {
  min-height: 72px;
  padding: 9px 10px !important;
  resize: vertical;
}

.subscriber-contracts.is-desktop :is(
  .sct-editor select,
  .sct-details select,
  .sct-bulk-options select,
  .sct-mapping-row select
) {
  width: 100% !important;
  height: 38px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid rgba(165, 139, 250, .38) !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #0b182b, #101a32) !important;
  color: #f2efff !important;
  outline: none !important;
  box-shadow: inset 3px 0 0 rgba(165, 139, 250, .28) !important;
  font-size: 11.5px !important;
}

/* Native Chromium menus open on a light system surface. Keep their option
   text dark and explicit instead of inheriting the closed field's pale text. */
.subscriber-contracts.is-desktop :is(
  .sct-editor select,
  .sct-details select,
  .sct-bulk-options select,
  .sct-mapping-row select
) option {
  background: #f8fafc !important;
  color: #111827 !important;
  font-weight: 800 !important;
}

.subscriber-contracts.is-desktop :is(
  .sct-editor select,
  .sct-details select,
  .sct-bulk-options select,
  .sct-mapping-row select
) option:disabled {
  color: #64748b !important;
}

.subscriber-contracts.is-desktop :is(input, textarea, select):focus {
  border-color: var(--sct-cyan) !important;
  box-shadow: 0 0 0 3px rgba(71, 188, 231, .1) !important;
}

.subscriber-contracts.is-desktop .sct-search button,
.subscriber-contracts.is-desktop .sct-primary {
  display: inline-flex !important;
  min-height: 38px !important;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 0 !important;
  padding: 0 13px !important;
  border: 1px solid #f7c64b !important;
  border-radius: 8px !important;
  background: linear-gradient(145deg, #f6c83f, #e9a91b) !important;
  color: #111a26 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  cursor: pointer;
}

.subscriber-contracts.is-desktop .sct-subscriber-list {
  display: grid;
  min-height: 0;
  flex: 1 1 auto;
  align-content: start;
  gap: 6px;
  margin-top: 7px;
  padding: 1px 0 1px 4px;
  overflow: auto;
  scrollbar-gutter: stable;
}

.subscriber-contracts.is-desktop .sct-main.no-editor .sct-subscriber-list {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.subscriber-contracts.is-desktop .sct-subscriber-list > a {
  display: grid !important;
  min-height: 48px;
  grid-template-columns: 32px minmax(0, 1fr) 12px;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  padding: 6px 8px !important;
  border: 1px solid rgba(137, 166, 199, .18) !important;
  border-radius: 9px !important;
  background: #091827 !important;
  color: var(--sct-text) !important;
  text-decoration: none !important;
}

.subscriber-contracts.is-desktop .sct-subscriber-list > a:hover,
.subscriber-contracts.is-desktop .sct-subscriber-list > a.is-selected {
  border-color: rgba(71, 188, 231, .48) !important;
  background: #10243a !important;
}

.subscriber-contracts.is-desktop .sct-subscriber-list > a > span {
  display: inline-flex;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: rgba(71, 188, 231, .1);
  color: var(--sct-cyan);
}

.subscriber-contracts.is-desktop .sct-subscriber-list h3 {
  margin: 0 0 2px;
  font-size: 11.5px !important;
}

.subscriber-contracts.is-desktop .sct-subscriber-list p {
  margin: 0;
  color: var(--sct-muted);
  font-size: 9px !important;
  direction: ltr;
  text-align: right;
}

.subscriber-contracts.is-desktop .sct-search-empty {
  display: flex;
  min-height: 70px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0;
  border: 1px dashed var(--sct-line);
  border-radius: 9px;
  color: var(--sct-muted);
  font-size: 11px;
}

.subscriber-contracts.is-desktop .sct-editor {
  overflow: auto !important;
  scrollbar-gutter: stable;
}

.subscriber-contracts.is-desktop .sct-editor > form,
.subscriber-contracts.is-desktop .sct-bulk-export-form {
  display: flex;
  min-height: 0;
  flex-direction: column;
  gap: 8px;
}

.subscriber-contracts.is-desktop .sct-editor label,
.subscriber-contracts.is-desktop .sct-details label {
  display: block;
  margin: 0;
}

.subscriber-contracts.is-desktop .sct-editor label > span,
.subscriber-contracts.is-desktop .sct-details label > span,
.subscriber-contracts.is-desktop .sct-bulk-options > label > span {
  display: block;
  margin: 0 0 5px;
  color: #cbd8e5;
  font-size: 10px;
  font-weight: 850;
}

.subscriber-contracts.is-desktop .sct-editor-source,
.subscriber-contracts.is-desktop .sct-data-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.subscriber-contracts.is-desktop .sct-data-preview {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.subscriber-contracts.is-desktop .sct-data-preview > div {
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid rgba(137, 166, 199, .13);
  border-radius: 8px;
  background: #071523;
}

.subscriber-contracts.is-desktop .sct-data-preview span {
  display: block;
  color: #7188a0;
  font-size: 9px;
}

.subscriber-contracts.is-desktop .sct-data-preview strong {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: #e5eef7;
  font-size: 10.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.subscriber-contracts.is-desktop .sct-checks,
.subscriber-contracts.is-desktop .sct-fill-status {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.subscriber-contracts.is-desktop .sct-checks label,
.subscriber-contracts.is-desktop .sct-toggle {
  display: flex !important;
  min-height: 38px;
  align-items: center;
  gap: 7px;
  margin: 0 !important;
  padding: 6px 9px;
  border: 1px solid rgba(66, 217, 162, .23);
  border-radius: 8px;
  background: rgba(66, 217, 162, .06);
}

.subscriber-contracts.is-desktop .sct-checks input,
.subscriber-contracts.is-desktop .sct-toggle input {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 auto;
  accent-color: var(--sct-green);
}

.subscriber-contracts.is-desktop .sct-checks span,
.subscriber-contracts.is-desktop .sct-toggle span {
  margin: 0 !important;
  color: #c6d6e3 !important;
  font-size: 10px !important;
}

.subscriber-contracts.is-desktop .sct-fill-status {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.subscriber-contracts.is-desktop .sct-fill-status span {
  display: flex;
  min-height: 31px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--sct-line);
  border-radius: 7px;
  background: #081725;
  color: #a6b7c9;
  font-size: 9.5px;
}

.subscriber-contracts.is-desktop .sct-fill-status i {
  color: var(--sct-violet);
}

.subscriber-contracts.is-desktop .sct-page-note,
.subscriber-contracts.is-desktop .sct-hint {
  margin: 0;
  padding: 7px 9px;
  border: 1px solid rgba(71, 188, 231, .18);
  border-radius: 8px;
  background: rgba(71, 188, 231, .07);
  color: #a7cee2;
  font-size: 9.5px;
  line-height: 1.55;
}

.subscriber-contracts.is-desktop #contracts,
.subscriber-contracts.is-desktop #history {
  flex-direction: column;
  overflow: hidden;
}

.subscriber-contracts.is-desktop .sct-contract-list,
.subscriber-contracts.is-desktop .sct-template-list,
.subscriber-contracts.is-desktop .sct-history {
  display: grid;
  min-height: 0;
  align-content: start;
  gap: 7px;
}

.subscriber-contracts.is-desktop .sct-contract-list {
  flex: 1 1 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-left: 4px;
  overflow: auto;
  scrollbar-gutter: stable;
}

.subscriber-contracts.is-desktop .sct-contract-list > article,
.subscriber-contracts.is-desktop .sct-template-list > article,
.subscriber-contracts.is-desktop .sct-history > article {
  min-width: 0;
  border: 1px solid rgba(137, 166, 199, .18);
  border-radius: 9px;
  background: #091827;
}

.subscriber-contracts.is-desktop .sct-contract-list > article {
  align-self: start;
  padding: 8px;
}

.subscriber-contracts.is-desktop .sct-contract-list header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 7px;
}

.subscriber-contracts.is-desktop .sct-contract-list header span,
.subscriber-contracts.is-desktop .sct-template-list article > div > span {
  color: var(--sct-cyan);
  font-size: 9px;
  font-weight: 800;
}

.subscriber-contracts.is-desktop :is(.sct-contract-list, .sct-template-list, .sct-history) h3 {
  margin: 2px 0 0;
  color: #edf4fb;
  font-size: 11.5px !important;
}

.subscriber-contracts.is-desktop .sct-contract-list header > b {
  padding: 4px 7px;
  border-radius: 7px;
  font-size: 8.5px;
  white-space: nowrap;
}

.subscriber-contracts.is-desktop .sct-contract-list header > b.is-printed {
  background: rgba(66, 217, 162, .12);
  color: #70e8bb;
}

.subscriber-contracts.is-desktop .sct-contract-list header > b.is-pending {
  background: rgba(244, 189, 47, .11);
  color: #f6cb68;
}

.subscriber-contracts.is-desktop .sct-contract-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}

.subscriber-contracts.is-desktop .sct-contract-meta span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 6px;
  border-radius: 6px;
  background: #061421;
  color: #879bb0;
  font-size: 8.5px;
}

.subscriber-contracts.is-desktop .sct-contract-meta i {
  color: var(--sct-cyan);
}

.subscriber-contracts.is-desktop .sct-contract-stale {
  margin: 6px 0 0;
  padding: 6px 7px;
  border: 1px solid rgba(244, 189, 47, .2);
  border-radius: 7px;
  background: rgba(244, 189, 47, .06);
  color: #d9bd77;
  font-size: 8.5px;
  line-height: 1.45;
}

.subscriber-contracts.is-desktop .sct-contract-list footer {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px solid rgba(137, 166, 199, .13);
}

.subscriber-contracts.is-desktop :is(.sct-contract-list footer, .sct-template-list footer) form {
  margin: 0;
}

.subscriber-contracts.is-desktop :is(.sct-contract-list footer, .sct-template-list footer) :is(a, button),
.subscriber-contracts.is-desktop .sct-mapping button {
  display: inline-flex !important;
  width: 100%;
  min-height: 31px !important;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin: 0 !important;
  padding: 0 7px !important;
  border: 1px solid rgba(71, 188, 231, .25) !important;
  border-radius: 7px !important;
  background: #10243a !important;
  color: #dce9f4 !important;
  font-size: 8.8px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  cursor: pointer;
}

.subscriber-contracts.is-desktop :is(.sct-delete-contract, .sct-delete-template) button {
  border-color: rgba(255, 122, 131, .3) !important;
  background: rgba(120, 35, 46, .17) !important;
  color: #ffabb1 !important;
}

.subscriber-contracts.is-desktop #templates {
  flex-direction: column;
  overflow: auto;
  scrollbar-gutter: stable;
}

.subscriber-contracts.is-desktop .sct-details {
  flex: 0 0 auto;
  margin: 0 0 7px;
  border: 1px solid var(--sct-line);
  border-radius: 9px;
  background: #081725;
  overflow: hidden;
}

.subscriber-contracts.is-desktop .sct-details > summary {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  color: #dbe6f0;
  font-size: 10.5px;
  cursor: pointer;
  list-style: none;
}

.subscriber-contracts.is-desktop .sct-details > summary > span {
  display: flex;
  align-items: center;
  gap: 7px;
}

.subscriber-contracts.is-desktop .sct-details > summary i {
  color: var(--sct-violet);
}

.subscriber-contracts.is-desktop .sct-details > form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 9px;
  border-top: 1px solid var(--sct-line);
}

.subscriber-contracts.is-desktop .sct-details > form > :is(.sct-hint, .sct-toggle, button) {
  align-self: end;
}

.subscriber-contracts.is-desktop .sct-template-list {
  flex: 0 0 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 1px;
}

.subscriber-contracts.is-desktop .sct-template-list > article {
  padding: 8px;
}

.subscriber-contracts.is-desktop .sct-template-list p {
  margin: 3px 0 0;
  overflow: hidden;
  color: #778da4;
  font-size: 9px;
  direction: ltr;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.subscriber-contracts.is-desktop .sct-template-list footer {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  margin-top: 7px;
}

.subscriber-contracts.is-desktop .sct-mapping {
  flex: 0 0 auto;
  margin-top: 8px;
  padding: 10px;
  border: 1px solid rgba(165, 139, 250, .28);
  border-radius: 10px;
  background: #081526;
}

.subscriber-contracts.is-desktop .sct-mapping > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 9px;
}

.subscriber-contracts.is-desktop .sct-mapping > header span {
  color: var(--sct-violet);
  font-size: 9px;
}

.subscriber-contracts.is-desktop .sct-mapping > header h3 {
  margin: 2px 0;
  font-size: 12px;
}

.subscriber-contracts.is-desktop .sct-mapping > header p {
  margin: 0;
  color: var(--sct-muted);
  font-size: 9.5px;
}

.subscriber-contracts.is-desktop .sct-mapping-labels,
.subscriber-contracts.is-desktop .sct-mapping-row {
  display: grid;
  grid-template-columns: minmax(210px, .85fr) minmax(280px, 1.15fr) 34px;
  gap: 7px;
  align-items: center;
}

.subscriber-contracts.is-desktop .sct-mapping-labels {
  padding: 0 2px 5px;
  color: var(--sct-muted);
  font-size: 9px;
}

.subscriber-contracts.is-desktop .sct-mapping-row {
  margin-bottom: 6px;
}

.subscriber-contracts.is-desktop .sct-mapping-row .sct-remove-row {
  min-width: 34px;
  padding: 0 !important;
  border-color: rgba(255, 122, 131, .28) !important;
  color: var(--sct-red) !important;
}

.subscriber-contracts.is-desktop .sct-mapping-empty {
  padding: 13px;
  border: 1px dashed var(--sct-line);
  border-radius: 8px;
  color: var(--sct-muted);
  text-align: center;
  font-size: 10px;
}

.subscriber-contracts.is-desktop .sct-mapping-form > footer {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  margin-top: 8px;
}

.subscriber-contracts.is-desktop .sct-mapping-form > footer button {
  width: auto;
  min-width: 160px;
}

.subscriber-contracts.is-desktop .sct-history {
  flex: 1 1 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-left: 4px;
  overflow: auto;
  scrollbar-gutter: stable;
}

.subscriber-contracts.is-desktop .sct-history > article {
  display: grid;
  align-self: start;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 8px;
  padding: 8px;
}

.subscriber-contracts.is-desktop .sct-history > article > span {
  display: inline-flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: rgba(71, 188, 231, .1);
  color: var(--sct-cyan);
}

.subscriber-contracts.is-desktop .sct-history p {
  margin: 3px 0;
  color: var(--sct-muted);
  font-size: 9.5px;
  line-height: 1.4;
}

.subscriber-contracts.is-desktop .sct-history small {
  color: #687f97;
  font-size: 8px;
  direction: ltr;
}

.subscriber-contracts.is-desktop .sct-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 24px 12px;
  border: 1px dashed var(--sct-line);
  border-radius: 9px;
  color: var(--sct-muted);
  text-align: center;
  font-size: 11px;
}

.subscriber-contracts.is-desktop .sct-bulk-export {
  flex-direction: column;
  overflow: visible;
}

.subscriber-contracts.is-desktop .sct-bulk-controlbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 12px;
  padding: 11px 12px;
  border: 1px solid #31506d;
  border-radius: 11px;
  background: linear-gradient(135deg, #0d2037, #102b47);
  box-shadow: inset 0 1px rgba(255,255,255,.025);
}

.subscriber-contracts.is-desktop .sct-bulk-sequence {
  display: grid;
  grid-template-columns: minmax(150px,1.05fr) minmax(140px,.9fr) minmax(240px,1.35fr) minmax(150px,1fr);
  align-items: end;
  gap: 9px;
  min-width: 0;
}

.subscriber-contracts.is-desktop .sct-bulk-step {
  position: relative;
  display: grid;
  gap: 5px;
  min-width: 0;
  margin: 0;
  padding-inline-start: 25px;
  color: #c7d5e4;
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}

.subscriber-contracts.is-desktop .sct-bulk-step::before {
  content: attr(data-step);
  position: absolute;
  inset-inline-start: 0;
  top: -1px;
  display: grid;
  place-items: center;
  width: 19px;
  height: 19px;
  border: 1px solid #4d7698;
  border-radius: 50%;
  background: #163552;
  color: #dceafa;
  font-size: 9px;
}

.subscriber-contracts.is-desktop .sct-bulk-step > span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.subscriber-contracts.is-desktop .sct-bulk-step :is(select,input) {
  width: 100%;
  height: 42px !important;
  min-width: 0;
  margin: 0;
  border: 1px solid #456582 !important;
  border-radius: 9px !important;
  padding: 0 10px !important;
  background: #0b1a2b !important;
  color: #f5f8fb !important;
  font: inherit;
  outline: none;
}

.subscriber-contracts.is-desktop .sct-bulk-step :is(select,input):focus {
  border-color: #21b8a0 !important;
  box-shadow: 0 0 0 3px rgba(33,184,160,.15) !important;
}

.subscriber-contracts.is-desktop .sct-bulk-pages > div {
  display: grid;
  grid-template-columns: minmax(0,1.2fr) minmax(86px,.8fr);
  gap: 6px;
}

.subscriber-contracts.is-desktop .sct-bulk-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  padding-inline-start: 12px;
  border-inline-start: 1px solid #34516c;
}

.subscriber-contracts.is-desktop .sct-bulk-icon {
  display: inline-flex;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  border: 1px solid #456582 !important;
  border-radius: 10px !important;
  color: #fff !important;
  font-size: 16px !important;
  cursor: pointer;
}

.subscriber-contracts.is-desktop .sct-word-icon {border-color:#4f86c8!important;background:#295f9a!important}
.subscriber-contracts.is-desktop .sct-pdf-icon {border-color:#d9545d!important;background:#9c2f3a!important}
.subscriber-contracts.is-desktop .sct-bulk-icon:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 14px rgba(7,21,34,.36)}
.subscriber-contracts.is-desktop .sct-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

.subscriber-contracts.is-desktop .sct-bulk-selection {
  margin: 0;
  border: 1px solid rgba(137,166,199,.18);
  border-radius: 9px;
  background: #081725;
}

.subscriber-contracts.is-desktop .sct-bulk-selection > summary {
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  padding: 0 10px;
  color: #cbd9e6;
  font-size: 9.5px;
  cursor: pointer;
  list-style: none;
}

.subscriber-contracts.is-desktop .sct-bulk-selection > summary::-webkit-details-marker{display:none}
.subscriber-contracts.is-desktop .sct-bulk-selection > summary span{display:flex;align-items:center;gap:7px}.subscriber-contracts.is-desktop .sct-bulk-selection > summary i{color:var(--sct-cyan)}
.subscriber-contracts.is-desktop .sct-bulk-selection > summary b{display:grid;place-items:center;min-width:26px;height:22px;padding:0 6px;border-radius:99px;background:#17324c;color:#bcecff}

.subscriber-contracts.is-desktop .sct-bulk-people {
  display: flex;
  max-height: 92px;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 4px;
  margin: 0;
  padding: 7px 9px 9px;
  border-top: 1px solid rgba(137,166,199,.15);
  overflow: auto;
}

.subscriber-contracts.is-desktop .sct-bulk-people > span{display:inline-flex;min-height:23px;align-items:center;gap:4px;padding:2px 7px;border:1px solid var(--sct-line);border-radius:6px;background:#0a1b2c;font-size:8px;white-space:nowrap}
.subscriber-contracts.is-desktop .sct-bulk-people i{color:var(--sct-cyan)}
.subscriber-contracts.is-desktop .sct-bulk-people small{color:#6f859d;font-size:7px}

.subscriber-contracts.is-desktop .sct-export-insight {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  padding: 7px;
  border: 1px solid var(--sct-line);
  border-radius: 9px;
  background: #071522;
}

.subscriber-contracts.is-desktop .sct-export-insight > div {
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  padding: 5px 8px;
  border: 1px solid rgba(137, 166, 199, .14);
  border-radius: 7px;
  background: #0a1a2b;
}

.subscriber-contracts.is-desktop .sct-export-insight > div span {
  color: var(--sct-muted);
  font-size: 9px;
}

.subscriber-contracts.is-desktop .sct-export-insight > div strong {
  color: #fff;
  font-size: 13px;
}

.subscriber-contracts.is-desktop .sct-export-insight > p,
.subscriber-contracts.is-desktop .sct-export-insight > details {
  grid-column: 1 / -1;
}

.subscriber-contracts.is-desktop .sct-export-insight > p {
  margin: 0;
  padding: 7px 9px;
  border-radius: 7px;
  background: rgba(71, 188, 231, .08);
  color: #9ed5eb;
  font-size: 9.5px;
}

.subscriber-contracts.is-desktop .sct-export-insight > p.is-filtered {
  background: rgba(66, 217, 162, .08);
  color: #80e7c1;
}

.subscriber-contracts.is-desktop .sct-export-insight > p.is-warning {
  background: rgba(244, 189, 47, .08);
  color: #e8ca7d;
}

.subscriber-contracts.is-desktop .sct-export-insight summary {
  color: #cbd9e6;
  font-size: 9.5px;
  cursor: pointer;
}

.subscriber-contracts.is-desktop .sct-export-insight ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin: 7px 0 0;
  padding: 0;
  list-style: none;
}

.subscriber-contracts.is-desktop .sct-export-insight li {
  display: grid;
  gap: 2px;
  padding: 6px 8px;
  border-radius: 7px;
  background: #0b1b2d;
}

.subscriber-contracts.is-desktop .sct-export-insight li strong {
  font-size: 9px;
}

.subscriber-contracts.is-desktop .sct-export-insight li span {
  color: #f0a2a8;
  font-size: 8px;
}

.subscriber-contracts.is-desktop .sct-export-progress {
  display: grid;
  gap: 6px;
  padding: 8px 10px;
  border: 1px solid rgba(66, 217, 162, .28);
  border-radius: 8px;
  background: rgba(66, 217, 162, .06);
}

.subscriber-contracts.is-desktop .sct-export-progress[hidden],
.subscriber-contracts.is-desktop [data-sct-panel][hidden] {
  display: none !important;
}

.subscriber-contracts.is-desktop .sct-export-progress header,
.subscriber-contracts.is-desktop .sct-export-progress footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 9px;
}

.subscriber-contracts.is-desktop .sct-export-progress header > span{display:flex;align-items:center;gap:7px}.subscriber-contracts.is-desktop .sct-export-progress header i{color:#5cdbb0}.subscriber-contracts.is-desktop .sct-export-progress.is-complete{border-color:rgba(66,217,162,.42);background:rgba(66,217,162,.1)}.subscriber-contracts.is-desktop .sct-export-progress.is-error{border-color:rgba(239,107,114,.42);background:rgba(169,47,59,.1)}.subscriber-contracts.is-desktop .sct-export-progress.is-error header i{color:#ff8f97}

.subscriber-contracts.is-desktop .sct-progress-track {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #05101b;
}

.subscriber-contracts.is-desktop .sct-progress-track i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #22b983, #56e3b1);
  transition: width .25s ease;
}

.subscriber-contracts.is-desktop button:disabled {
  cursor: not-allowed !important;
  filter: grayscale(.4) !important;
  opacity: .5 !important;
}

.subscriber-contracts.is-desktop :is(a, button) {
  transition: filter .15s ease, transform .15s ease, border-color .15s ease;
}

.subscriber-contracts.is-desktop :is(a, button):hover {
  filter: brightness(1.08);
}

@media (max-width: 1360px) {
  .subscriber-contracts.is-desktop .sct-workspace {
    grid-template-columns: minmax(300px, .72fr) minmax(470px, 1.28fr);
  }

  .subscriber-contracts.is-desktop .sct-main.no-editor .sct-subscriber-list,
  .subscriber-contracts.is-desktop .sct-contract-list,
  .subscriber-contracts.is-desktop .sct-history {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .subscriber-contracts.is-desktop .sct-tabs a {
    min-width: 110px;
  }
}

@media (max-width: 1050px) {
  .subscriber-contracts.is-desktop {
    height: auto !important;
    min-height: 100% !important;
    overflow: auto !important;
  }

  .subscriber-contracts.is-desktop .sct-main,
  .subscriber-contracts.is-desktop .sct-panels,
  .subscriber-contracts.is-desktop .sct-panels > [data-sct-panel] {
    height: auto;
    min-height: 0;
    overflow: visible;
  }

  .subscriber-contracts.is-desktop .sct-workspace {
    grid-template-columns: 1fr;
  }

  .subscriber-contracts.is-desktop .sct-workspace > .sct-card {
    min-height: 360px;
  }

  .subscriber-contracts.is-desktop .sct-tabs {
    overflow-x: auto;
  }

  .subscriber-contracts.is-desktop .sct-tabs a {
    min-width: 150px;
    flex: 0 0 auto;
  }

  .subscriber-contracts.is-desktop .sct-main.no-editor .sct-subscriber-list,
  .subscriber-contracts.is-desktop .sct-contract-list,
  .subscriber-contracts.is-desktop .sct-template-list,
  .subscriber-contracts.is-desktop .sct-history {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .subscriber-contracts.is-desktop .sct-bulk-options,
  .subscriber-contracts.is-desktop .sct-export-insight {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .subscriber-contracts.is-desktop .sct-bulk-controlbar{grid-template-columns:1fr}
  .subscriber-contracts.is-desktop .sct-bulk-sequence{grid-template-columns:repeat(2,minmax(0,1fr))}
  .subscriber-contracts.is-desktop .sct-bulk-actions{justify-content:center;padding:8px 0 0;border-inline-start:0;border-top:1px solid #294861}
}
