/* ============================================================
   GLOBAL SITE UI (ORIGINAL + FIXES)
   ============================================================ */

:root {
  --text:#062b3f;
  --sub:#517089;
  --card:#fff;
  --shadow:0 16px 36px rgba(2,30,50,0.08);
  --accent:#00eaff;
  --acc2:#006cff;
}

/* PREVENT HORIZONTAL SCROLL */
html, body {
  margin:0;
  padding:0;
  overflow-x:hidden !important;
  width:100%;
}

/* GLOBAL CONTAINER */
.container {
  max-width:1180px;
  margin:0 auto;
  padding:0 18px;
}

/* GLOBAL SECTION */
.section { margin:80px 0; }

.section-title {
  font-size:32px;
  font-weight:700;
  margin-bottom:24px;
}

/* CARD */
.card {
  background:var(--card);
  border-radius:16px;
  padding:18px;
  box-shadow:var(--shadow);
}

/* BUTTONS */
.btn {
  display:inline-block;
  padding:12px 20px;
  border-radius:12px;
  font-weight:600;
  text-decoration:none;
  cursor:pointer;
  transition:.22s;
}

.btn.primary {
  background:linear-gradient(90deg,#00eaff,#007bff);
  color:#fff;
  box-shadow:0 12px 36px rgba(0,128,255,0.16);
}

.btn.primary:hover {
  transform:translateY(-3px);
}

.btn.ghost {
  background:#eef6ff;
  color:#00476e;
}

.btn.small { padding:8px 12px; }

/* FORMS */
.form {
  padding:26px;
  background:#ffffffcc;
  backdrop-filter:blur(6px);
  border-radius:16px;
  box-shadow:var(--shadow);
}

.field { margin-bottom:16px; }

.field label {
  font-weight:600;
  font-size:13px;
  margin-bottom:6px;
  display:block;
}

input, select, textarea {
  width:100%;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid #c8d3de;
  font-size:14px;
}

textarea { height:120px; }

.small {
  font-size:14px;
  color:var(--sub);
}

.center { text-align:center; }

.hidden { display:none !important; }

/* GENERAL TAG FIX */
a { color:inherit; text-decoration:none; }
img { max-width:100%; height:auto; display:block; }

/* ============================================================
   FOOTER (FINAL)
   ============================================================ */

.site-footer {
  background:#f0f6ff;
  padding:60px 0 0;
  border-top:1px solid rgba(0,0,0,0.06);
  margin-top:80px;
}

.footer-container {
  display:flex;
  flex-wrap:wrap;
  gap:40px;
}

.fcol {
  flex:1;
  min-width:260px;
}

.fcol h4 {
  font-weight:700;
  margin-bottom:12px;
}

.fcol a {
  display:block;
  margin-bottom:6px;
  color:#004463;
}

.fcol a:hover {
  color:#007bff;
}


/* ============================================================
   CHAT WIDGET — FINAL FIX
   ============================================================ */

#chatWidget {
  position:fixed;
  bottom:26px;
  right:26px;
  z-index:9999;
}

#chatToggle {
  width:60px;
  height:60px;
  background:linear-gradient(90deg,#00eaff,#007bff);
  border-radius:50%;
  box-shadow:0 10px 26px rgba(0,128,255,0.25);
  border:none;
  cursor:pointer;
}

#chatBox {
  width:300px;
  height:380px;
  background:#fff;
  border-radius:14px;
  box-shadow:var(--shadow);
  display:none;
  position:absolute;
  bottom:80px;
  right:0;
  flex-direction:column;
  overflow:hidden;
}

#chatBox.open {
  display:flex;
}

#chatInput {
  border:none;
  padding:10px;
  border-top:1px solid #e5e8ef;
}


/* ============================================================
   HERO GAP FIX (ALL PAGES)
   ============================================================ */

.section:first-of-type,
.hero,
.page-hero {
  margin-top:40px !important;
}

/* ORDER PAGE HERO FIX */
.order-hero {
  margin-top:60px !important;
}

body {
  padding-top: 100px;
}