/* RideToGo new design on the pages that keep their old forms (sign-up, sign-in).
   Header/footer styles are scoped to .rtg-shell; the form skin targets the old markup under .rtg-on. */
.rtg-on {
  --ink: #141C2B; --navy: #344461; --brand: #344461; --brand-deep: #283650; --brand-soft: #C9D3E3;
  --ice: #EBF7FD; --paper: #FFFFFF; --mist: #F2F5F9; --line: #DCE3EC; --muted: #5B6779;
  --font-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Figtree", "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--mist) !important; color: var(--ink); font-family: var(--font-body);
}
/* Hide the old header, side menu and footer (still loaded for their scripts). */
.rtg-on header:not(.top), .rtg-on ul.user-menu, .rtg-on .menu-side, .rtg-on .left-menu-overlay,
.rtg-on footer:not(.foot), .rtg-on .signup-row, .rtg-on .menu-icoholder-side { display: none !important; }
.rtg-on #main-uber-page, .rtg-on .mix-content { padding-top: 0 !important; margin-top: 0 !important; }

/* ---------- shell header + footer ---------- */
.rtg-shell, .rtg-shell * { box-sizing: border-box; }
.rtg-shell { font: 400 16px/1.55 var(--font-body); color: var(--ink); }
.rtg-shell a { color: inherit; text-decoration: none; }
.rtg-shell img { max-width: 100%; display: block; }
.rtg-shell ul { list-style: none; margin: 0; padding: 0; }
.rtg-shell h4 { margin: 0; }
.rtg-shell .wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.rtg-shell .skip { position: absolute; left: -9999px; }
.rtg-shell .skip:focus { left: 16px; top: 8px; z-index: 60; background: #fff; padding: 8px 14px; border-radius: 8px; }
.rtg-shell .top { position: sticky; top: 0; z-index: 50; background: var(--brand); color: #fff; height: auto; box-shadow: none; padding: 0; margin: 0; }
.rtg-shell .top .wrap { display: flex; align-items: center; gap: 28px; min-height: 64px; }
.rtg-shell .brand { display: flex; align-items: center; gap: 10px; }
.rtg-shell .brand img.mark { height: 26px; width: auto; }
.rtg-shell .brand img.word { height: 13px; width: auto; }
.rtg-shell .nav { display: flex; gap: 4px; flex: 1; }
.rtg-shell .nav a, .rtg-shell .top-right a { padding: 8px 14px; border-radius: 999px; font-weight: 500; font-size: 15px; color: #fff; line-height: 1.4; }
.rtg-shell .nav a:hover, .rtg-shell .top-right a:hover { background: rgba(255,255,255,.14); }
.rtg-shell .top-right { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.rtg-shell .top-right .signup { background: #fff; color: var(--ink); }
.rtg-shell .lang { font-weight: 600; letter-spacing: .04em; }
.rtg-shell .menu-btn { display: none; background: transparent; border: 0; color: #fff; padding: 8px; border-radius: 10px; cursor: pointer; }
.rtg-shell .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rtg-shell .mnav { background: var(--brand-deep); }
.rtg-shell .mnav[hidden] { display: none; }
.rtg-shell .mnav .wrap { display: grid; gap: 2px; padding-block: 8px 14px; }
.rtg-shell .mnav a { color: #fff; padding: 12px 6px; font-weight: 600; border-bottom: 1px solid rgba(255,255,255,.08); }
@media (max-width: 900px) { .rtg-shell .nav { display: none; } .rtg-shell .hide-sm { display: none; } .rtg-shell .menu-btn { display: inline-flex; } }
@media (min-width: 901px) { .rtg-shell .mnav { display: none !important; } }

.rtg-shell .foot { background: var(--brand); color: var(--brand-soft); padding: 56px 0 32px; font-size: 15px; margin: 0; }
.rtg-shell .foot { background: linear-gradient(180deg, rgba(52,68,97,.95) 0%, rgba(52,68,97,.88) 50%, rgba(52,68,97,.70) 100%), var(--city, none) center 65% / cover no-repeat, var(--brand); }
.rtg-shell .foot-top { display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: 40px; }
.rtg-shell .foot-top .brand img.mark { height: 30px; }
.rtg-shell .foot-top .brand img.word { height: 15px; }
.rtg-shell .link-u { font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.rtg-shell .link-u.light { color: #fff; }
.rtg-shell .foot-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; margin-bottom: 40px; }
.rtg-shell .foot-cols h4 { color: #fff; font: 700 16px var(--font-display); margin: 0 0 14px; }
.rtg-shell .foot-cols ul { display: grid; gap: 10px; }
.rtg-shell .foot-cols a:hover { color: #fff; text-decoration: underline; }
.rtg-shell .foot-bottom { border-top: 1px solid rgba(255,255,255,.16); padding-top: 22px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 14px; }
.rtg-shell .foot-bottom nav { display: flex; gap: 18px; flex-wrap: wrap; }
@media (max-width: 800px) { .rtg-shell .foot-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- form skin (old sign-up / sign-in markup) ---------- */
.rtg-on #main-uber-page, .rtg-on .mix-content { background: var(--mist) !important; }
.rtg-on .login-main { background: var(--mist) !important; background-image: none !important; padding: 40px 16px 64px !important; min-height: 0 !important; }
.rtg-on .login-main::before, .rtg-on .login-main::after { display: none !important; }
.rtg-on .login-inner { max-width: 1040px; margin: 0 auto; padding: 0; }
.rtg-on .login-block { background: var(--paper) !important; border-radius: 16px !important; box-shadow: 0 12px 40px rgba(52,68,97,.10) !important; border: 1px solid var(--line); overflow: hidden; }
.rtg-on .login-block-heading { background: var(--paper) !important; border-bottom: 1px solid var(--line) !important; padding: 28px 28px 20px !important; }
.rtg-on .loginlabel, .rtg-on .login-block-heading label { display: block; font: 800 clamp(24px, 3vw, 32px)/1.15 var(--font-display) !important; color: var(--ink) !important; letter-spacing: -0.015em; margin: 0 0 16px !important; text-align: left; }
.rtg-on .tab-switch { display: flex !important; flex-wrap: wrap; gap: 6px; background: transparent !important; border: 0 !important; padding: 0 !important; margin: 0 !important; width: auto !important; }
.rtg-on .tab-switch li { float: none !important; width: auto !important; margin: 0 !important; background: transparent !important; border: 0 !important; }
.rtg-on .tab-switch li a { display: block; padding: 10px 18px !important; border-radius: 999px !important; border: 1px solid var(--line) !important; background: var(--paper) !important; color: var(--ink) !important; font: 600 15px var(--font-body) !important; line-height: 1.3 !important; }
.rtg-on .tab-switch li.active a, .rtg-on .tab-switch li a:hover { background: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important; }
.rtg-on .tab-switch li::after, .rtg-on .tab-switch::after, .rtg-on .tab-switch li a::after { display: none !important; }
.rtg-on .login-right, .rtg-on .login-left { padding: 24px 28px 32px !important; background: var(--paper) !important; }
.rtg-on .login-data-inner > p { color: var(--muted); }
.rtg-on .partation h1, .rtg-on .login-right h1, .rtg-on .login-right h2 { font: 700 20px var(--font-display) !important; color: var(--ink) !important; margin: 8px 0 14px !important; letter-spacing: -0.01em; }
.rtg-on .form-group label, .rtg-on .login-right label { font: 600 14px var(--font-body) !important; color: var(--ink) !important; position: static !important; transform: none !important; margin-bottom: 6px !important; display: block; background: transparent !important; padding: 0 !important; }
.rtg-on .form-group label .red, .rtg-on .form-group .red { color: #B42318 !important; }
.rtg-on .form-group { margin-bottom: 16px !important; }
.rtg-on .login-right input[type=text], .rtg-on .login-right input[type=email], .rtg-on .login-right input[type=password],
.rtg-on .login-right input[type=tel], .rtg-on .login-right input[type=number], .rtg-on .login-right select, .rtg-on .login-right textarea,
.rtg-on .create-account-input {
  background: var(--mist) !important; border: 2px solid transparent !important; border-radius: 10px !important;
  min-height: 50px !important; height: auto !important; padding: 12px 14px !important; font: 500 16px var(--font-body) !important; color: var(--ink) !important; box-shadow: none !important; width: 100%;
}
.rtg-on .login-right input:focus, .rtg-on .login-right select:focus, .rtg-on .login-right textarea:focus { border-color: var(--brand) !important; background: var(--paper) !important; outline: none !important; }
.rtg-on .phone-column { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.rtg-on .phone-column > label { flex-basis: 100%; }
.rtg-on .phone-column .phonecode, .rtg-on input.phonecode { max-width: 84px !important; flex: none; text-align: center; }
.rtg-on .phone-column .create-account-input1 { flex: 1; min-width: 0; }
.rtg-on .relative_ele { position: relative; }
.rtg-on #eye, .rtg-on .relative_ele button { position: absolute; right: 10px; bottom: 12px; background: transparent !important; border: 0 !important; }
.rtg-on .login-right input[type=submit], .rtg-on .login-right button[type=submit], .rtg-on .login-right .submit-but, .rtg-on .login-right .btn-submit, .rtg-on .login-right .gen-btn {
  background: var(--brand) !important; color: #fff !important; border: 0 !important; border-radius: 10px !important; min-height: 50px !important; padding: 0 28px !important;
  font: 600 16px var(--font-body) !important; cursor: pointer; box-shadow: none !important; text-transform: none !important; letter-spacing: 0 !important; width: auto;
}
.rtg-on .login-right input[type=submit]:hover, .rtg-on .login-right button[type=submit]:hover { background: var(--brand-deep) !important; }
.rtg-on .login-right a { color: var(--brand); font-weight: 600; }
.rtg-on .alert { border-radius: 10px; }
/* social sign-in */
.rtg-on .social-list { display: grid !important; gap: 10px; max-width: 420px; margin: 0 auto !important; padding: 0 !important; }
.rtg-on .social-list li { width: auto !important; float: none !important; margin: 0 !important; }
.rtg-on .social-list li a { display: flex !important; align-items: center; justify-content: center; gap: 10px; min-height: 50px; border-radius: 10px !important; background: var(--paper) !important; color: var(--ink) !important; border: 1px solid var(--line) !important; font: 600 15px var(--font-body) !important; padding: 0 18px !important; box-shadow: none !important; }
.rtg-on .social-list li a:hover { background: var(--mist) !important; }
.rtg-on .social-list li a img { width: 22px !important; height: 22px !important; background: transparent !important; padding: 0 !important; margin: 0 !important; }
.rtg-on .social-list .btn-facebook, .rtg-on .social-list .btn-linkedin { display: none !important; }
.rtg-on .or-row, .rtg-on .or-divider, .rtg-on .login-or { color: var(--muted); }
/* side "how to register" panel */
.rtg-on .login-caption, .rtg-on .login-right .gen-cms-page { color: var(--muted); }
@media (max-width: 700px) {
  .rtg-on .login-main { padding: 20px 12px 40px !important; }
  .rtg-on .login-block-heading, .rtg-on .login-right, .rtg-on .login-left { padding-left: 18px !important; padding-right: 18px !important; }
  .rtg-on .form-group.onethird, .rtg-on .form-group.half { width: 100% !important; float: none !important; }
}

/* layout fixes for the old grid (content-box inputs, floating labels) */
.rtg-on .login-right *, .rtg-on .login-block-heading * { box-sizing: border-box !important; }
.rtg-on .tabholder, .rtg-on .login-tabholder { background: transparent !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; }
.rtg-on .partation { display: flex !important; flex-wrap: wrap !important; gap: 0 16px; align-items: flex-start; margin: 0 0 8px !important; }
.rtg-on .partation > h1 { flex-basis: 100%; padding: 0 !important; }
.rtg-on .partation > .form-group.onethird { flex: 1 1 calc(33.333% - 11px) !important; width: auto !important; max-width: none !important; margin: 0 0 16px !important; padding: 0 !important; min-width: 200px; }
.rtg-on .partation > .form-group.half { flex: 1 1 calc(50% - 8px) !important; width: auto !important; margin: 0 0 16px !important; padding: 0 !important; min-width: 220px; }
.rtg-on .partation > .form-group.captcha-column, .rtg-on .partation > .check-combo, .rtg-on .partation > .button-block { flex-basis: 100% !important; padding-left: 0 !important; }
.rtg-on .form-group label, .rtg-on .relative_ele label { margin-top: 0 !important; top: auto !important; left: auto !important; height: auto !important; line-height: 1.4 !important; }
.rtg-on .form-group > select, .rtg-on .form-group > .relative_ele + select { margin-top: 23px !important; }
.rtg-on .login-right input[type=text], .rtg-on .login-right input[type=email], .rtg-on .login-right input[type=password],
.rtg-on .login-right input[type=tel], .rtg-on .login-right select, .rtg-on .create-account-input { height: 50px !important; width: 100% !important; margin: 0 !important; }
.rtg-on .phone-column { flex-wrap: wrap !important; gap: 0 8px !important; }
.rtg-on .phone-column input.phonecode { position: static !important; width: 84px !important; }
.rtg-on .phone-column input.create-account-input1 { width: auto !important; flex: 1 1 0; min-width: 0; }
.rtg-on .check-combo { align-items: center; gap: 10px; padding: 0 !important; margin: 4px 0 16px; }
.rtg-on .button-block { padding: 0 !important; }
.rtg-on .social-list li a img { position: static !important; }
.rtg-on .soc-login-row > label { text-align: center; color: var(--muted) !important; }
.rtg-on .member-txt { text-align: center; color: var(--muted); }
.rtg-on .login-caption { display: none !important; }
@media (max-width: 700px) { .rtg-on .partation > .form-group.onethird, .rtg-on .partation > .form-group.half { flex-basis: 100% !important; } }
.rtg-on .tab-switch { justify-content: center; }
.rtg-on .tab-switch li a { text-align: center; min-width: 96px; }
.rtg-on .login-right:not(.full-width) { float: none !important; margin: 0 auto !important; max-width: 520px; width: 100% !important; }
.rtg-on .login-right:not(.full-width) .login-data-inner { padding-top: 0 !important; margin-top: 0 !important; }
.rtg-on .login-left:empty { display: none !important; }
.rtg-on .check-combo { flex-wrap: nowrap !important; }
.rtg-on .check-combo label { margin: 0 !important; }
.rtg-shell .top-right a { white-space: nowrap; }
@media (max-width: 420px) { .rtg-shell .top .wrap { gap: 10px; } .rtg-shell .top-right a { padding: 8px 10px; font-size: 14px; } .rtg-shell .brand img.word { height: 11px; } }


/* ---------- account bar (logged-in) ---------- */
.rtg-shell .rtg-acct { background: var(--paper); border-bottom: 1px solid var(--line); }
.rtg-shell .rtg-acct[hidden] { display: none; }
.rtg-shell .rtg-acct .wrap { display: flex; gap: 4px; overflow-x: auto; padding-block: 8px; scrollbar-width: thin; }
.rtg-shell .rtg-acct a { flex: none; padding: 8px 14px; border-radius: 999px; color: var(--ink); font: 600 14px var(--font-body); white-space: nowrap; }
.rtg-shell .rtg-acct a:hover { background: var(--mist); }
.rtg-shell .rtg-acct a[aria-current="page"] { background: var(--brand); color: #fff; }
.rtg-shell .rtg-acct a img, .rtg-shell .rtg-acct a i { display: none; }

/* ---------- generic skin for the older pages ---------- */
.rtg-on body { font-family: var(--font-body) !important; color: var(--ink); background: var(--mist) !important; }
.rtg-on h1, .rtg-on h2, .rtg-on h3 { font-family: var(--font-display) !important; letter-spacing: -0.01em; }
.rtg-on .page-contant, .rtg-on .page-contant-inner, .rtg-on .general-form, .rtg-on .profile-section, .rtg-on .trips-page, .rtg-on .static-page, .rtg-on .inner-page { font-family: var(--font-body) !important; }
.rtg-on .page-contant h2.header-page, .rtg-on h2.header-page, .rtg-on .page-title, .rtg-on .heading-text h1 { font: 800 clamp(26px, 3.4vw, 36px)/1.15 var(--font-display) !important; color: var(--ink) !important; }
.rtg-on .btn-primary, .rtg-on .btn-info, .rtg-on .gen-btn, .rtg-on .btn.save, .rtg-on input[type=submit].btn, .rtg-on button.btn-primary, .rtg-on .submit-but, .rtg-on .btn-default.save,
.rtg-on .login-right input[type=submit] {
  background: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important; border-radius: 10px !important; font-family: var(--font-body) !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; box-shadow: none !important;
}
.rtg-on .btn-primary:hover, .rtg-on .gen-btn:hover, .rtg-on .submit-but:hover { background: var(--brand-deep) !important; border-color: var(--brand-deep) !important; }
.rtg-on .form-control, .rtg-on select.form-control, .rtg-on textarea.form-control {
  border-radius: 10px !important; border: 2px solid transparent !important; background: var(--mist) !important; box-shadow: none !important; min-height: 46px; font-family: var(--font-body) !important; color: var(--ink) !important;
}
.rtg-on .form-control:focus { border-color: var(--brand) !important; background: #fff !important; }
.rtg-on table.table, .rtg-on .dataTable { background: #fff; border-radius: 12px; overflow: hidden; }
.rtg-on table.table thead th, .rtg-on .dataTable thead th { background: var(--brand) !important; color: #fff !important; border-color: var(--brand) !important; font-weight: 600; }
.rtg-on .panel, .rtg-on .card-block, .rtg-on .gen-cms-page, .rtg-on .static-page { border-radius: 14px; }
.rtg-on a { color: inherit; }
.rtg-on .page-contant a:not(.btn), .rtg-on .static-page a:not(.btn) { color: var(--brand); }
.rtg-on .pagination > .active > a, .rtg-on .pagination > .active > span { background: var(--brand) !important; border-color: var(--brand) !important; }
.rtg-on .nav-tabs > li.active > a, .rtg-on .tab-switch li.active a { background: var(--brand) !important; color: #fff !important; }
.rtg-on .alert { border-radius: 10px; }

/* ---------- fare estimate (fare-estimate) ---------- */
.rtg-on .get-fare-estimation { background: var(--mist) !important; padding: 40px 16px 64px !important; margin: 0 !important; }
.rtg-on .get-fare-estimation-inner { max-width: 1200px; margin: 0 auto; padding: 0 !important; }
.rtg-on .get-free1 { display: grid !important; grid-template-columns: minmax(0, 440px) minmax(0, 1fr); gap: 24px; align-items: start; }
.rtg-on .get-fare-estimation-left { width: auto !important; float: none !important; background: #fff !important; border-radius: 16px; padding: 28px !important; border: 1px solid var(--line); box-shadow: 0 12px 40px rgba(52,68,97,.08); }
.rtg-on .get-fare-estimation-left h3 { font: 800 clamp(26px, 3vw, 34px)/1.12 var(--font-display) !important; color: var(--ink) !important; margin: 0 0 20px !important; letter-spacing: -0.015em; }
.rtg-on .get-fare-estimation-left form b { display: block; position: relative; margin: 0 0 10px; font-weight: 400; }
.rtg-on .get-fare-estimation-left input[type=text] { width: 100% !important; height: 52px !important; box-sizing: border-box; background: var(--mist) !important; border: 2px solid transparent !important; border-radius: 10px !important; padding: 0 14px !important; font: 500 16px var(--font-body) !important; color: var(--ink) !important; }
.rtg-on .get-fare-estimation-left input[type=text]:focus { border-color: var(--brand) !important; background: #fff !important; outline: none; }
.rtg-on .get-fare-estimation-left form b button { position: absolute; right: 6px; top: 6px; height: 40px; width: 44px; border: 0; border-radius: 8px; background: var(--brand) !important; color: #fff !important; cursor: pointer; }
.rtg-on .get-fare-estimation1 { display: flex !important; gap: 8px; margin: 0 0 14px !important; padding: 0 !important; }
.rtg-on .get-fare-estimation1 .input-av { width: auto !important; float: none !important; display: flex; align-items: center; gap: 8px; padding: 8px 14px !important; border: 1px solid var(--line); border-radius: 999px; font-weight: 600; }
.rtg-on .get-fare-estimation-left br { display: none; }
.rtg-on #setEstimate_figure { margin-top: 14px; }
.rtg-on #setEstimate_figure table, .rtg-on #setEstimate_figure ul { width: 100%; }
/* fare list: one row per vehicle type, price on the right */
.rtg-on #setEstimate_figure { margin-top: 18px !important; padding-top: 16px; border-top: 1px solid var(--line); }
.rtg-on #setEstimate_figure::before { content: attr(data-title); display: block; font: 700 15px var(--font-body); color: var(--muted); margin: 0 0 10px; text-transform: uppercase; letter-spacing: .06em; }
.rtg-on #setEstimate_figure ul { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; gap: 8px; }
.rtg-on #setEstimate_figure li { margin: 0 !important; padding: 0 !important; float: none !important; width: auto !important; background: none !important; border: 0 !important; }
.rtg-on #setEstimate_figure li label { display: flex !important; align-items: center; gap: 10px; margin: 0 !important; padding: 13px 16px !important; border: 1px solid var(--line); border-radius: 12px; background: #fff; font: 600 16px var(--font-body) !important; color: var(--ink) !important; width: auto !important; float: none !important; transition: border-color .15s, background .15s; }
.rtg-on #setEstimate_figure li label:hover { border-color: var(--brand); background: var(--mist); }
.rtg-on #setEstimate_figure li label img { order: 2; width: 18px !important; height: 18px !important; margin: 0 !important; border-radius: 50%; opacity: .5; cursor: pointer; flex: none; }
.rtg-on #setEstimate_figure li label img:hover { opacity: 1; }
.rtg-on #setEstimate_figure li label b { order: 3; margin-left: auto !important; font: 800 17px var(--font-display) !important; color: var(--ink) !important; float: none !important; white-space: nowrap; }
.rtg-on #setEstimate_figure h4 { font: 600 15px var(--font-body) !important; color: var(--muted) !important; }
.rtg-on #imageIcons img { width: 28px; }
.rtg-on .home-page-map { width: auto !important; float: none !important; min-height: 520px; height: 520px !important; border-radius: 16px; overflow: hidden; background: #E4E9F0; }
@media (max-width: 900px) { .rtg-on .get-free1 { grid-template-columns: minmax(0, 1fr); } .rtg-on .home-page-map { height: 320px !important; min-height: 320px; } }

/* ---------- order food: address search (order-items) ---------- */
.rtg-on .search-banner { background: linear-gradient(rgba(36,48,70,.72), rgba(36,48,70,.80)), url(photos/hero-restaurants.jpg) center 55% / cover no-repeat, var(--brand) !important; padding: 88px 16px !important; }
.rtg-on .search-banner.rtg-grocery { background: linear-gradient(rgba(36,48,70,.70), rgba(36,48,70,.80)), url(photos/hero-groceries.jpg) center 50% / cover no-repeat, var(--brand) !important; }
.rtg-on .search-banner .search-head, .rtg-on .search-banner h3 { font: 800 clamp(28px, 4vw, 44px)/1.1 var(--font-display) !important; color: #fff !important; letter-spacing: -0.015em; }
.rtg-on .search-banner p { color: var(--brand-soft) !important; }
.rtg-on .search-main-form .delivery-input { height: 56px !important; border-radius: 10px 0 0 10px !important; border: 0 !important; font: 500 16px var(--font-body) !important; padding: 0 16px !important; }
.rtg-on .search-main-form button#submitbtn { height: 56px !important; border-radius: 0 10px 10px 0 !important; background: var(--paper) !important; color: var(--brand) !important; border: 0 !important; font: 700 15px var(--font-body) !important; text-transform: none !important; }
.rtg-on .howitwork { background: var(--paper) !important; color: var(--ink) !important; }
.rtg-on .howitwork h3, .rtg-on .howitwork h4 { color: var(--ink) !important; font-family: var(--font-display) !important; }
.rtg-on .howitwork p { color: var(--muted) !important; }
.rtg-on .howitwork img { display: none !important; }
.rtg-on .howitwork * { color: var(--ink) !important; }
.rtg-on .howitwork p { color: var(--muted) !important; }
.rtg-on .howitwork h1, .rtg-on .howitwork h2, .rtg-on .howitwork h3, .rtg-on .howitwork h4, .rtg-on .howitwork strong, .rtg-on .howitwork b { font-family: var(--font-display) !important; }
.rtg-on .search-banner .page-contant-inner, .rtg-on .search-banner .set-min-height { min-height: 0 !important; height: auto !important; padding-block: 24px !important; }
.rtg-on .howitwork-inner { padding-block: 40px !important; }
.rtg-on .login-right .phone-column { display: flex !important; flex-wrap: wrap !important; align-items: flex-end; }
.rtg-on .login-right .phone-column > input.phonecode { flex: 0 0 76px !important; width: 76px !important; }
.rtg-on .login-right .phone-column > input.create-account-input1 { flex: 1 1 0 !important; width: 0 !important; min-width: 0 !important; }

/* sign-up forms: one regular 3-column grid; every field has a label row (labels added by the shell script) */
.rtg-on .partation { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 16px; align-items: start; }
.rtg-on .partation > h1, .rtg-on .partation > .captcha-column, .rtg-on .partation > .check-combo, .rtg-on .partation > .button-block, .rtg-on .partation > div:not(.form-group), .rtg-on .partation > .clear { grid-column: 1 / -1; }
.rtg-on .partation > .form-group.onethird, .rtg-on .partation > .form-group.half, .rtg-on .partation > .form-group { min-width: 0 !important; flex: none !important; width: auto !important; }
.rtg-on .partation > .form-group > label, .rtg-on .partation > .form-group #referlbl { display: block; height: 20px !important; line-height: 20px !important; margin: 0 0 6px !important; padding: 0 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rtg-on .partation > .form-group > label .red { line-height: 20px !important; vertical-align: top; }
.rtg-on .partation > .form-group > select { margin-top: 0 !important; }
@media (max-width: 800px) { .rtg-on .partation { grid-template-columns: minmax(0, 1fr); } }
.rtg-on .btn-google1 img, .rtg-on .social-list img { width: 20px !important; height: 20px !important; }
.rtg-on .partation .form-group label { display: block; height: 20px !important; line-height: 20px !important; margin: 0 0 6px !important; padding: 0 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rtg-on .partation .form-group .relative_ele { margin: 0 !important; padding: 0 !important; }
.rtg-on .partation .form-group > strong { display: block !important; font-weight: inherit; margin: 0; padding: 0; }
/* sign-in: photo on the left (desktop), form on the right; on phones only the form (the old V3Cube
   illustration pushed the form below the fold) */
.rtg-on .login-left > img, .rtg-on .login-left .login-caption { display: none !important; }
.rtg-on .login-right { float: none !important; width: 100% !important; max-width: 480px !important; margin: 0 auto !important; box-sizing: border-box !important; }
@media (min-width: 901px) {
  .rtg-on .login-block { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
  .rtg-on .login-block > .login-block-heading { grid-column: 1 / -1; }
  .rtg-on .login-block > :not(.login-block-heading):not(.login-left):not(.login-right) { grid-column: 1 / -1; }
  .rtg-on .login-left { display: block !important; float: none !important; width: auto !important; min-height: 520px; margin: 0 !important; padding: 0 !important;
    border-radius: 0 0 0 16px; background: linear-gradient(180deg, rgba(36,48,70,0) 45%, rgba(36,48,70,.55) 100%), url(photos/rider-backseat.jpg) center 35% / cover no-repeat !important; }
  .rtg-on .login-right { align-self: center; max-width: none !important; padding: 40px 48px !important; }
  .rtg-on .login-block > .login-block-heading { margin-bottom: 0 !important; }
}
@media (max-width: 900px) { .rtg-on .login-left { display: none !important; } }

/* Booking / fare panel (userbooking, fare estimate): the panel grows with its content and the page
   scrolls, the map stays fixed behind it, the Book button stays visible at the bottom. Phone code
   and number on one line. */
@media (min-width: 992px) {
  .rtg-on .booking-block ul.stepper.linear { height: auto !important; max-height: none !important; overflow: visible !important; }
  .rtg-on body:has(.booking-block .booking-footer) #map-canvas { position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; height: 100vh !important; }
  .rtg-on .booking-block .booking-footer { position: sticky !important; bottom: 0; z-index: 5; }
}
.rtg-on .phone-column { flex-wrap: wrap; gap: 0 8px; }
.rtg-on .phone-column > label { flex: 0 0 100%; }
.rtg-on .phone-column #vPhoneCode { flex: 0 0 72px; width: 72px !important; margin: 0 !important; }
.rtg-on .phone-column #vPhone { flex: 1 1 0; min-width: 0; width: auto !important; margin: 0 !important; }
/* sign-up uses the same box without the photo column: use the full width */
@media (min-width: 901px) {
  .rtg-on .login-block:not(:has(> .login-left)) { display: block !important; }
  .rtg-on .login-block:not(:has(> .login-left)) > .login-right { max-width: none !important; padding: 32px 40px !important; }
}