/* ======================================================
   MEMORIS 2025 â Bootstrap 5.3 Dark-Gold Theme Override
   ====================================================== */

:root {
  /* === Brand Colors === */
  --bs-primary: #caa56b;               /* Main gold */
  --bs-primary-hover: #e0be85;         /* Light gold hover */
  --bs-primary-active: #b89054;        /* Pressed gold */
  --bs-primary-rgb: 202, 165, 107;

  --bs-secondary: #b3b3b3;             /* Muted silver-gray */
  --bs-secondary-rgb: 179, 179, 179;

  --bs-success: #84c49c;               /* Soft natural green */
  --bs-success-rgb: 132, 196, 156;

  --bs-danger: #cc6a6a;                /* Soft red (not aggressive) */
  --bs-danger-rgb: 204, 106, 106;

  --bs-warning: #e0be85;               /* Highlight gold */
  --bs-warning-rgb: 224, 190, 133;

  --bs-info: #a9b7d3;                  /* Steel blue */
  --bs-info-rgb: 169, 183, 211;

  --bs-light: #f5f5f5;
  --bs-light-rgb: 245, 245, 245;

  --bs-dark: #0e0e0e;
  --bs-dark-rgb: 14, 14, 14;

  /* === Backgrounds and Body === */
  --bs-body-bg: var(--bs-dark);
  --bs-body-color: var(--bs-light);
  --bs-border-color: rgba(255, 255, 255, 0.08);

  /* === Link Colors === */
  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: var(--bs-primary-hover);

  /* === Focus & Shadows === */
  --bs-focus-ring-color: rgba(202,165,107, 0.25);

    --bs-btn-focus-shadow-rgb: 202, 165, 107; /* soft gold instead of blue */
  --bs-focus-ring-color: rgba(202, 165, 107, 0.4); /* for inputs/links */
  --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(202, 165, 107, 0.25);

   /* Outline variant */
  --bs-btn-outline-color: var(--bs-primary);
  --bs-btn-outline-hover-bg: var(--bs-primary);
  --bs-btn-outline-hover-color: #000;
  --bs-btn-outline-border-color: var(--bs-primary);
}

/* ======================================================
   BUTTON STYLING OVERRIDES
   ====================================================== */

/* Primary Button */
.btn-primary {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #000;
  font-weight: 600;
  letter-spacing: 0.02em;
  border-radius: 50px;
  transition: background-color 0.25s ease, transform 0.15s ease;
}
.btn-primary:hover {
  background-color: var(--bs-primary-hover);
  border-color: var(--bs-primary-hover);
  transform: translateY(-1px);
  color: #000;
}
.btn-primary:active {
  background-color: var(--bs-primary-active);
  border-color: var(--bs-primary-active);
  transform: translateY(0);
}

/* Secondary Button */
.btn-secondary {
  background-color: transparent;
  border: 1px solid var(--bs-secondary);
  color: var(--bs-secondary);
  border-radius: 50px;
  transition: all 0.25s ease;
}
.btn-secondary:hover {
  color: var(--bs-dark);
  background-color: var(--bs-secondary);
  border-color: var(--bs-secondary);
}

/* Outline Light Button (dark background use) */
.btn-outline-light {
  color: var(--bs-light);
  border: 1.5px solid var(--bs-light);
  border-radius: 50px;
  transition: all 0.25s ease;
}
.btn-outline-light:hover {
  background-color: var(--bs-light);
  color: var(--bs-dark);
}

/* Outline Primary (accent gold) */
.btn-outline-primary {
  color: var(--bs-primary);
  border: 1.5px solid var(--bs-primary);
  border-radius: 50px;
  transition: all 0.25s ease;
}
.btn-outline-primary:hover {
  background-color: var(--bs-primary);
  color: #000;
}

/* Success / Danger / Warning refined tones */
.btn-success {
  background-color: var(--bs-success);
  border-color: var(--bs-success);
  color: #000;
}
.btn-danger {
  background-color: var(--bs-danger);
  border-color: var(--bs-danger);
  color: #fff;
}
.btn-warning {
  background-color: var(--bs-warning);
  border-color: var(--bs-warning);
  color: #000;
}

/* Disabled / Ghost states */
.btn:disabled,
.btn.disabled {
  opacity: 0.6;
  pointer-events: none;
  background-color: var(--bs-border-color);
  color: var(--bs-secondary);
}

/* Button Focus Ring */
.btn:focus {
  box-shadow: 0 0 0 0.25rem rgba(202,165,107,0.25);
  outline: none;
}

/* === GLOBAL FOCUS & ACTIVE RESET === */
/* 2. Remove ugly outlines entirely on click */
.btn:focus,
.btn:active,
.btn-check:focus + .btn,
.btn:focus-visible,
.btn-outline-primary:focus,
.btn-outline-primary:active {
  outline: none !important;
  box-shadow: none !important;
}

/* 3. Make sure .btn-outline-primary uses your color */
.btn-outline-primary {
  color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}
.btn-outline-primary:hover,
.btn-outline-primary:active {
  background-color: var(--bs-primary) !important;
  color: #000 !important;
  border-color: var(--bs-primary) !important;
}

/* 4. Prevent mobile tap highlight flash */
* {
  -webkit-tap-highlight-color: transparent;
}

/* 5. (Optional) Accessibility-safe custom focus ring */
/* Override Bootstrap default focus-visible behavior */
.btn:focus-visible {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
  outline: none !important;
  box-shadow: var(--bs-btn-focus-box-shadow);
}

/* ===========================================================
   MEMORIS CUSTOM BUTTONS (no .btn dependency)
   =========================================================== */

/* 1ď¸âŁ Solid Gold Button */
.m-btn-primary {
  display: inline-block;
  padding: 0.75rem 1.75rem;
  border-radius: 50px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  letter-spacing: 0.03em;
  font-size: 1rem;
  color: #000;
  background: linear-gradient(135deg, #caa56b, #e0b66c);
  border: none;
  cursor: pointer;
  transition: all 0.25s ease;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.m-btn-primary:hover {
  background: linear-gradient(135deg, #e0b66c, #f4d08f);
  transform: translateY(-2px);
}
.m-btn-primary:active {
  background: linear-gradient(135deg, #b8935f, #d5a861);
  transform: translateY(0);
}

/* 2ď¸âŁ Outline Gold Button */
.m-btn-outline {
  display: inline-block;
  padding: 0.75rem 1.75rem;
  border-radius: 50px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  font-size: 1rem;
  letter-spacing: 0.03em;
  color: #caa56b;
  background: transparent;
  border: 1px solid rgba(202,165,107,0.5);
  cursor: pointer;
  transition: all 0.3s ease;
}
.m-btn-outline:hover {
  background: rgba(202,165,107,0.1);
  border-color: #caa56b;
  color: #e0b66c;
}

/* 3ď¸âŁ Ghost Button (minimal link style) */
.m-btn-ghost {
  display: inline-block;
  padding: 0.5rem 1rem;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: #caa56b;
  background: none;
  border: none;
  border-bottom: 1px solid rgba(202,165,107,0.3);
  cursor: pointer;
  border-radius: 0;
  transition: all 0.3s ease;
}
.m-btn-ghost:hover {
  color: #e0b66c;
  border-bottom-color: #e0b66c;
}

/* 4ď¸âŁ Glass Button (for hero overlays or cards) */
.m-btn-glass {
  display: inline-block;
  padding: 0.75rem 1.75rem;
  border-radius: 50px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  font-size: 1rem;
  color: #fff;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(202,165,107,0.25);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor: pointer;
  transition: all 0.3s ease;
}
.m-btn-glass:hover {
  background: rgba(202,165,107,0.1);
  border-color: rgba(202,165,107,0.4);
  color: #e0b66c;
}

/* 5ď¸âŁ Gradient Glow Button (statement CTA) */
.m-btn-glow {
  display: inline-block;
  padding: 0.75rem 1.75rem;
  border-radius: 50px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  font-size: 1rem;
  color: #000;
  background: linear-gradient(120deg, #d4b06a, #e8c37c, #d4b06a);
  background-size: 200% auto;
  box-shadow: 0 0 10px rgba(202,165,107,0.3);
  border: none;
  cursor: pointer;
  transition: background-position 0.6s ease, transform 0.25s ease;
}
.m-btn-glow:hover {
  background-position: right center;
  transform: translateY(-2px);
}
.m-btn-glow:active {
  transform: translateY(0);
}

/* 6ď¸âŁ Text Link Button */
.m-btn-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #caa56b;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 500;
  letter-spacing: 0.02em;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  transition: color 0.3s ease;
}
.m-btn-link i {
  transition: transform 0.3s ease;
}
.m-btn-link:hover {
  color: #e0b66c;
}
.m-btn-link:hover i {
  transform: translateX(4px);
}

/* đ Optional Gold Shimmer Effect (apply to any) */
.m-shimmer::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.25), transparent);
  transform: skewX(-20deg);
  transition: left 0.7s ease;
  z-index: 2;
}
.m-shimmer:hover::after {
  left: 100%;
}