/* ============================================================
   GLOBAL UNIFORMS LTD — Behavioral CSS (layout via Tailwind)
   ============================================================ */

/* Hamburger animation */
.hamburger.open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* Scrolled header */
#site-header.scrolled { box-shadow: 0 2px 12px rgba(0,0,0,.1); }

/* Active nav link */
.header-nav a.active,
.mobile-nav a.active { color: #9e3e50 !important; border-bottom: 2px solid #9e3e50; }

/* Scroll reveal */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .55s ease, transform .55s ease; }
.reveal.visible { opacity: 1; transform: none; }
.reveal-delay-1 { transition-delay: .1s; }
.reveal-delay-2 { transition-delay: .2s; }
.reveal-delay-3 { transition-delay: .3s; }

/* Chat messages */
.chat-msg { max-width: 82%; padding: 8px 12px; border-radius: 12px; font-size: 13px; line-height: 1.5; word-break: break-word; }
.chat-msg.bot { background: #eeedf3; color: #1a1c20; border-bottom-left-radius: 2px; align-self: flex-start; }
.chat-msg.user { background: #00366f; color: #fff; border-bottom-right-radius: 2px; align-self: flex-end; margin-left: auto; }
.chat-msg a { color: #9e3e50; text-decoration: underline; }
#chat-panel { display: none; flex-direction: column; }
#chat-panel.flex { display: flex !important; }
#chat-messages { display: flex; flex-direction: column; gap: 8px; }
.chat-typing span { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #9e3e50; margin: 0 2px; animation: bounce 1.2s infinite; }
.chat-typing span:nth-child(2) { animation-delay: .2s; }
.chat-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes bounce { 0%,60%,100% { transform: translateY(0); } 30% { transform: translateY(-6px); } }
#chat-trigger.bounce { animation: chatBounce .6s ease; }
@keyframes chatBounce { 0%,100% { transform: scale(1); } 50% { transform: scale(1.18); } }

/* Quote form steps */
.form-step { display: none; }
.form-step.active { display: block; }

/* Toggle buttons (branding selector) */
.toggle-btn { padding: 8px 16px; border: 1.5px solid #c3c6d2; border-radius: 6px; background: #fff; font-size: 13px; font-weight: 600; color: #434750; cursor: pointer; transition: all .2s; }
.toggle-btn:hover { border-color: #00366f; color: #00366f; }
.toggle-btn.selected { background: #00366f; color: #fff; border-color: #00366f; }

/* Progress dots */
.progress-step { width: 36px; height: 36px; border-radius: 50%; background: #c3c6d2; color: #434750; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; transition: all .3s; }
.progress-step.active { background: #00366f; color: #fff; }
.progress-step.done { background: #9e3e50; color: #fff; }

/* FAQ accordion */
.faq-answer { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.faq-item.open .faq-answer { max-height: 400px; }
.faq-chevron { transition: transform .3s; }
.faq-item.open .faq-chevron { transform: rotate(180deg); }

/* Tab active (products page) */
.tab-btn.active { color: #9e3e50; border-bottom: 2px solid #9e3e50; }

/* Success card */
#success-card { display: none; }
#success-card.visible { display: block; }

/* WhatsApp link row */
#whatsapp-link-row { display: none; }
#whatsapp-link-row.visible { display: flex; }

/* Field error */
.field-group.has-error input,
.field-group.has-error select,
.field-group.has-error textarea,
input.error, select.error, textarea.error { border-color: #ba1a1a !important; }
.field-hint-error { color: #ba1a1a; }

/* Hero gradient */
.hero-gradient { background: linear-gradient(135deg, #1e4d8c 0%, #00366f 100%); }

/* Dot pattern (about page) */
.dot-pattern {
  background-color: #f9f9ff;
  background-image: radial-gradient(#d6e3ff 0.5px, transparent 0.5px), radial-gradient(#d6e3ff 0.5px, #f9f9ff 0.5px);
  background-size: 20px 20px;
  background-position: 0 0, 10px 10px;
}