/* Public website UI refresh. Admin styles are intentionally untouched. */
:root {
  --dts-ink: #14213d;
  --dts-muted: #5d6b82;
  --dts-green: #10a981;
  --dts-green-dark: #08785e;
  --dts-yellow: #f7b731;
  --dts-soft: #f4f8fb;
  --dts-border: #dfe8ef;
  --dts-shadow: 0 18px 45px rgba(20, 33, 61, 0.12);
}

body {
  color: var(--dts-ink);
  background: #ffffff;
  font-family: "Lato", Arial, sans-serif;
}

.top-bar {
  display: none;
}

.info-bar {
  background: #0f8f75 !important;
  padding: 12px 0;
  box-shadow: 0 8px 26px rgba(8, 120, 94, 0.14);
}

.logo-box .logo img {
  max-width: 178px;
  height: auto;
}

.header-informations {
  display: flex;
  justify-content: flex-end;
  gap: 28px;
  align-items: center;
}

.info-media {
  margin-top: 0;
}

.info-media .media-left {
  color: #fff;
  opacity: 0.92;
}

.info-media .this-top,
.info-media .this-bottom {
  margin: 0;
  line-height: 1.35;
}

.info-media .this-top a,
.info-media .this-bottom,
.info-media .this-bottom a {
  color: #fff !important;
}

.containernav {
  background: #ffffff !important;
  border-bottom: 1px solid var(--dts-border);
  box-shadow: 0 10px 24px rgba(20, 33, 61, 0.08);
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#main-nav .navbar-nav {
  display: flex;
  float: none;
  justify-content: center;
  flex-wrap: wrap;
}

#main-nav .navbar-nav > li > a {
  color: var(--dts-ink);
  font-weight: 800;
  font-size: 13px;
  text-transform: uppercase;
  padding: 18px 15px;
  letter-spacing: 0;
}

#main-nav .navbar-nav > li.active > a,
#main-nav .navbar-nav > li > a:hover,
#main-nav .navbar-nav > li > a:focus {
  color: var(--dts-green);
  background: transparent;
}

.dts-hero {
  min-height: 430px;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.dts-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(8, 29, 54, 0.78), rgba(8, 29, 54, 0.3) 58%, rgba(8, 29, 54, 0.08));
}

.dts-hero-content {
  position: relative;
  max-width: 700px;
  padding: 74px 15px 88px;
  color: #fff;
}

.dts-hero-kicker {
  display: inline-block;
  margin-bottom: 14px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(16, 169, 129, 0.92);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.dts-hero h1 {
  margin: 0;
  max-width: 660px;
  color: #fff;
  font-size: 46px;
  line-height: 1.08;
  font-weight: 900;
}

.dts-hero p {
  max-width: 560px;
  margin: 18px 0 26px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 17px;
  line-height: 1.65;
}

.dts-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.dts-call-link,
.dts-primary-link {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: 0 20px;
  border-radius: 6px;
  font-weight: 900;
}

.dts-primary-link {
  background: var(--dts-yellow);
  color: #17213a;
}

.dts-call-link {
  border: 1px solid rgba(255, 255, 255, 0.45);
  color: #fff;
}

.dts-primary-link:hover,
.dts-call-link:hover {
  transform: translateY(-1px);
}

.wrapper-blog {
  margin-top: -70px;
  position: relative;
  z-index: 4;
}

.wrapper-blog .jumbotron {
  background: #fff;
  border: 1px solid var(--dts-border);
  border-radius: 8px;
  box-shadow: var(--dts-shadow);
  padding: 28px;
}

.success {
  background: #eef6f4 !important;
  color: var(--dts-green-dark) !important;
  border: 1px solid #cfe8e1 !important;
  border-radius: 6px !important;
  line-height: 42px !important;
  padding: 0 18px !important;
  margin-right: 8px;
}

.success.btn-success,
.success.btn-info {
  background: #eef6f4;
}

.success a {
  color: var(--dts-green-dark) !important;
}

.wrapper-blog form .form-group {
  margin-bottom: 18px;
}

.wrapper-blog label {
  color: var(--dts-muted);
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

.form-control,
.wrapper-blog .form-control {
  width: 100% !important;
  height: 48px !important;
  border: 1px solid var(--dts-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: var(--dts-ink);
}

.form-control:focus {
  border-color: var(--dts-green) !important;
  box-shadow: 0 0 0 3px rgba(16, 169, 129, 0.12) !important;
}

.btn-primary,
.wrapper-blog .btn-primary {
  background: var(--dts-green);
  color: #fff;
  border-radius: 6px;
  box-shadow: 0 10px 20px rgba(16, 169, 129, 0.18);
}

.btn-primary:hover,
.btn-primary:focus {
  background: var(--dts-green-dark);
}

.section-title .this-main {
  color: var(--dts-ink);
  font-weight: 900;
}

.features {
  background: var(--dts-soft);
}

.feature .media {
  min-height: 140px;
  padding: 22px;
  margin-bottom: 20px;
  background: #fff;
  border: 1px solid var(--dts-border);
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(20, 33, 61, 0.06);
}

.feature .this-title {
  color: var(--dts-ink);
  font-weight: 900;
}

.feature p {
  color: var(--dts-muted);
}

details {
  background: #fff;
  border: 1px solid var(--dts-border);
  border-radius: 8px;
  padding: 14px 16px;
  box-shadow: 0 10px 22px rgba(20, 33, 61, 0.06);
}

details summary {
  list-style: none;
}

details summary::-webkit-details-marker {
  display: none;
}

details .h3 {
  font-size: 18px;
  color: var(--dts-ink) !important;
}

details .card {
  border: 0;
  box-shadow: none;
}

.list-item a {
  color: var(--dts-green-dark) !important;
}

.whatsapp_float {
  z-index: 20;
}

/* Full public-site polish */
body {
  font-size: 15px;
  line-height: 1.65;
}

body > section[style*="DTS CAB"],
body > section[style*="DTS%20CAB"],
section[style*="Content/images/DTS CAB"] {
  min-height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  isolation: isolate;
  padding: 54px 15px;
}

body > section[style*="DTS CAB"]:before,
body > section[style*="DTS%20CAB"]:before,
section[style*="Content/images/DTS CAB"]:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(20, 33, 61, 0.82), rgba(20, 33, 61, 0.42));
}

.page-title,
h4.page-title,
.h4.page-title {
  margin: 0;
  color: #fff !important;
  font-size: 34px;
  line-height: 1.2;
  font-weight: 900;
  text-align: center;
  text-transform: capitalize;
}

.wrapper-fleet,
.wrapper-blog,
.wrapper-fleet2,
.updates-row,
.services-offer,
.features,
.about-promo,
.contact-section,
.contact-us {
  padding-top: 58px;
  padding-bottom: 58px;
}

.wrapper-fleet {
  background: var(--dts-soft) !important;
}

.fleet-filterss,
.fleet-filters {
  background: var(--dts-ink) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 8px;
  box-shadow: var(--dts-shadow) !important;
  padding: 20px 24px !important;
}

.fleet-filterss h4,
.fleet-filters h4,
.fleet-filterss .this-label,
.fleet-filters .this-label {
  color: #fff !important;
}

.fleet,
.fleet-list,
.fleet .inner,
.updates,
.service-offer .inner,
.widget,
.contact-form,
.blog,
.post,
.card,
.table,
.jumbotron {
  border-radius: 8px !important;
}

.media.fleet.fleet-list,
.fleet-list.fleet {
  margin-bottom: 22px;
  overflow: hidden;
  background: #fff !important;
  border: 1px solid var(--dts-border);
  border-radius: 8px;
  box-shadow: 0 14px 32px rgba(20, 33, 61, 0.09);
}

.media.fleet.fleet-list > .row,
.fleet-list.fleet > .row {
  background: #fff !important;
}

.fleet .media-left img,
.fleet-list .media-left img,
.updates .media-left img,
.blog img,
.post img,
.service-offer img {
  border-radius: 8px;
}

.fleet .vehicle-title,
.fleet-list .vehicle-title,
.updates .post-title,
.this-title,
.post-title {
  color: var(--dts-ink) !important;
  font-weight: 900 !important;
  letter-spacing: 0;
}

.fleet .rent,
.fleet-list .rent,
.price {
  color: var(--dts-green-dark) !important;
  font-weight: 900 !important;
}

.fleet .summary,
.fleet-list .summary,
.updates p,
.service-offer p,
.about-promo p,
.widget-about p {
  color: var(--dts-muted) !important;
}

.fleet .specification,
.fleet-list .specification {
  background: #f8fbfd !important;
  border-color: var(--dts-border) !important;
}

.media-right .btn,
.fleet .btn,
.fleet-list .btn,
.details-page,
button[type="submit"],
input[type="submit"] {
  min-height: 44px;
  border-radius: 6px !important;
  font-weight: 900 !important;
  letter-spacing: 0;
}

.btn,
button,
.details-page {
  border-radius: 6px !important;
}

.btn-primary,
.btn-success,
.btn-info,
.details-page,
button[type="submit"],
input[type="submit"] {
  background: var(--dts-green) !important;
  border-color: var(--dts-green) !important;
  color: #fff !important;
}

.btn-primary:hover,
.btn-success:hover,
.btn-info:hover,
.details-page:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background: var(--dts-green-dark) !important;
  border-color: var(--dts-green-dark) !important;
  color: #fff !important;
}

.btn a,
button a {
  color: inherit !important;
}

.section-title {
  margin-bottom: 34px;
}

.section-title .this-top {
  color: var(--dts-green) !important;
  font-size: 12px;
  letter-spacing: 0;
  font-weight: 900;
}

.section-title .this-main,
.section-title h1,
.section-title h2,
.section-title h3 {
  color: var(--dts-ink) !important;
  line-height: 1.2;
}

.services-offer,
.update-partners,
.funfacts {
  background: #fff !important;
}

.service-offer .inner {
  overflow: hidden;
  border: 1px solid var(--dts-border);
  box-shadow: 0 14px 30px rgba(20, 33, 61, 0.08);
}

.service-offer .inner:after {
  background: linear-gradient(180deg, rgba(20, 33, 61, 0.08), rgba(20, 33, 61, 0.78)) !important;
}

.service-offer .inner:hover:after {
  background: linear-gradient(180deg, rgba(16, 169, 129, 0.12), rgba(8, 120, 94, 0.84)) !important;
}

.updates {
  margin-bottom: 22px;
  padding: 18px;
  background: #fff;
  border: 1px solid var(--dts-border);
  box-shadow: 0 14px 28px rgba(20, 33, 61, 0.07);
}

.updates .media-left img {
  width: 150px;
  height: 112px;
  object-fit: cover;
}

table,
.table {
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--dts-border) !important;
  box-shadow: 0 10px 24px rgba(20, 33, 61, 0.06);
}

table th,
.table th {
  background: var(--dts-ink) !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

table td,
.table td {
  border-color: var(--dts-border) !important;
}

input,
select,
textarea,
.form-control {
  font-size: 15px !important;
}

textarea.form-control {
  min-height: 120px !important;
  height: auto !important;
}

.contact-form,
form .jumbotron,
.wrapper-blog .jumbotron {
  background: #fff !important;
}

footer,
.footer,
.bottom-footer {
  background: #101b31 !important;
}

footer,
footer p,
footer li,
footer a,
.footer,
.bottom-footer,
.bottom-footer a {
  color: rgba(255, 255, 255, 0.82) !important;
}

footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
.footer h1,
.footer h2,
.footer h3,
.footer h4,
.footer h5 {
  color: #fff !important;
}

.widget-about p,
.widget-links ul,
.widget-contact-info ul {
  border-top-color: rgba(255, 255, 255, 0.16) !important;
}

.widget-links li,
.widget-contact-info li {
  margin-bottom: 8px;
}

.widget-links a:hover,
.widget-contact-info a:hover {
  color: var(--dts-yellow) !important;
}

.whatsapp_float img,
a[href*="wa.me"] img,
a[href*="whatsapp"] img {
  filter: drop-shadow(0 10px 18px rgba(20, 33, 61, 0.25));
}

.breadcrumb,
.pagination > li > a,
.pagination > li > span {
  border-radius: 6px !important;
}

img {
  max-width: 100%;
}

.container {
  max-width: 1200px;
}

.dts-boost {
  background: #fff;
  padding: 42px 0 46px;
  border-top: 1px solid var(--dts-border);
}

.dts-boost__intro {
  max-width: 820px;
  margin: 0 0 22px;
  text-align: left;
}

.dts-boost__eyebrow {
  display: inline-block;
  margin-bottom: 10px;
  color: var(--dts-green-dark);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.dts-boost h2 {
  margin: 0 0 10px;
  color: var(--dts-ink);
  font-size: 28px;
  line-height: 1.2;
  font-weight: 900;
}

.dts-boost p {
  color: var(--dts-muted);
  font-size: 15px;
  line-height: 1.65;
}

.dts-boost__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 20px 0;
}

.dts-boost-card {
  min-height: 82px;
  padding: 16px;
  background: #f8fbfa;
  border: 1px solid var(--dts-border);
  border-radius: 8px;
  box-shadow: none;
}

.dts-boost-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 24px;
  margin-bottom: 10px;
  color: #fff;
  background: var(--dts-green);
  border-radius: 50%;
  font-size: 11px;
  font-weight: 900;
}

.dts-boost-card strong {
  display: block;
  color: var(--dts-ink);
  font-size: 15px;
}

.dts-boost__split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}

.dts-geo-panel {
  padding: 20px;
  margin: 14px 0 0;
  background: #f8fbfa;
  border: 1px solid var(--dts-border);
  border-radius: 8px;
  box-shadow: none;
}

.dts-geo-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.dts-geo-tags span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 11px;
  color: var(--dts-green-dark);
  background: #eef8f5;
  border: 1px solid #cfe8e1;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 900;
}

.dts-boost,
.features,
.services-offer,
.wrapper-fleet,
.wrapper-blog {
  overflow: hidden;
}

.media,
.row,
.container {
  min-width: 0;
}

.fleet .media-body,
.fleet-list .media-body,
.updates .media-body {
  min-width: 0;
}

.fleet .media-right,
.fleet-list .media-right {
  padding: 16px 0;
}

.fleet .summary {
  font-size: 14px;
}

.form-row:before,
.form-row:after {
  content: "";
  display: table;
  clear: both;
}

.wrapper-blog .jumbotron:before {
  content: "Fast cab booking";
  display: inline-block;
  margin-bottom: 14px;
  padding: 6px 12px;
  color: var(--dts-green-dark);
  background: #eef8f5;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.wrapper-blog .btn-primary,
.wrapper-blog button[type="submit"] {
  min-width: 160px;
}

.dts-boost__split > div,
.dts-boost-faq {
  padding: 20px;
  background: #f8fbfa;
  border: 1px solid var(--dts-border);
  border-radius: 8px;
  box-shadow: none;
}

.dts-boost h3 {
  margin: 0 0 10px;
  color: var(--dts-ink);
  font-size: 18px;
  font-weight: 900;
}

.dts-boost-faq {
  margin-top: 14px;
}

.dts-boost-faq details {
  margin-top: 10px;
  padding: 14px 16px;
  box-shadow: none;
  background: #fff;
  border: 1px solid var(--dts-border);
  border-radius: 8px;
}

.dts-boost-faq summary {
  color: var(--dts-ink);
  font-weight: 900;
  cursor: pointer;
}

.dts-boost-faq p {
  margin: 10px 0 0;
  font-size: 15px;
}

.dts-sticky-cta {
  position: fixed;
  left: 50%;
  bottom: 18px;
  z-index: 9998;
  display: flex;
  gap: 10px;
  transform: translateX(-50%);
  padding: 8px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--dts-border);
  border-radius: 999px;
  box-shadow: 0 16px 40px rgba(20, 33, 61, 0.18);
  backdrop-filter: blur(8px);
}

.dts-sticky-cta a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 118px;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  font-weight: 900;
}

.dts-sticky-cta__call {
  background: var(--dts-yellow);
  color: var(--dts-ink) !important;
}

.dts-sticky-cta__whatsapp {
  background: var(--dts-green);
  color: #fff !important;
}

@media (max-width: 767px) {
  .info-bar {
    padding: 10px 0;
  }

  .logo-box .logo img {
    max-width: 146px;
  }

  .navbar-header {
    visibility: visible !important;
    float: right !important;
  }

  .navbar-toggle {
    margin-top: 7px;
    margin-right: 0;
    border: 1px solid rgba(255, 255, 255, 0.42);
  }

  #main-nav .navbar-nav {
    display: block;
    margin: 0;
    padding: 8px 0;
  }

  #main-nav .navbar-nav > li > a {
    padding: 13px 18px;
  }

  .dts-hero {
    min-height: 390px;
  }

  .dts-hero-content {
    padding: 56px 15px 98px;
  }

  .dts-hero h1 {
    font-size: 32px;
  }

  .dts-hero p {
    font-size: 15px;
  }

  .wrapper-blog {
    margin-top: -52px;
  }

  .wrapper-blog .jumbotron {
    padding: 20px 15px;
  }

  .success {
    margin-bottom: 8px;
  }

  body > section[style*="DTS CAB"],
  section[style*="Content/images/DTS CAB"] {
    min-height: 210px;
    padding: 40px 15px;
  }

  .page-title,
  h4.page-title,
  .h4.page-title {
    font-size: 26px;
  }

  .wrapper-fleet,
  .wrapper-blog,
  .features,
  .services-offer,
  .about-promo {
    padding-top: 38px;
    padding-bottom: 38px;
  }

  .fleet-filterss,
  .fleet-filters {
    padding: 16px !important;
  }

  .media.fleet.fleet-list,
  .fleet-list.fleet,
  .updates,
  .feature .media {
    margin-left: 0;
    margin-right: 0;
  }

  .fleet .media-left,
  .fleet-list .media-left,
  .updates .media-left {
    display: block;
    width: 100%;
    padding-right: 0;
    margin-bottom: 16px;
  }

  .updates .media-left img {
    width: 100%;
    height: auto;
  }

  .media-right {
    float: none !important;
    display: block;
    margin-top: 14px;
  }

  .dts-boost {
    padding: 34px 0 38px;
  }

  .dts-boost h2 {
    font-size: 26px;
  }

  .dts-boost__grid,
  .dts-boost__split {
    grid-template-columns: 1fr;
  }

  .dts-geo-panel {
    padding: 20px;
  }

  .dts-geo-tags span {
    flex: 1 1 calc(50% - 10px);
    justify-content: center;
  }

  .dts-boost__split > div,
  .dts-boost-faq {
    padding: 20px;
  }
}
