/* =========================
   TOPBAR
   ========================= */
.topbar {
  background:#fff;
  border-bottom:1px solid #eee;
  margin:0;
  padding:8px 0;
}
.top-cta .btn { margin-left:8px; }

/* =========================
   BUTTONS
   ========================= */
.btn-rounded {
  border-radius:25px;
  padding:8px 18px;
  font-weight:600;
  text-transform:none;
}

/* Blue outline (Find Doctor) */
.btn-outline-blue {
  color:#1a237e;
  border:2px solid #1a237e;
  background:transparent;
  transition:all 0.3s ease;
}
.btn-outline-blue:hover { background:#1a237e; color:#fff; }

/* Green outline (Book Appointment) */
.btn-outline-green {
  color:#388e3c;
  border:2px solid #388e3c;
  background:transparent;
  transition:all 0.3s ease;
}
.btn-outline-green:hover { background:#388e3c; color:#fff; }

/* Red solid (Emergency) */
.btn-red,
.btn-red:hover,
.btn-red:focus,
.btn-red:active,
.btn-red.active {
  background:#d32f2f !important;
  border:2px solid #d32f2f !important;
  color:#fff !important;
  outline:none !important;
  box-shadow:none !important;
}

/* =========================
   NAVBAR
   ========================= */
.navbar {
  margin:0 !important;
  border:none;
  min-height:60px;
}
.navbar-brand {
  height:90px;
  padding:5px 15px;
}
.navbar-brand img {
  height:60px;
  width:auto;
  display:block;
}
.navbar-nav > li > a {
  padding-top:20px;
  padding-bottom:20px;
  line-height:20px;
  font-weight:600;
}
.navbar-collapse { padding:0; }

/* =========================
   MEGA MENU (DESKTOP DEFAULTS)
   ========================= */
.navbar-nav > li.mega-dept { position:static; }

.navbar-nav > li.mega-dept .mega-menu {
  width:850px;                   /* wide dropdown */
  min-width:750px;
  padding:12px 18px !important;
  border-top:2px solid #eee;
  background:#fff;
  position:absolute;
  top:100%;
  left:70%;
  transform:translateX(-50%);
  box-shadow:0 4px 10px rgba(0,0,0,0.08);
  border-radius:4px;
  display:none;                  /* hidden by default */
  white-space:nowrap;            /* keep single-line desktop look */
  z-index:9999;
  margin-top:0;
}

/* Show mega on hover (desktop only) */
@media (min-width:768px){
  .navbar-nav > li.mega-dept:hover > .mega-menu,
  .navbar-nav > li.mega-dept .mega-menu:hover {
    display:block;
  }
}

/* Hover bridge to avoid flicker */
.navbar-nav > li.mega-dept { position:relative; }
.navbar-nav > li.mega-dept::after {
  content:"";
  position:absolute;
  left:0; right:0;
  top:100%;
  height:14px;                   /* transparent bridge */
}

/* Mega columns (desktop) */
.navbar-nav > li.mega-dept .mega-menu .row {
  margin-left:-5px !important;
  margin-right:-5px !important;
}
.navbar-nav > li.mega-dept .mega-menu .col-sm-6 {
  width:50%;
  float:left;
  padding-left:5px !important;
  padding-right:5px !important;
}

/* Headings inside mega */
.mega-heading {
  font-size:13px !important;
  font-weight:600;
  color:#1a237e;
  margin:0 0 6px 0 !important;
  padding:0 0 4px 0 !important;
  border-bottom:1px solid #e9e9e9 !important;
}

/* Links inside mega */
.navbar-nav > li.mega-dept .mega-menu .mega-col { margin:0 !important; padding:0 !important; }
.navbar-nav > li.mega-dept .mega-menu .mega-col li { margin:0 !important; padding:0 !important; border:none !important; }
.navbar-nav > li.mega-dept .mega-menu .mega-col li + li { margin-top:2px !important; }
.navbar-nav > li.mega-dept .mega-menu .mega-col li a {
  display:inline-block;
  padding:4px 8px !important;
  line-height:1.25 !important;
  font-size:14px;
  font-weight:400;
  color:#444;
  border:none !important;
  background:none !important;
  white-space:nowrap;
}
.navbar-nav > li.mega-dept .mega-menu .mega-col li a:hover { color:#388e3c; text-decoration:none; }

/* Kill pseudo dividers if any theme adds them */
.navbar-nav > li.mega-dept .mega-menu .mega-col li a:before,
.navbar-nav > li.mega-dept .mega-menu .mega-col li a:after { display:none !important; }

/* =========================
   ABOUT US (NARROWER DROPDOWN)
   ========================= */
.navbar-nav > li.aboutus-menu .mega-menu {
  width:300px;
  min-width:260px;
  left:35%;
  transform:none;
  white-space:normal;
}

/* =========================
   LOGO IN TOPBAR
   ========================= */
.topbar .top-logo img {
  max-height:60px;
  width:auto;
}

/* =========================
   MOBILE (<=767px)
   ========================= */
@media (max-width:767px){

  /* Basic navbar sizing */
  #header .navbar { min-height:54px; }
  #header .navbar-brand { height:48px; padding:6px 10px; }
  #header .navbar-brand img { max-height:46px; height:auto; width:auto; }
  #header .navbar-toggle { margin-top:10px; margin-bottom:10px; }

  /* Top CTA stack vertically */
  .top-cta {
    width:100%;
    text-align:center;
  }

  .top-cta a.btn {
    display:block;
    width:90%;              /* make them wider but not touching edges */
    max-width:320px;        /* optional, keeps nice size */
    margin:8px auto;        /* centers them */
    text-align:center;
    font-size:16px;         /* slightly bigger text */
    padding:12px 20px;      /* taller buttons */
    box-sizing:border-box;  /* includes padding in width */
  }

  /* Make logo full width & centered */
  .top-logo {
    width:100% !important;
    max-width:100% !important;
    text-align:center;
    float:none;
  }
  .top-logo .navbar-brand { display:inline-block; float:none; padding:0; }
  .top-logo img { max-width:100%; height:auto; }

  /* Mega menu behaves like a standard block panel */
  .navbar-nav > li.mega-dept .mega-menu {
    position:static;
    width:100%;
    min-width:0;
    left:0;
    transform:none;
    padding:8px 12px;
    box-shadow:none;
    border-radius:0;
    white-space:normal;         /* ALLOW WRAP to prevent clashing */
    z-index:1;
    margin-top:0;
    display:none;               /* default hidden; will show when .open */
  }

  /* Show mega on tap when Bootstrap adds .open */
  .navbar-nav > li.mega-dept.open > .mega-menu { display:block; }

  /* Stack columns instead of side-by-side */
  .navbar-nav > li.mega-dept .mega-menu .row { margin:0 !important; }
  .navbar-nav > li.mega-dept .mega-menu .col-sm-6 {
    float:none;
    width:100%;
    padding:0 !important;
    margin-bottom:8px;
  }

  /* Bigger touch targets + wrap long lines */
  .navbar-nav > li.mega-dept .mega-menu .mega-col li a {
    display:block;
    padding:8px 10px !important;
    line-height:1.35 !important;
    font-size:15px;
    white-space:normal;
    word-break:break-word;
  }

  /* Heading spacing on mobile */
  .mega-heading {
    font-size:14px !important;
    margin:6px 0 !important;
    padding-bottom:4px !important;
  }
}
