/* ============================================
   Rania Garment - Custom Styles
   ============================================ */

body {
  font-family: 'Inter', sans-serif;
  color: #1A1A1A;
  background: #fff;
}

.font-serif {
  font-family: 'Playfair Display', Georgia, serif;
}

html {
  scroll-behavior: smooth;
}

::selection {
  background: #DC2626;
  color: #fff;
}

/* Animations */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

.animate-fade-up { animation: fadeUp .8s ease-out forwards; }
.delay-100 { animation-delay: .1s; opacity: 0; }
.delay-200 { animation-delay: .2s; opacity: 0; }
.delay-300 { animation-delay: .3s; opacity: 0; }

@keyframes wa-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .6); }
  50%      { box-shadow: 0 0 0 14px rgba(37, 211, 102, 0); }
}

.wa-pulse { animation: wa-pulse 2.2s ease-out infinite; }

/* Nav link underline */
.nav-link { position: relative; }
.nav-link::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 0;
  height: 2px;
  background: #DC2626;
  transition: width .3s;
}
.nav-link:hover::after { width: 100%; }

/* ============================================
   Language Switcher
   ============================================ */
.lang-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 9999px;
  background: #fff;
  font-size: 12px;
  font-weight: 600;
  color: #1A1A1A;
  cursor: pointer;
  transition: all .2s;
}
.lang-btn:hover {
  border-color: #DC2626;
  color: #DC2626;
}

.lang-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
  padding: 6px;
  min-width: 160px;
  z-index: 50;
  display: none;
}
.lang-dropdown.show { display: block; }

.lang-option {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  color: #1A1A1A;
  cursor: pointer;
  border: none;
  background: transparent;
  text-align: left;
}
.lang-option:hover {
  background: #FEF2F2;
  color: #DC2626;
}
.lang-option.active {
  background: #FEF2F2;
  color: #DC2626;
  font-weight: 600;
}

/* ============================================
   Google Translate - hide native UI
   ============================================ */
.goog-te-banner-frame.skiptranslate,
.goog-te-gadget {
  display: none !important;
}

body { top: 0 !important; }

#google_translate_element {
  position: absolute;
  left: -9999px;
  visibility: hidden;
}

.goog-tooltip,
.goog-tooltip:hover {
  display: none !important;
}

.goog-text-highlight {
  background: transparent !important;
  box-shadow: none !important;
}