*@import url(https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"); 
*@import url(https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600&display=swap"); 
/* ========== Base Reset & Typography ========== */
body, button, input, select, textarea {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-size: 14px;
  color: #1f2937;
}
h1, h2, h3, h4, h5 {
  font-family: 'Space Grotesk', sans-serif;
}

h1, h2, h3, h4 {
  font-weight: 600;
  margin-bottom: 0.75em;
  color: #111;
}

:root {
  --accent: #5262f1!important; /* or whatever modern color you want */
}
/* ========== Layout & Card ========== */
.section {
  background: #ffffff;
  border-radius: 16px;
/*  padding: 24px;
margin-bottom: 10px;/* troed to rmeove for drag and drop button but does not work*/
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.card {
  background: white;
  /*padding: 20px;*/
  border-radius: 14px;
  box-shadow: 0 2px 8px rgb(59 125 221 / 20%);
  /*margin-bottom: 20px;*/
  transition: 0.2s ease all;
    position: relative;
    z-index: 1; /* Keeps card under menus */
}

.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
}

label {
  font-size: 14px!important;
  font-weight: 500;
}

.cabuilder {   font-size: 17px!important;
  font-weight: 600; color: #3e4676;}


/* Keep the Enter Links label on one line and ignore any inline width */
/* force the "Enter Links" label to stay on one line */
.form-group[data-step="4"] label,
.form-group[data-step="4"] > div > label {
  display: inline-block !important;
  width: auto !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
  font-weight: 600; /* optional: keep labels medium-bold */
  margin-right: 8px!important;
}

/* ========== Form Inputs ========== */
input[type="text"], input[type="email"], input[type="url"], textarea, select {
  border: 1px solid #d6dce5;
  border-radius: 12px;
  padding: 12px 16px;
  width: 100%;
  font-size: 15px;
  transition: border 0.2s ease;
}

input:focus, select:focus, textarea:focus {
  border-color: #6a5acd;
  outline: none;
}

/* ========== Buttons ========== */

.button,
.btn {
  font-size: 13px;
  padding: 6px 12px;
  border-radius: 6px;
  font-weight: 500;
  background-color: #f6f8fc;
  color: #444;
  border: 1px solid #ddd;
  /*margin-right: 6px;*/
}

.btn-primary {
  background-color: #5262f1;
    color: #fff;
    border: none;
  };

.btn:hover, .button:hover {
  background-color: #eef2ff;
  color: #222!important;
}
.btn-secondary {
  background-color: #f6f8fc;
  color: #444;
  font-size: 13px;
  padding: 6px 12px;
  border-radius: 6px;
  font-weight: 500;
  border: 1px solid #d0d4da;
  transition: all 0.2s ease;
}

.btn-secondary:hover {
  background-color: #eaeef7!important;
  color: #222!important;
  border-color: #cbd1da;
}

.btn-primary:hover {
  background-color: #5f6eaf!important;
  color: #fff!important;
}
.btn-primary:hover,
.btn-secondary:hover,
.btn:hover,
.button:hover{
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

/* ========== Tables ========== */
table {
  width: 100%;
  border-spacing: 0;
  border-collapse: separate;
}

th {
  background-color: #f6f7fe;
  color: #333;
  text-align: left;
  padding: 14px;
  font-weight: 600;
  font-size: 14px;
}

td {
  background-color: #fff;
  padding: 14px;
  border-bottom: 1px solid #f0f0f0;
  font-size: 14px;
}

tr:hover td {
  background-color: #f5f9ff;
}*/
  /* Table structure 
  table.dataTable {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background-color: #ffffff;
    border-radius: 8px;
    overflow: hidden;
  }
  
  /* Headers */
  table.dataTable thead th {
    background-color: #f4f5f7;  /* soft gray */
    color: #1f2937;
    font-size: 13px;
    font-weight: 600;
    padding: 10px 14px;
    /*border-bottom: 1px solid #e2e8f0;*/
    text-transform: uppercase;
  }

  /* Body row */
  table.dataTable tbody tr {
    background-color: #ffffff;
    transition: background-color 0.2s ease;
  }
/* Zebra stripe for subtle rows */
  table.dataTable tbody tr:nth-child(even) {
    background-color: #f9fafb;  /* subtle zebra */
  }

  /* Row hover (soft blue tint) */
  table.dataTable tbody tr:hover {
    background-color: #eef4ff;
  }


  /* Table cells */
  table.dataTable tbody td {
    font-size: 14px;
    padding: 10px 14px;
    border-bottom: 1px solid #f1f3f5;
    vertical-align: middle;
    color: #333;
  }

  /* Make link columns look more readable */
  td a.shortlink {
    font-weight: 600;
    color: #4f46e5;
    text-decoration: none;
  }

  td a.shortlink:hover {
    text-decoration: underline;
  }

/* Optional: color tags based on value (sample only) */
td.category[data-value*="Salesforce"] {
  background-color: #eaf4ff;
  color: #1e3a8a;
  font-weight: 600;
  border-radius: 6px;
  padding: 4px 10px;
}
.dataTables_wrapper {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
  border-radius: 12px;
  background-color: white;
  padding: 12px;
}*/


/* ========== Sidebar ========== */
.sidebar-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  border-radius: 12px;
  transition: background 0.3s ease;
}

.sidebar-icon:hover {
  background-color: #e9efff;
}

/* ========== Utility ========== */
.mt-2 { margin-top: 16px; }
.mt-4 { margin-top: 32px; }
.mb-2 { margin-bottom: 16px; }
.mb-4 { margin-bottom: 32px; }

/* ========== utm_campaign from tags ========== */
.badge {
    background-color: #5262f1bd;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    padding: 10px 15px;
    border-radius: 6px;
    display: inline-block;
    margin: 1px 0;
  }
  font-size: 13px;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 6px;
  display: inline-block;
}
.badge-primary {
  background-color: #5262f1!important;
  line-height: 1.2;
  color: #eee!important;
  margin: 2px 2px;
}

.bg-primary {
  background-color: #5262f1 !important;
  color: #fff !important;
  font-size: 90%!important;
}

.link-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}
/* KEEP base outline-danger color */
/* Fix for red delete buttons (override .btn styles safely) */
.btn-danger,
.btn.btn-danger {
  background-color: var(--color-red-default) !important;
  color: white !important;
  border: 1px solid var(--color-red-default) !important;
}

.btn-danger:hover,
.btn.btn-danger:hover {
  background-color: #d9342b !important; /* darken a bit for hover */
  border-color: #d9342b !important;
  color: white !important;
}

/* Outline red button version */
.btn-outline-danger,
.btn.btn-outline-danger {
  background-color: transparent !important;
  border: 1px solid var(--color-red-default) !important;
  color: var(--color-red-default) !important;
}

.btn-outline-danger:hover,
.btn.btn-outline-danger:hover {
  background-color: var(--red-light) !important;
  border-color: var(--color-red-default) !important;
  color: var(--color-red-default) !important;
}

/*========== remove border for cards =======*/

div.dataTables_wrapper {
  border: none !important;

}
/*========== consistent icon spacing =======*/
.btn i {
  margin-right: 1px;
  margin-left: 1px;
}

/*========== consistent icon favorite =======*/
.btn-outline-primary.favorite {
  color: var(--color-blue-default); /* original blue */
  border-color: var(--color-blue-default);
  background-color: transparent;
  transition: all 0.2s ease;
}

.btn-outline-primary.favorite:hover {
  background-color: var(--blue-light);  /* soft blue tint */
  color: var(--color-blue-default);     /* keep icon visible */
  border-color: var(--color-blue-default);
}

.btn-outline-primary.favorite i {
  color: inherit; /* ensure the icon inherits blue */
}
.btn-outline-primary.favorite.active i:before {
  content: "\f004"; /* solid heart icon if you're using FontAwesome */
  color: var(--color-blue-default);
}
/*===========fix icons left-right centering========*/
/* === Reusable Icon-Only Button Style === */
.btn-icon-only {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border-radius: 6px;
  font-size: 14px;
  line-height: 1;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.btn-icon-only i {
  pointer-events: none; /* Ensure icon doesn't block clicks */
  line-height: 1;
}

/* === Reusable Icon-Only Button Style === */
.btn-icon-only {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border-radius: 6px;
  font-size: 14px;
  line-height: 1;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.btn-icon-only i {
  pointer-events: none; /* Ensure icon doesn't block clicks */
  line-height: 1;
}
body, button, input, select, textarea {
  font-family: 'Inter', 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px;
  color: #1f2937; /* soft dark */
}
.btn {
  font-family: inherit;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.btn-icon-only:hover i {
  color: inherit;
}

/*====== top menu=====*/

.lw-top-menu {
  display: flex;
  /*gap: 10px;*/
  padding: 8px 0;
  list-style: none;
}

.lw-top-menu li a {
  display: inline-block;
  padding: 6px 12px;
  font-size: 15px;
  font-weight: 500;
  color: #444;
  background-color: #f6f8fc;
  border: 1px solid #d0d4da;
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.lw-top-menu li a:hover {
  background-color: #e6e9f0;
  color: #222;
  border-color: #c6cbd4;
}

.lw-top-menu li a.active {
  background-color: #d9e1f3;
  color: #1a1a1a;
  border-color: #a8b6d2;
}
.lw-top-menu a {
  /* remove position: relative; */
  display: block;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s ease;
}

/*===== tooptip =====*/
.tooltip-inner {
  background-color: #5262f1 !important; /* or your desired color */
  color: #fff; /* optional: for tooltip text color */
  font-size: 13px;
  border-radius: 4px;
}

/*====== sidebar ======*/
/* Tighten sidebar submenu padding and prevent wrapping */
.sidebar .sidebar-nav .menu-item .sidebar-link {
  padding-left: 14px!important; /* reduce left padding */
  white-space: nowrap !important; /* keep on one line */
  font-size: 14px;
}

.sidebar .sidebar-nav .menu-item .sidebar-link i {
  width: 16px !important; /* tighten icon space */
  margin-right: 8px !important; /* reduce spacing between icon and text */
}
.sidebar .menu-item .dropdown-menu {
  padding-left: 8px;
}


/* Main items */
.sidebar .sidebar-nav > .menu-item > .sidebar-link {
  padding-left: 14px !important;
}

/* Submenu items inside .sidebar-dropdown */
.sidebar .sidebar-dropdown .sidebar-item > .sidebar-link {
  padding-left: 25px !important;
}

/* Add an arrow before each submenu link */
.sidebar-dropdown > li > a::before {
  content: "→";
  display: inline-block;
  position: relative;
  left: -8px;
  margin-right: 6px;
  color: #203a45; /* match your color scheme */
  font-size: 90%!important;
  transition: transform 0.2s ease;
}

/* Optional: animate the arrow on hover */
.sidebar-dropdown > li > a:hover::before {
  transform: translateX(4px);
  color: var(--color-blue-default, #007bff); /* optional highlight */
}
.sidebar-dropdown > li > a {
  padding-left: 25px !important; /* tweak this to reduce spacing if needed */
}  

/* Keep background for main active menu item */
.sidebar-item.active > .sidebar-link {
  background: #e3edf84f !important;
  font-weight: 500;
}

/* Override background for active subitems */
.sidebar-dropdown .sidebar-item.active > .sidebar-link {
  background: none !important;
  font-weight: 600 !important;
  color: #203145 !important;
}
/* Tag Formatting page*/

#tag-settings-content .settings li input:checked + label {
  background: #5262f1!important;
}

#tag-settings-content .settings li label {
  border: 1px solid #5262f1!important;
  padding: 5px 15px !important;
    
  .tag-settings-content .settings li .radio-button label {
    padding: 5px 15px!important;
  }
  
  .form-group.req-tags, .form-group req-tag {
    box-shadow: 0 5px 30px rgb(77 139 170 / 10%)!important;
    border: 1px solid #d8e7f7c7 !important;
    box-sizing: border-box;
  }
  
  .tag-settings-content .visual-tag-settings .blue {
    color: #5262f1!important;
  }
  
  span.ttp {
    font-size: 12px!important;
    color: #5262f1!important;
  }
  
  .tagify {
  box-shadow: 0 5px 30px rgb(77 139 170 / 10%)!important;
  border: 1px solid #d8e7f7c7 !important;

  }
  
  /* sidebar collapse when padding is an issue*/
  
  .sidebar .sidebar-nav,
  .sidebar .sidebar-link span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  
  .sidebar.collapsed .sidebar-link span {
    display: none; /* hide label text when collapsed */
  }
  
  /* fix for the Team Page button misalignment */

  .d-inline-block {
    flex-wrap: wrap!important;
    justify-content: flex-start!important;
    align-items: center;
    gap: 10px;
    margin-bottom: 5px;
  }
  
  /*news banners*/
  .dash-block-left {
    background: #816aab!important;
    
  
    .dash-block-right {
      background: #ebfaf5!important;
      
      
      /*utm tags icon tracking php under <div class="key-tag-buttons mt-2 utm-tag-controls">*/
      /* Left block: Buttons */
      .utm-header-row {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 20px;
      }
      
      .key-tag-buttons {
        width: 225px;
        flex-shrink: 0;
        display: flex;
        margin-right: 20px;
        gap: 6px;
        align-items: center;
      }
      
      .utm-header-row .nav-tabs {
        flex-grow: 1;
        display: flex;
        justify-content: flex-end; /* ✅ RIGHT-ALIGNED TABS */
        gap: 10px;
        border-bottom: none;
        flex-wrap: wrap;
      }
      
      #channelsSwitch {
        display: flex;
        justify-content: flex-end;
        flex-wrap: wrap;
        flex-grow: 1;
        min-width: 0;
        gap: 10px;
      }
      /* style the click and ad builder buttons for ading links*/
            /* Campaign method toggle */
            #ct-campaign-methods .btn-group {
              display: flex;
              gap: 6px;
            }
            #ct-campaign-methods .btn-group .btn {
              font-size: 11px;
              line-height: 1.2;
              padding: 8px 12px;
              min-height: 36px;
              border-radius: 8px;
              display: inline-flex;
              align-items: center;
              justify-content: center;
            }
            #ct-campaign-methods .btn-check:checked + .btn {
              background: #5262f1!important;
              border-color: #5262f1!important;
              color: #fff;
            }
            #ct-campaign-methods legend { margin-bottom: 6px !important; }
      
            /* util to hide groups when switching */
            .ct-hidden { display: none !important; }
      #ct-link-methods .btn-check:checked + .btn, #ct-campaign-methods .btn-check:checked + .btn {
        background: #5262f1!important;
        border-color: #5262f1!important;
        color: #fff;}
      
      /* ===== Toggles (links + campaign name) ===== */
      #ct-link-methods .btn-group,
      #ct-campaign-methods .btn-group {
        display: flex;
        gap: 6px;
      }
      #ct-link-methods .btn-group .btn,
      #ct-campaign-methods .btn-group .btn {
        font-size: 11px;
        line-height: 1.2;
        padding: 8px 12px;
        min-height: 36px;
        border-radius: 8px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }
      
      /* Brand color for radios (outline + checked + hover + focus) */
      #ct-link-methods .btn-outline-secondary,
      #ct-campaign-methods .btn-outline-secondary {
        color: #5262f1;
        border-color: #5262f1;
      }
      #ct-link-methods .btn-outline-secondary:hover,
      #ct-campaign-methods .btn-outline-secondary:hover {
        color: #5262f1;
        background: rgba(82, 98, 241, 0.08);
        border-color: #5262f1;
      }
      #ct-link-methods .btn-check:checked + .btn-outline-secondary,
      #ct-campaign-methods .btn-check:checked + .btn-outline-secondary {
        color: #fff;
        background: #5262f1;
        border-color: #5262f1;
      }
      #ct-link-methods .btn-check:focus + .btn,
      #ct-campaign-methods .btn-check:focus + .btn,
      #ct-link-methods .btn:focus,
      #ct-campaign-methods .btn:focus {
        outline: none;
        box-shadow: 0 0 0 .2rem rgba(82, 98, 241, 0.25);
      }
      
      /* Tighten legends 
      #ct-link-methods legend,
      #ct-campaign-methods legend { margin-bottom: 6px !important; }*/

      /* Hide the "Enter Links*" label in the Links section */
      .form-group[data-step="4"] > label,
      .form-group[data-step="4"] > div > label {
        display: none !important;
      }
        
      /* hero +  centralized script*/
    
        .ct-hero .ttp i{
          font-size: 1em;             /* keep the FA icon tight */
          line-height: 1;
        }
      
        /* Optional: make Bootstrap tooltip a touch larger and pretty */
        .tooltip .tooltip-inner{
          font-size: 13px;
          border-radius: 4px;
        }
      .ct-hero__subtitle:empty { display: none; }
      
      /* optimize cmapaigns modal look*/
      
      /* Campaign Settings modal polish */
      #showCampaignSettingsPopup .modal-dialog {
        max-width: 720px;
      }
      
      #showCampaignSettingsPopup .modal-content {
        border: 1px solid rgba(0,0,0,.06);
        border-radius: 14px;
        box-shadow: 0 10px 40px rgba(28, 44, 99, 0.18);
        overflow: hidden;
      }
      
      #showCampaignSettingsPopup .modal-header {
        display: flex;
        align-items: center;
        gap: .5rem;
        background: #f7f9fc;
        border-bottom: 1px solid rgba(0,0,0,.06);
        padding: 14px 18px;
      }
      
      #showCampaignSettingsPopup .modal-title {
        font-size: 1.1rem;
        font-weight: 600;
        margin: 0;
      }
      
      #showCampaignSettingsPopup .btn-close,
      #showCampaignSettingsPopup .close {
        opacity: .6;
      }
      
      #showCampaignSettingsPopup .modal-body {
        padding: 16px 18px 6px;
    /* ===== Modern sheet for Campaign Settings modal ===== */
    :root{
      --ct-indigo:#5666f6;         /* primary (Save) */
      --ct-indigo-600:#4352f0;
      --ct-indigo-100:#eef1ff;
      --ct-slate-900:#0f172a;       /* text strong */
      --ct-slate-700:#334155;       /* text */
      --ct-slate-500:#64748b;       /* subtext */
      --ct-line:#e9ecf3;            /* dividers */
      --ct-bg:#ffffff;              /* surface */
      --ct-radius:18px;
      --ct-shadow:0 18px 60px rgba(10, 22, 70, .18);
    }
        
    /* container & surface */
    #showCampaignSettingsPopup .modal-dialog.modal-elevated{
      max-width: 720px;
      margin: 6vh auto;
    }
    #showCampaignSettingsPopup .modal-content{
      background: var(--ct-bg);
      border: 0;
      border-radius: var(--ct-radius);
      box-shadow: var(--ct-shadow);
      overflow: hidden;
    }
        
    /* header */
    #showCampaignSettingsPopup .modal-header{
      background: linear-gradient(0deg, #fff, #fff);
      border: 0;
      border-bottom: 1px solid var(--ct-line);
      padding: 18px 22px;
    }
    #showCampaignSettingsPopup .modal-title{
      font-weight: 700;
      font-size: 20px;
      color: var(--ct-slate-900);
      margin: 0;
      letter-spacing: .2px;
    }
    #showCampaignSettingsPopup .btn-close,
    #showCampaignSettingsPopup .modal-header .close{
      opacity: .6;
    }
    #showCampaignSettingsPopup .btn-close:hover,
    #showCampaignSettingsPopup .modal-header .close:hover{ opacity:.9; }
        
    /* body */
    #showCampaignSettingsPopup .modal-body{
      padding: 18px 22px 6px;
    }
    #showCampaignSettingsPopup .section{
      padding: 14px 0;
      border-top: 1px solid var(--ct-line);
    }
    #showCampaignSettingsPopup .section:first-child{ border-top: 0; }
        
    #showCampaignSettingsPopup .section h6{
      font-size: 13px;
      font-weight: 700;
      color: var(--ct-slate-700);
      margin: 0 0 8px;
      letter-spacing:.2px;
      text-transform: none;
    }
        
    #showCampaignSettingsPopup .control-row{
      display:flex; align-items:flex-start; gap:12px;
      padding: 10px 0;
    }
    #showCampaignSettingsPopup .control-row .label{
      font-weight: 700; color: var(--ct-slate-900);
    }
    #showCampaignSettingsPopup .control-row .help{
      color: var(--ct-slate-500); font-size: 13px; margin-top: 2px;
    }
        
    /* inputs (role invite style) */
    #showCampaignSettingsPopup .input-pill{
      display:flex; align-items:center; gap:10px;
      border:1px solid var(--ct-line);
      border-radius: 12px;
      padding: 10px 12px;
      background:#fff;
    }
    #showCampaignSettingsPopup .input-pill input[type="text"],
    #showCampaignSettingsPopup .input-pill input[type="email"]{
      border:0; outline:0; width:100%; background:transparent;
      font-size:14px; color:var(--ct-slate-900);
    }
    #showCampaignSettingsPopup .input-pill select{
      border:0; outline:0; background:#f7f8fd; border-radius:8px;
      padding:8px 10px; font-size:13px;
    }
        
    /* checkboxes – modernized */
    #showCampaignSettingsPopup .form-check{
      display:flex; align-items:flex-start; gap:12px;
      padding: 10px 2px;
    }
    #showCampaignSettingsPopup .form-check-input{
      width:18px; height:18px; margin-top:2px; cursor:pointer;
      border:1.5px solid #c7cfdb;
      border-radius:6px;
    }
    #showCampaignSettingsPopup .form-check-input:checked{
      background: var(--ct-indigo);
      border-color: var(--ct-indigo);
    }
    #showCampaignSettingsPopup .form-check-label{
      line-height:1.25;
    }
    #showCampaignSettingsPopup .form-check-label .title{
      font-weight:700; color:var(--ct-slate-900);
    }
    #showCampaignSettingsPopup .form-check-label .sub{
      display:block; color:var(--ct-slate-500); font-size:13px; margin-top:2px;
    }
        
    /* footer buttons */
    #showCampaignSettingsPopup .modal-footer{
      border:0; padding: 16px 22px 22px;
      display:flex; justify-content:flex-end; gap:10px;
    }
    #showCampaignSettingsPopup .btn-cancel{
      background:#fff; color:var(--ct-slate-700);
      border:1px solid var(--ct-line);
      border-radius:12px; padding:10px 16px; font-weight:600;
    }
    #showCampaignSettingsPopup .btn-cancel:hover{ background:#f9fafc; }
        
    #showCampaignSettingsPopup .btn-save{
      background: var(--ct-indigo); color:#fff;
      border:0; border-radius:12px; padding:10px 18px; font-weight:700;
    }
    #showCampaignSettingsPopup .btn-save:hover{ background: var(--ct-indigo-600); }
        
    /* tiny tooltip/icon polish inside modal */
    #showCampaignSettingsPopup [data-bs-toggle="tooltip"] i{
      font-size: .95em; opacity: .9; vertical-align: -2px;
    }
        
        /* cog polish*/
        .ct-hero .ct-hero-gear.btn {
          border: 1px solid rgba(255,255,255,.25);
          background: rgba(255,255,255,.08);
          color: #fff;
          border-radius: 10px;
          padding: 6px 10px;
        }
        .ct-hero .ct-hero-gear.btn:hover {
          background: rgba(255,255,255,.16);
          border-color: rgba(255,255,255,.35);
        }
  
        
        /* ---------- Click & Add toggles (keep) ---------- */
        #ct-link-methods .btn-group, #ct-campaign-methods .btn-group{
          display:flex; gap:6px;
        }
        #ct-link-methods .btn-group .btn, #ct-campaign-methods .btn-group .btn{
          font-size:11px; line-height:1.2; padding:8px 12px; min-height:36px; border-radius:8px;
          display:inline-flex; align-items:center; justify-content:center;
        }
        #ct-link-methods .btn-outline-secondary, #ct-campaign-methods .btn-outline-secondary{
          color: var(--accent); border-color: var(--accent);
        }
        #ct-link-methods .btn-outline-secondary:hover, #ct-campaign-methods .btn-outline-secondary:hover{
          color: var(--accent); background: rgba(82,98,241,.08); border-color: var(--accent);
        }
        #ct-link-methods .btn-check:checked + .btn, #ct-campaign-methods .btn-check:checked + .btn{
          background: var(--accent) !important; border-color: var(--accent) !important; color:#fff;
        }
        #ct-link-methods .btn-check:focus + .btn,
        #ct-campaign-methods .btn-check:focus + .btn,
        #ct-link-methods .btn:focus, #ct-campaign-methods .btn:focus{
          outline: none; box-shadow: 0 0 0 .2rem rgba(82,98,241,.25);
        }
        
      /*Drag&Drop buttons fix*/

        /* ---------- D&D toggles (keep) ---------- */
        #ct-link-methods-adv .btn-group, #ct-campaign-methods-adv .btn-group{
          display:flex; gap:6px;
        }
        #ct-link-methods-adv .btn-group .btn, #ct-campaign-methods-adv .btn-group .btn{
          font-size:11px; line-height:1.2; padding:8px 12px; min-height:36px; border-radius:8px;
          display:inline-flex; align-items:center; justify-content:center;
        }
        #ct-link-methods-adv .btn-outline-secondary, #ct-campaign-methods-adv .btn-outline-secondary{
          color: var(--accent); border-color: var(--accent);
        }
        #ct-link-methods-adv .btn-outline-secondary:hover, #ct-campaign-methods-adv .btn-outline-secondary:hover{
          color: var(--accent); background: rgba(82,98,241,.08); border-color: var(--accent);
        }
        #ct-link-methods-adv .btn-check:checked + .btn, #ct-campaign-methods-adv .btn-check:checked + .btn{
          background: var(--accent) !important; border-color: var(--accent) !important; color:#fff;
        }
        #ct-link-methods-adv .btn-check:focus + .btn,
        #cct-link-methods-adv .btn-check:focus + .btn,
        #ct-link-methods-adv .btn:focus, #ct-campaign-methods .btn:focus{
          outline: none; box-shadow: 0 0 0 .2rem rgba(82,98,241,.25);
        }