/* ===============================
   GLOBAL PROFILE VARIABLES
   =============================== */


footer.main-footer.py-3.text-center.bg-dark.text-white-50.mt-auto {
    background: white !important;
    color: black !important;
    border-top: 1px #f7f7f7 solid;
}

header.dashboard-header.desktop-header.shadow-sm.bg-white.border-bottom {
    background: white !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .03) !important;
    border-bottom: none !important;
}

.account-settings-card {
  border-radius: 16px;
  padding: 2rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

.panel {

  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

/* ===============================
   Preview Mode Badge
   =============================== */
.preview-badge {
  position: fixed;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;

  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  font-size: 12px;
  font-weight: 500;

  padding: 6px 12px;
  border-radius: 999px;
  letter-spacing: 0.3px;

  pointer-events: none; /* important */
}


/* ============================================================
   buttons
   ============================================================ */


.btn-primary {
  background-color: #FED254 !important;
  border-color: #EBC046 !important;
  color: #000 !important;
  font-weight: 500;
  transition: all 0.25s ease-in-out;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #f1c93b !important;
  border-color: #d3a92e !important;
  color: #000 !important;
}

.btn-primary:active,
.btn-primary.active {
  background-color: #e6bb2f !important;
  border-color: #c89d24 !important;
  color: #000 !important;
  box-shadow: none !important;
}

.btn-primary:disabled,
.btn-primary.disabled {
  background-color: #fce89b !important;
  border-color: #e4d078 !important;
  color: #444 !important;
  opacity: 0.7;
}

button#copyUrlBtn {
    
  background-color: #FED254 !important;
 border-color: #EBC046 !important;
 color: #000 !important;
 font-weight: 500;
transition: none !important;
padding: 8px 25px;
 
}


/* ============================================================
   ⚠️ INFOTAP / LINKIT ALERT STYLES
   ============================================================ */
.infotap-alert {
  padding: 14px 18px;
  border-radius: 10px;
  font-size: 15px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.06);
  animation: fadeIn 0.3s ease-in-out;
}

.infotap-alert i {
  font-size: 18px;
}

/* ✅ Success Alert */
.infotap-alert-success {
  background: linear-gradient(90deg, #d1fae5, #a7f3d0);
  color: #065f46;
  border: 1px solid #6ee7b7;
}

/* ❌ Danger / Error Alert */
.infotap-alert-danger {
  background: linear-gradient(90deg, #fee2e2, #fecaca);
  color: #7f1d1d;
  border: 1px solid #fca5a5;
}

/* Smooth fade-in animation for alert appearance */
.fade-in {
  opacity: 0;
  transform: translateY(-5px);
  animation: fadeIn 0.3s ease forwards;
}

/* ============================================================
   🎞️ GLOBAL ANIMATIONS
   ============================================================ */

/* Fade-in keyframes (used for alerts and cards) */
@keyframes fadeIn {
  to { opacity: 1; transform: translateY(0); }
}

/* Footer fade-up animation (used at bottom section) */
@keyframes fadeUpFooter {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}