/* Tijara Tech — enhancement layer (sticky nav, WhatsApp, chat, wired forms).
   Additive over the locked design; loaded after shell.css + nav.js. */

/* ---------- Sticky header (desktop + mobile) ---------- */
.tt-sticky{
  position:-webkit-sticky !important;
  position:sticky !important;
  top:0 !important;
  z-index:900 !important;
  background:#ffffff !important;
  transition:box-shadow .2s ease;
}
.tt-sticky.tt-scrolled{ box-shadow:0 4px 18px rgba(10,37,64,.10) !important; }

/* keep mega-menu panels above the sticky bar */
.pv-mega{ z-index:1000 !important; }

/* ---------- Floating action buttons (WhatsApp + Chat) ---------- */
#tt-fab{ position:fixed; right:20px; bottom:20px; z-index:1200; display:flex; flex-direction:column; gap:12px; align-items:flex-end; }
#tt-fab a, #tt-fab button{ -webkit-tap-highlight-color:transparent; }
.tt-fab-btn{
  width:56px; height:56px; border-radius:50%; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; color:#fff;
  box-shadow:0 6px 20px rgba(10,37,64,.28); transition:transform .15s ease, box-shadow .15s ease;
}
.tt-fab-btn:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(10,37,64,.34); }
.tt-fab-btn svg{ width:30px; height:30px; }
.tt-wa{ background:#25D366; }
.tt-chat{ background:#0a2540; }
.tt-fab-label{
  position:absolute; right:64px; white-space:nowrap; background:#0a2540; color:#fff;
  font:600 13px/1 system-ui,-apple-system,"Segoe UI",sans-serif; padding:8px 12px; border-radius:8px;
  opacity:0; pointer-events:none; transform:translateX(6px); transition:.15s; box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.tt-fab-row{ position:relative; display:flex; align-items:center; }
.tt-fab-row:hover .tt-fab-label{ opacity:1; transform:translateX(0); }

/* ---------- Chat panel ---------- */
#tt-chat-panel{
  position:fixed; right:20px; bottom:88px; z-index:1200; width:340px; max-width:calc(100vw - 32px);
  background:#fff; border-radius:16px; overflow:hidden; display:none; flex-direction:column;
  box-shadow:0 18px 50px rgba(10,37,64,.30); border:1px solid #e7ecf3;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
}
#tt-chat-panel.open{ display:flex; animation:tt-pop .18s ease; }
@keyframes tt-pop{ from{opacity:0; transform:translateY(10px) scale(.98);} to{opacity:1; transform:none;} }
.tt-chat-head{ background:#0a2540; color:#fff; padding:16px 18px; display:flex; align-items:center; gap:10px; }
.tt-chat-head .dot{ width:9px; height:9px; border-radius:50%; background:#25D366; box-shadow:0 0 0 3px rgba(37,211,102,.25); }
.tt-chat-head h4{ margin:0; font-size:15px; font-weight:700; }
.tt-chat-head p{ margin:2px 0 0; font-size:12px; opacity:.75; }
.tt-chat-head .x{ margin-left:auto; background:none; border:none; color:#fff; font-size:20px; cursor:pointer; line-height:1; opacity:.8; }
.tt-chat-body{ padding:16px; display:flex; flex-direction:column; gap:10px; max-height:360px; overflow-y:auto; background:#f7f9fc; }
.tt-msg{ background:#fff; border:1px solid #eaeff5; border-radius:12px 12px 12px 4px; padding:11px 13px; font-size:13.5px; color:#0a2540; line-height:1.45; max-width:92%; }
.tt-quick{ display:flex; flex-wrap:wrap; gap:8px; }
.tt-quick button{
  background:#fff; border:1px solid #cfe0ff; color:#1e5eff; border-radius:20px; padding:8px 13px;
  font-size:12.5px; font-weight:600; cursor:pointer; transition:.12s;
}
.tt-quick button:hover{ background:#1e5eff; color:#fff; border-color:#1e5eff; }
.tt-chat-foot{ padding:10px 14px; border-top:1px solid #eef2f7; display:flex; gap:8px; }
.tt-chat-foot a{
  flex:1; text-align:center; text-decoration:none; font-size:12.5px; font-weight:700; padding:10px; border-radius:10px;
}
.tt-chat-foot .wa{ background:#25D366; color:#fff; }
.tt-chat-foot .bk{ background:#eef2f7; color:#0a2540; }

/* ---------- Injected real forms ---------- */
.tt-form-wrap{ margin:8px 0 24px; }
.tt-form{
  background:#fff; border:1px solid #e7ecf3; border-radius:16px; padding:24px;
  box-shadow:0 8px 30px rgba(10,37,64,.06); max-width:640px;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
}
.tt-form h3{ margin:0 0 4px; font-size:19px; color:#0a2540; font-weight:800; }
.tt-form .sub{ margin:0 0 18px; font-size:13px; color:#5a6b80; }
.tt-field{ margin-bottom:14px; }
.tt-field label{ display:block; font-size:12.5px; font-weight:700; color:#0a2540; margin-bottom:6px; }
.tt-field label .req{ color:#e5484d; }
.tt-field input, .tt-field select, .tt-field textarea{
  width:100%; box-sizing:border-box; border:1px solid #d4dde8; border-radius:10px; padding:11px 13px;
  font-size:14px; color:#0a2540; background:#fff; font-family:inherit; transition:.12s;
}
.tt-field input:focus, .tt-field select:focus, .tt-field textarea:focus{
  outline:none; border-color:#1e5eff; box-shadow:0 0 0 3px rgba(30,94,255,.14);
}
.tt-field textarea{ min-height:120px; resize:vertical; }
.tt-row2{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media(max-width:560px){ .tt-row2{ grid-template-columns:1fr; } }
.tt-consent{ display:flex; gap:9px; align-items:flex-start; font-size:12.5px; color:#5a6b80; margin:6px 0 16px; }
.tt-consent input{ width:auto; margin-top:2px; }
.tt-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.tt-submit{
  background:#1e5eff; color:#fff; border:none; border-radius:11px; padding:13px 22px; font-size:14.5px;
  font-weight:800; cursor:pointer; transition:.15s; width:100%;
}
.tt-submit:hover{ background:#1749cc; }
.tt-submit:disabled{ opacity:.6; cursor:default; }
.tt-form-note{ margin-top:12px; font-size:12px; text-align:center; padding:10px; border-radius:10px; display:none; }
.tt-form-note.ok{ display:block; background:#e7f7ec; color:#1a7f42; }
.tt-form-note.err{ display:block; background:#fdeaea; color:#c0303a; }