@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap");
:root { --gs-primary: var(--wd-primary-color, #0066FF);
--gs-primary-hover: var(--wd-primary-color-hover, #0052cc); --gs-btn-bg: var(--btn-accented-bgcolor, var(--btn-default-bgcolor, #0A0D12));
--gs-btn-bg-hover: var(--btn-accented-bgcolor-hover, var(--btn-default-bgcolor-hover, #121721));
--gs-btn-color: var(--btn-accented-color, var(--btn-default-color, #ffffff));
--gs-btn-color-hover: var(--btn-accented-color-hover, var(--wd-primary-color, #0066FF));
--gs-btn-radius: var(--btn-accented-brd-radius, var(--btn-default-brd-radius, 6px));
--gs-btn-font: var(--wd-entities-title-font, 'Montserrat', sans-serif);
--gs-btn-font-weight: 700;
--gs-btn-transform: none;
--gs-btn-letter-spacing: 0.3px;
--gs-dark: var(--wd-entities-title-color, #0A0D12);
--gs-dark-surface: #121721;
--gs-slate: #4B5563;
--gs-slate-light: #94A3B8;
--gs-border: #E5E7EB;
--gs-bg-light: #F8FAFC;
--gs-success: #10B981;
--gs-warning: #F59E0B;
--gs-danger: #EF4444;
--gs-font-title: var(--wd-entities-title-font, 'Montserrat', sans-serif);
--gs-font-body: var(--wd-text-font, 'Inter', sans-serif);
--gs-radius: 16px;
--gs-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
} .gs-btn-primary {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
background: var(--gs-btn-bg, #0A0D12) !important;
color: var(--gs-btn-color, #ffffff) !important;
border: none !important;
border-radius: var(--gs-btn-radius, 6px) !important;
font-family: var(--gs-btn-font, var(--gs-font-title, 'Montserrat', sans-serif)) !important;
font-size: 14.5px !important;
font-weight: var(--gs-btn-font-weight, 700) !important;
text-transform: var(--gs-btn-transform, none) !important;
letter-spacing: var(--gs-btn-letter-spacing, 0.3px) !important;
padding: 14px 26px !important;
cursor: pointer !important;
pointer-events: auto !important;
text-decoration: none !important;
white-space: nowrap !important;
transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
box-sizing: border-box !important;
}
.gs-btn-primary:hover {
background: var(--gs-btn-bg-hover, #121721) !important;
color: var(--gs-btn-color-hover, #0066FF) !important;
transform: translateY(-2px) !important;
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25) !important;
}
.gs-btn-primary:active {
transform: translateY(0) !important;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}
.gs-btn-secondary {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
background: #F1F5F9 !important;
color: #334155 !important;
border: 1px solid #E2E8F0 !important;
border-radius: var(--gs-btn-radius, 10px) !important;
font-family: var(--gs-btn-font, var(--gs-font-title, 'Montserrat', sans-serif)) !important;
font-size: 14px !important;
font-weight: 600 !important;
padding: 13px 22px !important;
cursor: pointer !important;
pointer-events: auto !important;
text-decoration: none !important;
white-space: nowrap !important;
transition: all 0.2s ease !important;
}
.gs-btn-secondary:hover {
background: #E2E8F0 !important;
color: #0F172A !important;
transform: translateY(-1px) !important;
} .getseat-booking-wrapper,
.getseat-driver-portal-wrapper {
font-family: var(--gs-font-body);
color: #1F2937;
max-width: 1140px;
margin: 30px auto;
background: #ffffff;
border-radius: var(--gs-radius);
box-shadow: var(--gs-shadow);
border: 1px solid var(--gs-border);
overflow: visible !important;
position: relative;
z-index: 20;
}
.gs-wizard-progress {
display: flex;
align-items: center;
justify-content: space-between;
background: #0A0D12;
padding: 18px 30px;
border-bottom: 2px solid var(--gs-primary);
border-top-left-radius: var(--gs-radius, 16px);
border-top-right-radius: var(--gs-radius, 16px);
}
.gs-progress-step {
display: flex;
align-items: center;
gap: 10px;
cursor: pointer;
opacity: 0.5;
transition: all 0.25s ease;
}
.gs-progress-step.active {
opacity: 1;
}
.gs-step-circle {
width: 32px;
height: 32px;
border-radius: 50%;
background: #1F2937;
color: #9CA3AF;
display: flex;
align-items: center;
justify-content: center;
font-family: var(--gs-font-title);
font-size: 13px;
font-weight: 800;
border: 2px solid #374151;
transition: all 0.25s;
}
.gs-progress-step.active .gs-step-circle {
background: var(--gs-primary);
color: #ffffff;
border-color: #BFDBFE;
box-shadow: 0 0 12px rgba(0, 102, 255, 0.6);
}
.gs-step-info {
display: flex;
flex-direction: column;
}
.gs-step-num {
font-size: 10px;
font-weight: 800;
letter-spacing: 1px;
color: var(--gs-primary);
text-transform: uppercase;
}
.gs-step-text {
font-family: var(--gs-font-title);
font-size: 13px;
font-weight: 700;
color: #ffffff;
}
.gs-progress-line {
flex: 1;
height: 2px;
background: #374151;
margin: 0 16px;
transition: all 0.25s;
}
.gs-progress-line.active {
background: var(--gs-primary);
} .gs-wizard-page {
display: none;
animation: fadeIn 0.3s ease;
}
.gs-wizard-page.active {
display: block;
}
.gs-step-body {
padding: 24px;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(6px); }
to { opacity: 1; transform: translateY(0); }
} .gs-tabs-header {
display: flex;
background: #F1F5F9;
border-bottom: 2px solid var(--gs-border);
}
.gs-tab-btn {
flex: 1;
background: transparent;
border: none;
padding: 16px 20px;
font-family: var(--gs-font-title);
font-size: 15px;
font-weight: 700;
color: #64748B;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
transition: all 0.25s ease;
}
.gs-tab-btn:hover {
color: #111827;
background: rgba(0, 0, 0, 0.03);
}
.gs-tab-btn.active {
color: var(--gs-primary);
background: #ffffff;
border-bottom: 3px solid var(--gs-primary);
}
.gs-tab-content {
display: none;
}
.gs-tab-content.active {
display: block;
animation: fadeIn 0.25s ease;
} .gs-selected-route-pill {
display: flex;
justify-content: space-between;
align-items: center;
background: #EFF6FF;
border: 1.5px solid #BFDBFE;
border-radius: 10px;
padding: 14px 18px;
margin-bottom: 20px;
}
.gs-srp-left {
display: flex;
align-items: center;
gap: 10px;
}
.gs-srp-icon { font-size: 20px; }
.gs-srp-text { font-size: 14px; color: #1E40AF; }
.gs-btn-change-route {
background: #ffffff;
border: 1px solid #BFDBFE;
color: var(--gs-primary);
font-size: 12px;
font-weight: 700;
padding: 6px 14px;
border-radius: 6px;
cursor: pointer;
transition: all 0.2s;
}
.gs-btn-change-route:hover {
background: var(--gs-primary);
color: #ffffff;
} .gs-form {
padding: 0;
}
.gs-section-title {
font-family: var(--gs-font-title);
font-size: 16px;
font-weight: 800;
color: var(--gs-dark);
margin-bottom: 16px;
display: flex;
align-items: center;
gap: 8px;
}
.gs-section-title::before {
content: '';
display: inline-block;
width: 4px;
height: 18px;
background: var(--gs-primary);
border-radius: 2px;
}
.gs-grid {
display: grid;
gap: 16px;
}
.gs-grid-2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.gs-grid-3 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.gs-grid-4 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
#getseat-step1-search {
margin: 20px auto 25px;
padding: 0 10px 30px;
position: relative;
z-index: 50;
}
.gs-field-group {
display: flex;
flex-direction: column;
}
.gs-field-group label {
font-size: 13px;
font-weight: 600;
color: #374151;
margin-bottom: 6px;
}
.gs-input-icon-wrap {
position: relative;
display: flex;
align-items: center;
}
.gs-input-icon-wrap .gs-icon {
position: absolute;
left: 12px;
font-size: 16px;
pointer-events: none;
}
.gs-form input[type="text"],
.gs-form input[type="email"],
.gs-form input[type="tel"],
.gs-form input[type="date"],
.gs-form input[type="time"],
.gs-form textarea,
.gs-select-quick {
width: 100%;
padding: 12px 14px;
border: 1.5px solid var(--gs-border);
border-radius: 8px;
font-family: var(--gs-font-body);
font-size: 14px;
color: #111827;
background: #ffffff;
transition: all 0.2s;
box-sizing: border-box;
}
.gs-input-icon-wrap input {
padding-left: 38px !important;
}
.gs-form input:focus,
.gs-form textarea:focus,
.gs-select-quick:focus {
outline: none;
border-color: var(--gs-primary);
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.15);
}
.gs-hint {
font-size: 11px;
color: #6B7280;
margin-top: 4px;
} .gs-quick-routes {
background: #EFF6FF;
border: 1px dashed #BFDBFE;
border-radius: 8px;
padding: 12px 16px;
margin-bottom: 18px;
}
.gs-quick-label {
display: block;
font-size: 12px;
font-weight: 700;
color: #1E40AF;
margin-bottom: 6px;
}
.gs-select-quick {
background: #ffffff;
font-weight: 500;
} .gs-tour-section-intro {
margin: 15px 0 20px;
text-align: center;
}
.gs-tour-section-title {
font-family: var(--gs-font-title);
font-size: 20px;
font-weight: 800;
color: #111827;
margin: 0 0 6px;
letter-spacing: -0.3px;
}
.gs-tour-section-sub {
font-size: 13.5px;
color: #6B7280;
margin: 0 auto;
max-width: 680px;
line-height: 1.5;
} .gs-tours-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 16px;
margin-bottom: 20px;
}
.gs-tour-card {
border: 2px solid #E5E7EB;
border-radius: 16px;
padding: 0;
background: #ffffff;
cursor: pointer;
transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
display: flex;
flex-direction: column;
position: relative;
overflow: hidden;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}
.gs-tour-card:hover {
border-color: #93C5FD;
transform: translateY(-3px);
box-shadow: 0 8px 22px rgba(1, 111, 248, 0.12);
}
.gs-tour-card.selected {
border-color: var(--gs-primary);
background: #F8FAFC;
box-shadow: 0 8px 24px rgba(1, 111, 248, 0.16);
} .gs-tour-card-img-wrap {
position: relative;
width: 100%;
height: 160px;
overflow: hidden;
background: #0f172a;
}
.gs-tour-card-img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.gs-tour-card:hover .gs-tour-card-img {
transform: scale(1.06);
}
.gs-tour-card-img-wrap::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 45px;
background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
pointer-events: none;
}
.gs-tour-card-img-wrap .gs-tour-card-badge-wrap {
position: absolute;
top: 10px;
left: 10px;
right: 10px;
display: flex;
justify-content: space-between;
align-items: center;
z-index: 2;
margin-bottom: 0;
}
.gs-tour-card-img-wrap .gs-tour-duration {
font-size: 11px;
background: rgba(15, 23, 42, 0.78);
backdrop-filter: blur(6px);
color: #ffffff;
padding: 4px 10px;
border-radius: 20px;
font-weight: 700;
border: 1px solid rgba(255, 255, 255, 0.25);
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
}
.gs-tour-time-pill {
font-size: 11px;
background: rgba(2, 132, 199, 0.88);
backdrop-filter: blur(6px);
color: #ffffff;
padding: 4px 10px;
border-radius: 20px;
font-weight: 700;
border: 1px solid rgba(255, 255, 255, 0.3);
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
}
input.gs-time-locked {
background: #f8fafc !important;
border-color: #cbd5e1 !important;
color: #1e293b !important;
font-weight: 700 !important;
cursor: default !important;
user-select: none;
}
.gs-tour-selected-pill {
display: none;
font-size: 11px;
font-weight: 800;
background: var(--gs-primary);
color: #ffffff;
padding: 4px 10px;
border-radius: 20px;
letter-spacing: 0.3px;
text-transform: uppercase;
box-shadow: 0 2px 8px rgba(1, 111, 248, 0.4);
}
.gs-tour-card.selected .gs-tour-selected-pill {
display: inline-block;
}
.gs-tour-card-body {
padding: 16px 18px 18px;
display: flex;
flex-direction: column;
flex-grow: 1;
}
.gs-tour-header {
display: flex;
flex-direction: column;
gap: 4px;
margin-bottom: 10px;
}
.gs-tour-title {
font-size: 16px;
font-weight: 800;
margin: 0;
color: #111827;
line-height: 1.35;
}
.gs-tour-price {
font-family: var(--gs-font-title);
font-weight: 800;
color: var(--gs-primary);
font-size: 15px;
}
.gs-tour-desc {
font-size: 12.5px;
color: #4B5563;
line-height: 1.5;
margin: 0 0 12px;
flex-grow: 1;
}
.gs-tour-highlights {
list-style: none;
padding: 0;
margin: 0 0 14px;
font-size: 11.5px;
color: #065F46;
background: #F0FDF4;
border-radius: 10px;
padding: 10px 12px;
}
.gs-tour-highlights li {
margin-bottom: 4px;
line-height: 1.35;
}
.gs-tour-highlights li:last-child {
margin-bottom: 0;
}
.gs-tour-card-footer {
margin-top: auto;
padding-top: 8px;
}
.gs-btn-select-tour {
width: 100%;
padding: 11px 16px;
background: var(--gs-btn-bg, #0A0D12);
color: var(--gs-btn-color, #ffffff);
border: none;
border-radius: var(--gs-btn-radius, 6px);
font-family: var(--gs-btn-font, var(--gs-font-title));
font-size: 13.5px;
font-weight: var(--gs-btn-font-weight, 700);
text-transform: var(--gs-btn-transform, none);
cursor: pointer;
transition: all 0.2s ease;
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}
.gs-tour-card:hover .gs-btn-select-tour,
.gs-tour-card.selected .gs-btn-select-tour {
background: var(--gs-btn-bg-hover, #121721);
color: var(--gs-btn-color-hover, #0066FF);
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
} .gs-step2-tour-card {
background: #ffffff;
border: 1px solid #e2e8f0;
border-radius: 14px;
padding: 16px 20px;
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
}
.gs-step2-tour-header {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 12px;
margin-bottom: 14px;
border-bottom: 1px solid #f1f5f9;
}
.gs-step2-tour-badge-title {
display: flex;
align-items: center;
gap: 12px;
}
.gs-step2-tour-icon {
font-size: 26px;
}
.gs-step2-tour-eyebrow {
font-size: 11px;
text-transform: uppercase;
letter-spacing: 0.6px;
font-weight: 700;
color: #64748b;
display: block;
}
.gs-step2-tour-title {
margin: 0;
font-size: 16px;
font-weight: 800;
color: #0f172a;
}
.gs-step2-tour-duration {
background: #f0fdf4;
color: #166534;
font-weight: 700;
font-size: 12.5px;
padding: 4px 12px;
border-radius: 20px;
border: 1px solid #bbf7d0;
white-space: nowrap;
}
.gs-step2-tour-fields-grid {
display: grid;
grid-template-columns: 1.8fr 1.1fr 1fr 1fr;
gap: 12px;
align-items: flex-end;
}
.gs-step2-tour-fields-grid .gs-field-group {
margin-bottom: 0;
}
.gs-step2-tour-fields-grid label {
font-size: 12px;
font-weight: 700;
color: #334155;
margin-bottom: 6px;
display: block;
}
.gs-step2-tour-fields-grid input {
width: 100%;
border: 1px solid #cbd5e1;
border-radius: 8px;
padding: 9px 12px;
font-size: 13.5px;
color: #1e293b;
background: #f8fafc;
transition: all 0.2s ease;
}
.gs-step2-tour-fields-grid input:focus {
border-color: var(--gs-primary);
background: #ffffff;
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.12);
}
@media (max-width: 860px) {
.gs-step2-tour-fields-grid {
grid-template-columns: 1fr 1fr;
}
}
@media (max-width: 540px) {
.gs-step2-tour-fields-grid {
grid-template-columns: 1fr;
}
} .gs-tour-proceed-bar {
display: flex;
align-items: center;
justify-content: space-between;
background: #ffffff;
border: 1.5px solid #e2e8f0;
border-radius: 14px;
padding: 16px 24px;
margin-top: 22px;
margin-bottom: 12px;
box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}
.gs-tour-proceed-info {
display: flex;
flex-direction: column;
gap: 3px;
}
.gs-tour-proceed-lbl {
font-size: 11.5px;
text-transform: uppercase;
letter-spacing: 0.6px;
color: #64748b;
font-weight: 700;
}
.gs-tour-proceed-title {
font-size: 16px;
font-weight: 800;
color: #0f172a;
}
.gs-tour-proceed-btn {
background: var(--gs-btn-bg, #0A0D12);
color: var(--gs-btn-color, #ffffff);
border: none;
border-radius: var(--gs-btn-radius, 6px);
padding: 14px 28px;
font-family: var(--gs-btn-font, var(--gs-font-title));
font-size: 14.5px;
font-weight: var(--gs-btn-font-weight, 700);
text-transform: var(--gs-btn-transform, none);
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
transition: all 0.2s ease;
white-space: nowrap;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}
.gs-tour-proceed-btn:hover,
.gs-tf-sidebar-continue-btn:hover {
background: var(--gs-btn-bg-hover, #121721) !important;
color: var(--gs-btn-color-hover, #0066FF) !important;
transform: translateY(-2px);
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
}
@media (max-width: 640px) {
.gs-tour-proceed-bar {
flex-direction: column;
gap: 14px;
align-items: stretch;
text-align: center;
}
.gs-tour-proceed-btn {
justify-content: center;
}
} .gs-bl-col-tour-info {
flex: 2.2;
background: #F8FAFC;
border-radius: 12px;
padding: 8px 12px;
}
.gs-tour-active-display {
font-size: 13.5px;
font-weight: 800;
color: #111827;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
line-height: 1.3;
}
.gs-select-tour-bl {
width: 100%;
border: none;
background: transparent;
font-size: 13px;
font-weight: 700;
color: #111827;
outline: none;
padding: 2px 0;
cursor: pointer;
} .gs-step2-transfeero-wrap,
.gs-step3-transfeero-wrap,
.gs-step4-transfeero-wrap {
padding: 24px;
background: #FAFAFA;
}
.gs-tf-grid {
display: grid;
grid-template-columns: 1fr 360px;
gap: 30px;
align-items: start;
}
.gs-tf-main-col {
display: flex;
flex-direction: column;
}
.gs-tf-top-notice {
font-size: 13px;
font-weight: 700;
color: #4B5563;
margin-bottom: 16px;
display: flex;
align-items: center;
gap: 6px;
} .gs-tf-vehicle-list {
display: flex;
flex-direction: column;
gap: 16px;
}
.gs-tf-card {
display: flex;
align-items: center;
background: #ffffff;
border: 2px solid #E5E7EB;
border-radius: 18px;
padding: 20px 24px;
cursor: pointer;
transition: all 0.25s ease;
position: relative;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
}
.gs-tf-card:hover {
border-color: #CBD5E1;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
}
.gs-tf-card.selected {
border-color: #F59E0B; background: #FFFDF9;
box-shadow: 0 10px 30px rgba(245, 158, 11, 0.15);
} .gs-tf-card.gs-card-disabled {
opacity: 0.50 !important;
background: #F8FAFC !important;
border-color: #E2E8F0 !important;
cursor: not-allowed !important;
filter: grayscale(45%) !important;
box-shadow: none !important;
transform: none !important;
}
.gs-tf-card.gs-card-disabled:hover {
border-color: #EF4444 !important;
background: #FEF2F2 !important;
box-shadow: 0 4px 15px rgba(239, 68, 68, 0.08) !important;
transform: none !important;
}
.gs-tf-card.gs-card-disabled .gs-tf-current-price {
color: #94A3B8 !important;
}
.gs-tf-card-capacity-notice {
display: inline-flex;
align-items: center;
gap: 5px;
background: #FEE2E2;
color: #B91C1C;
border: 1px solid #FCA5A5;
font-size: 11.5px;
font-weight: 700;
padding: 3px 8px;
border-radius: 6px;
margin-top: 6px;
width: fit-content;
} @keyframes gsCardShake {
0%, 100% { transform: translateX(0); }
20%, 60% { transform: translateX(-6px); }
40%, 80% { transform: translateX(6px); }
}
.gs-tf-card.gs-card-shake {
animation: gsCardShake 0.4s ease-in-out !important;
border-color: #EF4444 !important;
} .gs-vehicle-capacity-toast {
position: fixed;
top: 24px;
left: 50%;
transform: translateX(-50%) translateY(-20px);
background: #0F172A;
color: #FFFFFF;
padding: 12px 20px;
border-radius: 12px;
border: 1px solid #334155;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
z-index: 9999999;
font-size: 13.5px;
font-weight: 600;
display: flex;
align-items: center;
gap: 10px;
opacity: 0;
pointer-events: none;
transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.gs-vehicle-capacity-toast.show {
opacity: 1;
transform: translateX(-50%) translateY(0);
pointer-events: auto;
}
.gs-vehicle-capacity-toast .gs-toast-icon {
font-size: 16px;
}
.gs-tf-card-img-wrap {
width: 170px;
flex-shrink: 0;
padding-right: 18px;
}
.gs-tf-car-img {
width: 100%;
height: auto;
max-height: 90px;
object-fit: contain;
filter: drop-shadow(0 6px 14px rgba(0,0,0,0.12));
transition: transform 0.25s ease;
}
.gs-tf-card:hover .gs-tf-car-img {
transform: scale(1.04);
}
.gs-tf-card-details {
flex: 1;
min-width: 180px;
}
.gs-tf-card-header {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 6px;
}
.gs-tf-card-title {
font-family: var(--gs-font-title);
font-size: 18px;
font-weight: 800;
color: var(--gs-dark);
margin: 0;
}
.gs-tf-badge {
display: inline-flex;
align-items: center;
font-size: 10px;
font-weight: 800;
padding: 2.5px 8px;
border-radius: 4px;
letter-spacing: 0.6px;
text-transform: uppercase;
line-height: 1.25;
margin-left: 8px;
vertical-align: middle;
white-space: nowrap;
transition: all 0.2s ease;
}
.badge-green, .badge-best-value {
background: rgba(16, 185, 129, 0.12);
color: #10B981;
border: 1px solid rgba(16, 185, 129, 0.35);
}
.badge-red, .badge-popular {
background: rgba(239, 68, 68, 0.12);
color: #EF4444;
border: 1px solid rgba(239, 68, 68, 0.35);
}
.badge-blue, .badge-vip {
background: rgba(0, 102, 255, 0.12);
color: #0066FF;
border: 1px solid rgba(0, 102, 255, 0.35);
}
.badge-gold, .badge-luxury {
background: rgba(245, 158, 11, 0.12);
color: #F59E0B;
border: 1px solid rgba(245, 158, 11, 0.35);
}
.badge-purple {
background: rgba(139, 92, 246, 0.12);
color: #8B5CF6;
border: 1px solid rgba(139, 92, 246, 0.35);
}
.badge-teal {
background: rgba(13, 148, 136, 0.12);
color: #0D9488;
border: 1px solid rgba(13, 148, 136, 0.35);
}
.badge-orange {
background: rgba(249, 115, 22, 0.12);
color: #EA580C;
border: 1px solid rgba(249, 115, 22, 0.35);
}
.badge-dark {
background: rgba(30, 41, 59, 0.12);
color: #1E293B;
border: 1px solid rgba(30, 41, 59, 0.35);
}
.gs-tf-specs-row {
display: flex;
align-items: center;
gap: 14px;
font-size: 13px;
font-weight: 600;
color: #4B5563;
margin-bottom: 6px;
}
.gs-spec-item {
display: inline-flex;
align-items: center;
gap: 5px;
color: #374151;
font-weight: 600;
font-size: 13px;
}
.gs-spec-svg {
display: inline-block;
flex-shrink: 0;
color: #4B5563;
transition: color 0.15s ease;
}
.gs-tf-card:hover .gs-spec-svg,
.gs-tf-card.selected .gs-spec-svg {
color: #111827;
}
.gs-tf-models-text {
font-size: 12px;
color: #6B7280;
margin: 0;
line-height: 1.4;
}
.gs-tf-card-price-col {
text-align: right;
min-width: 140px;
flex-shrink: 0;
padding-left: 16px;
border-left: 1px solid #F3F4F6;
}
.gs-tf-old-price-wrap {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 6px;
}
.gs-tf-old-price {
font-size: 12px;
color: #9CA3AF;
text-decoration: line-through;
}
.gs-tf-discount-tag {
background: #DEF7EC;
color: #03543F;
font-size: 10px;
font-weight: 800;
padding: 2px 6px;
border-radius: 4px;
}
.gs-tf-current-price {
font-family: var(--gs-font-title);
font-size: 24px;
font-weight: 800;
color: var(--gs-dark);
margin: 2px 0;
}
.gs-tf-price-label {
font-size: 11px;
color: #6B7280;
display: block;
margin-bottom: 10px;
}
.gs-tf-select-radio-btn {
background: #F3F4F6;
border: 1px solid #E5E7EB;
color: #374151;
font-family: var(--gs-font-title);
font-size: 12px;
font-weight: 700;
padding: 6px 16px;
border-radius: 20px;
cursor: pointer;
transition: all 0.2s;
}
.gs-tf-card.selected .gs-tf-select-radio-btn {
background: var(--gs-dark);
border-color: var(--gs-dark);
color: #ffffff;
} .gs-tf-roundtrip-banner {
display: flex;
justify-content: space-between;
align-items: center;
background: #ffffff;
border: 1.5px dashed #CBD5E1;
border-radius: 14px;
padding: 16px 20px;
margin: 20px 0 10px;
}
.gs-tf-rt-left {
display: flex;
align-items: center;
gap: 14px;
}
.gs-tf-rt-icon {
font-size: 22px;
color: var(--gs-primary);
}
.gs-tf-rt-left strong {
font-size: 14px;
color: #111827;
display: block;
margin-bottom: 2px;
}
.gs-tf-rt-left p {
font-size: 12px;
color: #6B7280;
margin: 0;
}
.gs-tf-rt-add-btn {
width: 36px;
height: 36px;
border-radius: 8px;
border: 1.5px solid #D97706;
background: #ffffff;
color: #D97706;
font-size: 20px;
font-weight: bold;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.2s;
}
.gs-tf-rt-add-btn:hover {
background: #D97706;
color: #ffffff;
} .gs-tf-bottom-choice-bar {
position: sticky;
bottom: 20px;
background: #ffffff;
border: 1.5px solid #E5E7EB;
border-radius: 16px;
padding: 16px 22px;
display: flex;
justify-content: space-between;
align-items: center;
box-shadow: 0 12px 35px rgba(0,0,0,0.14);
z-index: 40;
margin-top: 24px;
}
.gs-tf-choice-info {
display: flex;
align-items: center;
gap: 12px;
}
.gs-tf-choice-icon { font-size: 24px; }
.gs-tf-choice-lbl { font-size: 12px; color: #6B7280; display: block; }
.gs-tf-choice-name { font-family: var(--gs-font-title); font-size: 15px; color: var(--gs-dark); }
.gs-tf-choice-actions {
display: flex;
align-items: center;
gap: 12px;
}
.gs-tf-btn-continue {
background: var(--gs-btn-bg, #0A0D12);
color: var(--gs-btn-color, #ffffff);
border: none;
padding: 14px 32px;
font-family: var(--gs-btn-font, var(--gs-font-title));
font-size: 14.5px;
font-weight: var(--gs-btn-font-weight, 700);
text-transform: var(--gs-btn-transform, none);
letter-spacing: var(--gs-btn-letter-spacing, 0.3px);
border-radius: var(--gs-btn-radius, 6px);
cursor: pointer;
transition: all 0.2s ease;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}
.gs-tf-btn-continue:hover {
background: var(--gs-btn-bg-hover, #121721);
color: var(--gs-btn-color-hover, #0066FF);
transform: translateY(-2px);
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
} .gs-tf-sidebar-col {
position: sticky;
top: 30px;
}
.gs-tf-summary-card {
background: #ffffff;
border: 1.5px solid #E5E7EB;
border-radius: 20px;
padding: 24px 20px;
box-shadow: 0 6px 25px rgba(0,0,0,0.05);
}
.gs-tf-sc-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 12px;
}
.gs-tf-sc-title {
font-family: var(--gs-font-title);
font-size: 18px;
font-weight: 800;
color: var(--gs-dark);
margin: 0;
}
.gs-tf-btn-edit-top {
background: transparent;
border: none;
color: var(--gs-primary);
font-size: 12px;
font-weight: 700;
cursor: pointer;
}
.gs-tf-sc-meta-row {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8px;
}
.gs-tf-sc-badge {
background: #F3F4F6;
font-size: 11px;
font-weight: 700;
padding: 3px 8px;
border-radius: 6px;
color: #374151;
}
.gs-tf-sc-pax {
font-size: 12px;
font-weight: 600;
color: #4B5563;
}
.gs-tf-sc-outward-date {
font-size: 12px;
color: #6B7280;
margin-bottom: 16px;
} .gs-tf-timeline {
border-top: 1px solid #F3F4F6;
border-bottom: 1px solid #F3F4F6;
padding: 16px 0;
margin-bottom: 18px;
}
.gs-tf-tl-stop {
display: flex;
align-items: flex-start;
gap: 12px;
}
.gs-tf-tl-dot {
width: 10px;
height: 10px;
border-radius: 2px;
margin-top: 5px;
flex-shrink: 0;
}
.dot-black { background: #111827; }
.dot-accent { background: #F59E0B; }
.gs-tf-tl-details {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
gap: 2px;
}
.gs-tf-tl-place {
font-size: 13.5px;
font-weight: 700;
color: #111827;
line-height: 1.35;
word-break: break-word;
}
.gs-tf-tl-sub {
font-size: 11.5px;
color: #64748B;
line-height: 1.3;
}
.gs-tf-tl-sub:empty {
display: none !important;
}
.gs-tf-tl-time {
font-size: 12px;
font-weight: 700;
color: #374151;
white-space: nowrap;
flex-shrink: 0;
padding-top: 1px;
}
.gs-tf-tl-duration-badge {
margin: 10px 0 10px 22px;
padding: 4px 10px;
background: #F8FAFC;
border-left: 2px solid var(--gs-primary);
font-size: 11px;
color: #4B5563;
font-weight: 600;
border-radius: 0 4px 4px 0;
} .gs-tf-price-block {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 0 16px;
border-bottom: 1px solid #F3F4F6;
margin-bottom: 16px;
}
.gs-tf-pb-label {
font-size: 14px;
font-weight: 600;
color: #374151;
}
.gs-tf-pb-amount {
font-family: var(--gs-font-title);
font-size: 26px;
font-weight: 800;
color: var(--gs-dark);
} .gs-tf-trust-list {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 18px;
}
.gs-tf-trust-pill {
font-size: 12px;
color: #4B5563;
display: flex;
align-items: center;
gap: 8px;
}
.gs-tf-trust-pill span {
color: #10B981;
font-weight: bold;
}
.gs-tf-payment-icons {
background: #F8FAFC;
border-radius: 8px;
padding: 10px 12px;
font-size: 11px;
color: #6B7280;
line-height: 1.5;
}
.gs-tf-payment-icons strong {
display: block;
color: #111827;
margin-top: 2px;
} @media (max-width: 960px) {
.gs-tf-grid {
grid-template-columns: 1fr;
}
.gs-tf-sidebar-col {
position: static;
order: 2;
}
.gs-tf-card {
flex-direction: column;
text-align: center;
gap: 12px;
}
.gs-tf-card-img-wrap {
width: 100%;
padding: 0;
}
.gs-tf-card-price-col {
width: 100%;
border-left: none;
border-top: 1px solid #F3F4F6;
padding: 12px 0 0;
text-align: center;
}
.gs-tf-old-price-wrap {
justify-content: center;
}
.gs-tf-specs-row {
justify-content: center;
}
.gs-tf-card-header {
justify-content: center;
}
}
.gs-vehicle-card {
border: 2px solid var(--gs-border);
border-radius: 12px;
padding: 22px 18px;
text-align: center;
position: relative;
cursor: pointer;
transition: all 0.25s;
background: #ffffff;
display: flex;
flex-direction: column;
}
.gs-vehicle-card:hover {
border-color: #93C5FD;
}
.gs-vehicle-card.selected {
border-color: var(--gs-primary);
background: #F0F7FF;
box-shadow: 0 6px 18px rgba(0, 102, 255, 0.15);
}
.gs-vehicle-badge {
position: absolute;
top: -10px;
left: 50%;
transform: translateX(-50%);
background: #111827;
color: #ffffff;
font-size: 9px;
font-weight: 800;
letter-spacing: 1px;
padding: 3px 10px;
border-radius: 12px;
}
.gs-vehicle-badge.badge-premium {
background: var(--gs-primary);
}
.gs-vehicle-icon {
font-size: 44px;
margin: 6px 0 4px;
}
.gs-vehicle-name {
font-family: var(--gs-font-title);
font-size: 17px;
font-weight: 800;
margin: 0 0 4px;
color: #111827;
}
.gs-vehicle-desc {
font-size: 12px;
color: #6B7280;
margin: 0 0 12px;
}
.gs-vehicle-specs {
display: flex;
justify-content: center;
gap: 10px;
font-size: 11px;
color: #4B5563;
background: #ffffff;
border-radius: 6px;
padding: 8px;
margin-bottom: 14px;
}
.gs-vehicle-price {
font-family: var(--gs-font-title);
font-size: 22px;
font-weight: 800;
color: var(--gs-primary);
margin-bottom: 12px;
}
.gs-card-select-btn {
background: #F3F4F6;
border: 1px solid var(--gs-border);
color: #374151;
font-size: 12px;
font-weight: 700;
padding: 8px;
border-radius: 6px;
cursor: pointer;
margin-top: auto;
transition: all 0.2s;
}
.gs-vehicle-card.selected .gs-card-select-btn {
background: var(--gs-primary);
border-color: var(--gs-primary);
color: #ffffff;
} .gs-pax-luggage-row {
display: flex;
gap: 24px;
margin-bottom: 16px;
}
.gs-counter-group {
display: flex;
align-items: center;
gap: 10px;
}
.gs-counter-group label {
font-size: 13px;
font-weight: 600;
}
.gs-counter {
display: flex;
align-items: center;
border: 1.5px solid var(--gs-border);
border-radius: 8px;
overflow: hidden;
}
.gs-counter button {
background: #F3F4F6;
border: none;
padding: 6px 14px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
transition: background 0.2s;
position: relative;
z-index: 5;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
min-width: 38px;
min-height: 38px;
display: inline-flex;
align-items: center;
justify-content: center;
pointer-events: auto !important;
}
.gs-counter button:hover { background: #E5E7EB; }
.gs-counter button:active { background: #D1D5DB; }
.gs-counter input {
width: 44px;
text-align: center;
border: none !important;
font-weight: 700;
font-size: 15px;
padding: 6px 0 !important;
background: transparent;
-moz-appearance: textfield !important;
appearance: textfield !important;
}
.gs-counter input::-webkit-outer-spin-button,
.gs-counter input::-webkit-inner-spin-button {
-webkit-appearance: none !important;
margin: 0 !important;
display: none !important;
} .gs-counter.gs-counter-exceeded {
border-color: #EF4444 !important;
background: #FEF2F2 !important;
box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.18) !important;
transition: all 0.25s ease;
}
.gs-counter.gs-counter-exceeded input {
color: #DC2626 !important;
}
.gs-capacity-alert {
background: #FFFBEB;
border: 1.5px solid #F59E0B;
border-radius: 12px;
padding: 16px 18px;
margin: 14px 0 18px 0;
box-shadow: 0 4px 16px rgba(245, 158, 11, 0.12);
animation: gsAlertSlideDown 0.28s cubic-bezier(0.16, 1, 0.3, 1) forwards;
width: 100%;
box-sizing: border-box;
}
.gs-cap-alert-header {
display: flex;
align-items: flex-start;
gap: 12px;
}
.gs-cap-alert-icon-wrap {
width: 36px;
height: 36px;
background: #FEF3C7;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
margin-top: 2px;
}
.gs-cap-alert-icon {
font-size: 18px;
line-height: 1;
}
.gs-cap-alert-content {
flex: 1;
}
.gs-cap-alert-title {
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
font-size: 14.5px;
font-weight: 800;
color: #92400E;
margin: 0 0 4px 0;
line-height: 1.25;
}
.gs-cap-alert-msg {
font-family: var(--gs-font-body, 'Inter', sans-serif);
font-size: 13px;
color: #78350F;
line-height: 1.45;
margin: 0;
}
.gs-cap-alert-msg strong {
color: #B45309;
font-weight: 700;
}
.gs-cap-alert-actions {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: center;
margin-top: 14px;
padding-top: 12px;
border-top: 1px dashed rgba(245, 158, 11, 0.35);
}
.gs-btn-cap-upgrade {
background: var(--gs-primary, #0066FF);
color: var(--gs-btn-color, #FFFFFF) !important;
font-family: var(--gs-btn-font, var(--gs-font-title, 'Montserrat', sans-serif));
font-size: 13px;
font-weight: var(--gs-btn-font-weight, 700);
text-transform: var(--gs-btn-transform, none);
padding: 10px 18px;
border-radius: var(--gs-btn-radius, 10px);
border: none;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 7px;
box-shadow: 0 2px 8px rgba(0, 102, 255, 0.25);
transition: all 0.2s ease;
text-decoration: none;
}
.gs-btn-cap-upgrade:hover {
background: var(--gs-primary-hover, #0052cc);
color: #ffffff !important;
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(0, 102, 255, 0.35);
}
.gs-btn-cap-change {
background: #FFFFFF;
color: #374151 !important;
font-family: var(--gs-btn-font, var(--gs-font-title, 'Montserrat', sans-serif));
font-size: 13px;
font-weight: 600;
padding: 10px 16px;
border-radius: var(--gs-btn-radius, 10px);
border: 1.5px solid #D1D5DB;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 7px;
transition: all 0.2s ease;
text-decoration: none;
}
.gs-btn-cap-change:hover {
background: #F9FAFB;
border-color: #9CA3AF;
color: #111827 !important;
}
.gs-btn-cap-icon {
font-size: 14px;
line-height: 1;
}
.gs-shake {
animation: gsShake 0.4s ease-in-out;
}
@keyframes gsShake {
0%, 100% { transform: translateX(0); }
20%, 60% { transform: translateX(-6px); }
40%, 80% { transform: translateX(6px); }
}
@keyframes gsAlertSlideDown {
from {
opacity: 0;
transform: translateY(-8px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@media (max-width: 640px) {
.gs-cap-alert-actions {
flex-direction: column;
align-items: stretch;
}
.gs-btn-cap-upgrade,
.gs-btn-cap-change {
width: 100%;
justify-content: center;
text-align: center;
}
}
.gs-extras-row {
margin-top: 14px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 12px 16px;
background: #F9FAFB;
border-radius: 8px;
}
.gs-checkbox-label {
display: flex;
align-items: center;
gap: 8px;
font-size: 13px;
cursor: pointer;
}
.gs-counter-extra {
display: flex;
align-items: center;
gap: 10px;
font-size: 13px;
} .gs-payment-methods {
display: flex;
flex-direction: column;
gap: 10px;
margin-top: 14px;
}
.gs-payment-option {
display: flex;
align-items: flex-start;
gap: 12px;
padding: 14px 16px;
border: 1.5px solid var(--gs-border);
border-radius: 8px;
cursor: pointer;
transition: all 0.2s;
}
.gs-payment-option:hover {
border-color: #CBD5E1;
}
.gs-payment-option.selected {
border-color: var(--gs-primary);
background: #F0F7FF;
}
.gs-payment-option input {
margin-top: 3px;
}
.gs-pay-info {
flex: 1;
min-width: 0;
}
.gs-pay-head-row {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 2px;
}
.gs-pay-title {
display: block;
font-weight: 700;
font-size: 14px;
color: #111827;
}
.gs-pay-sub {
font-size: 12px;
color: #6B7280;
line-height: 1.4;
} .gs-viva-methods-badge {
height: 32px;
width: auto;
max-width: 175px;
object-fit: contain;
border-radius: 6px;
box-shadow: 0 1px 3px rgba(0,0,0,0.06);
background: #FFFFFF;
padding: 3px 6px;
border: 1px solid #E2E8F0;
flex-shrink: 0;
transition: transform 0.15s ease;
}
.gs-viva-methods-badge:hover {
transform: translateY(-1px);
}
.gs-viva-trust-box {
margin: 14px 0 18px;
padding: 14px 16px;
background: #FFFFFF;
border: 1.5px solid #E2E8F0;
border-radius: 10px;
box-shadow: 0 2px 5px rgba(0,0,0,0.03);
}
.gs-viva-trust-header {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 12px;
padding-bottom: 10px;
margin-bottom: 10px;
border-bottom: 1px solid #F1F5F9;
}
.gs-viva-trust-brand {
display: flex;
align-items: center;
gap: 10px;
}
.gs-viva-official-logo-img {
height: 30px;
width: auto;
display: block;
object-fit: contain;
}
.gs-viva-trust-gateway {
font-size: 11px;
font-weight: 800;
color: #0050FF;
background: #EFF6FF;
border: 1px solid #BFDBFE;
padding: 3px 8px;
border-radius: 4px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.gs-viva-trust-pills {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 6px;
}
.gs-trust-pill {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 11px;
font-weight: 600;
color: #047857;
background: #ECFDF5;
border: 1px solid #A7F3D0;
padding: 3px 8px;
border-radius: 4px;
white-space: nowrap;
}
.gs-trust-pill svg {
flex-shrink: 0;
}
.gs-viva-trust-desc {
margin: 0;
font-size: 12px;
line-height: 1.5;
color: #64748B;
} .gs-wizard-nav {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 24px;
padding-top: 18px;
border-top: 1px solid var(--gs-border);
} .gs-step-nav-bar {
display: flex !important;
justify-content: flex-end !important;
align-items: center !important;
margin-top: 24px !important;
padding-top: 18px !important;
border-top: 1px solid #E2E8F0 !important;
width: 100% !important;
box-sizing: border-box !important;
}
.gs-step-nav-actions,
.gs-tf-choice-actions {
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 12px !important;
position: relative !important;
z-index: 16 !important;
} .gs-btn-prev,
.gs-btn-next,
.gs-submit-btn,
.gs-tf-btn-continue,
#gs-back-to-step-1-btn,
#gs-back-to-step-2-btn,
#gs-back-to-step-3-btn,
#gs-go-to-step-3,
#gs-go-to-step-4,
#gs_submit_btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
height: 48px !important;
min-height: 48px !important;
box-sizing: border-box !important;
font-family: var(--gs-btn-font, var(--gs-font-title, 'Montserrat', sans-serif)) !important;
font-size: 14px !important;
border-radius: 10px !important;
text-transform: none !important;
white-space: nowrap !important;
cursor: pointer !important;
pointer-events: auto !important;
text-decoration: none !important;
transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
} .gs-btn-prev,
#gs-back-to-step-1-btn,
#gs-back-to-step-2-btn,
#gs-back-to-step-3-btn {
background: #F1F5F9 !important;
color: #334155 !important;
border: 1.5px solid #CBD5E1 !important;
padding: 0 22px !important;
font-weight: 600 !important;
letter-spacing: 0.2px !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}
.gs-btn-prev:hover,
#gs-back-to-step-1-btn:hover,
#gs-back-to-step-2-btn:hover,
#gs-back-to-step-3-btn:hover {
background: #E2E8F0 !important;
color: #0F172A !important;
border-color: #94A3B8 !important;
transform: translateY(-1px) !important;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08) !important;
} .gs-btn-next,
.gs-submit-btn,
.gs-tf-btn-continue,
#gs-go-to-step-3,
#gs-go-to-step-4,
#gs_submit_btn {
background: var(--gs-btn-bg, #0A0D12) !important;
color: var(--gs-btn-color, #FFFFFF) !important;
border: 1.5px solid transparent !important;
padding: 0 26px !important;
font-weight: 700 !important;
letter-spacing: 0.3px !important;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
}
.gs-btn-next:hover,
.gs-submit-btn:hover,
.gs-tf-btn-continue:hover,
#gs-go-to-step-3:hover,
#gs-go-to-step-4:hover,
#gs_submit_btn:hover {
background: var(--gs-btn-bg-hover, #1E293B) !important;
color: var(--gs-btn-color-hover, #FFFFFF) !important;
transform: translateY(-1px) !important;
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25) !important;
} .gs-summary-bar {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 24px;
margin-top: 20px;
border-top: 1px solid var(--gs-border);
}
.gs-summary-label {
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
color: #6B7280;
letter-spacing: 0.5px;
}
.gs-summary-amount {
font-family: var(--gs-font-title);
font-size: 28px;
font-weight: 800;
color: var(--gs-primary);
}
.gs-summary-deposit-note {
font-size: 12px;
color: #059669;
font-weight: 600;
}
.gs-total-cost-header {
display: flex;
align-items: baseline;
gap: 10px;
}
.gs-payment-split-wrap {
display: flex;
align-items: center;
gap: 8px;
margin-top: 6px;
flex-wrap: wrap;
}
.gs-split-pill {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 4px 10px;
border-radius: 6px;
font-size: 12.5px;
font-weight: 500;
transition: all 0.2s ease;
}
.gs-split-pill .gs-split-tag {
font-size: 11.5px;
opacity: 0.85;
}
.gs-split-pill strong {
font-weight: 700;
}
.gs-split-now {
background: #F1F5F9;
color: #475569;
border: 1px solid #E2E8F0;
}
.gs-split-now.gs-split-highlight {
background: #EFF6FF;
color: #1D4ED8;
border-color: #BFDBFE;
}
.gs-split-driver {
background: #F8FAFC;
color: #475569;
border: 1px solid #E2E8F0;
}
.gs-split-driver.gs-split-highlight {
background: #FEF3C7;
color: #92400E;
border-color: #FDE68A;
}
.gs-split-subtext {
font-size: 11.5px;
color: #64748B;
margin-top: 5px;
font-weight: 500;
} .gs-blacklane-search-container {
font-family: var(--gs-font-body);
max-width: 1140px;
margin: 30px auto;
position: relative;
z-index: 20 !important;
overflow: visible !important;
}
.gs-blacklane-search-container.gs-has-open-dropdown,
.gs-blacklane-search-container:focus-within {
z-index: 30 !important;
} .gs-bl-capsule-tabs {
display: inline-flex;
background: #ffffff;
border-radius: 50px;
padding: 4px;
margin-bottom: 12px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
border: 1px solid #E5E7EB;
}
.gs-bl-tab {
background: transparent;
border: none;
border-radius: 50px;
padding: 10px 22px;
font-family: var(--gs-font-title);
font-size: 13px;
font-weight: 700;
color: #4B5563;
text-decoration: none !important;
text-transform: none !important;
letter-spacing: normal !important;
line-height: 1.2 !important;
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
transition: all 0.2s ease;
}
.gs-bl-tab:hover {
color: #111827;
}
.gs-bl-tab.active {
background: #0A0D12;
color: #ffffff;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
.gs-bl-tab-icon {
font-size: 15px;
} .gs-bl-search-bar {
display: flex;
align-items: center;
background: #ffffff;
border-radius: 20px;
padding: 8px 10px 8px 18px;
box-shadow: 0 10px 35px rgba(0, 0, 0, 0.08);
border: 1px solid #E5E7EB;
transition: box-shadow 0.25s ease;
position: relative;
z-index: 20 !important;
overflow: visible !important;
}
.gs-bl-search-bar:focus-within {
box-shadow: 0 12px 40px rgba(0, 102, 255, 0.12);
border-color: #BFDBFE;
z-index: 25 !important;
} .gs-bl-col {
display: flex;
align-items: center;
gap: 10px;
padding: 6px 12px;
position: relative;
}
.gs-bl-col-from { flex: 2.2; }
.gs-bl-col-to { flex: 2.2; }
.gs-bl-col-datetime { flex: 2; }
.gs-bl-col-return { flex: 1.3; }
.gs-bl-col-pax { flex: 1.1; }
.gs-bl-col-btn { flex-shrink: 0; }
.gs-bl-col-icon {
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.gs-bl-icon-img {
width: 18px;
height: 24px;
object-fit: contain;
display: block;
flex-shrink: 0;
}
.gs-bl-icon-svg {
width: 20px;
height: 24px;
display: block;
flex-shrink: 0;
}
.gs-bl-col-content {
display: flex;
flex-direction: column;
width: 100%;
}
.gs-bl-label {
font-size: 11px;
font-weight: 600;
color: #9CA3AF;
margin-bottom: 2px;
letter-spacing: 0.3px;
}
.gs-bl-col-content input,
.gs-bl-col-content select {
border: none !important;
outline: none !important;
background: transparent !important;
padding: 0 !important;
margin: 0 !important;
font-family: var(--gs-font-body);
font-size: 14px;
font-weight: 600;
color: #111827;
width: 100%;
box-shadow: none !important;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.gs-bl-col-content input::placeholder,
.gs-bl-col-content input::-webkit-input-placeholder {
color: #9CA3AF !important;
font-weight: 400 !important;
opacity: 1 !important;
} input::-webkit-calendar-picker-indicator,
input::-webkit-inner-spin-button,
input::-webkit-clear-button {
display: none !important;
-webkit-appearance: none !important;
} .gs-bl-divider {
width: 1px;
height: 38px;
background: #E5E7EB;
flex-shrink: 0;
} .gs-bl-quick-dropdown select {
border: none;
background: #F3F4F6;
border-radius: 6px;
padding: 4px 6px;
font-size: 11px;
color: #4B5563;
font-weight: 600;
cursor: pointer;
max-width: 110px;
} .gs-bl-inputs-inline {
display: flex;
align-items: center;
gap: 4px;
}
.gs-bl-inputs-inline input {
border: none !important;
outline: none !important;
background: transparent !important;
font-family: var(--gs-font-body);
font-size: 13px;
font-weight: 600;
color: #111827;
padding: 0 !important;
cursor: pointer;
}
.gs-bl-dot {
color: #9CA3AF;
font-weight: bold;
} .gs-bl-col-return {
flex: 1.3;
transition: flex 0.2s ease;
}
.gs-bl-col-return.active-return {
flex: 2 !important;
}
.gs-bl-col-return:not(.active-return) {
cursor: pointer;
user-select: none;
-webkit-tap-highlight-color: transparent;
}
.gs-bl-col-return:not(.active-return):hover {
background: #F3F4F6;
border-color: #D1D5DB;
}
.gs-bl-col-return:not(.active-return) .gs-bl-return-btn {
width: 100%;
height: 100%;
min-height: 38px;
}
.gs-bl-return-btn {
background: transparent;
border: none;
color: #6B7280;
font-family: var(--gs-font-body);
font-size: 13px;
font-weight: 600;
cursor: pointer;
display: flex;
align-items: center;
gap: 6px;
padding: 6px 8px;
border-radius: 6px;
transition: all 0.2s;
white-space: nowrap;
}
.gs-bl-return-btn:hover {
color: #111827;
background: transparent;
}
.gs-bl-plus-icon {
font-size: 16px;
color: #9CA3AF;
}
.gs-bl-return-active-wrap {
display: flex;
align-items: center;
gap: 10px;
width: 100%;
}
.gs-bl-return-clear-btn {
background: transparent;
border: none;
color: #9CA3AF;
font-size: 18px;
line-height: 1;
cursor: pointer;
padding: 2px 6px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
transition: all 0.15s ease;
margin-left: auto;
flex-shrink: 0;
}
.gs-bl-return-clear-btn:hover {
color: #EF4444;
background: rgba(239, 68, 68, 0.12);
}
.gs-bl-return-inputs {
display: flex;
gap: 4px;
}
.gs-bl-return-inputs input {
border: none;
background: transparent;
font-size: 12px;
font-weight: 600;
padding: 0;
} .gs-bl-counter {
display: flex;
align-items: center;
gap: 8px;
margin-top: 2px;
}
.gs-bl-cnt-btn {
width: 24px;
height: 24px;
border-radius: 50%;
border: 1.5px solid #D1D5DB;
background: #ffffff;
color: #374151;
font-size: 14px;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.2s;
padding: 0;
}
.gs-bl-cnt-btn:hover {
border-color: #111827;
color: #111827;
background: #F9FAFB;
}
.gs-bl-cnt-val {
font-family: var(--gs-font-title);
font-size: 14px;
font-weight: 700;
min-width: 14px;
text-align: center;
} .gs-bl-submit-btn {
background: var(--gs-btn-bg, #0A0D12) !important;
color: var(--gs-btn-color, #ffffff) !important;
border: none !important;
border-radius: var(--gs-btn-radius, 6px) !important;
padding: 16px 28px !important;
font-family: var(--gs-btn-font, var(--gs-font-title)) !important;
font-size: 14.5px !important;
font-weight: var(--gs-btn-font-weight, 700) !important;
text-transform: var(--gs-btn-transform, none) !important;
letter-spacing: var(--gs-btn-letter-spacing, 0.3px) !important;
cursor: pointer !important;
display: flex !important;
align-items: center !important;
gap: 8px !important;
white-space: nowrap !important;
transition: all 0.2s ease !important;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
}
.gs-bl-submit-btn:hover {
background: var(--gs-btn-bg-hover, #121721) !important;
color: var(--gs-btn-color-hover, #0066FF) !important;
transform: translateY(-2px) !important;
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25) !important;
}
.gs-bl-arrow {
font-size: 16px;
transition: transform 0.2s;
}
.gs-bl-submit-btn:hover .gs-bl-arrow {
transform: translateX(3px);
} .gs-bl-trust-bar {
display: flex;
align-items: center;
justify-content: center;
gap: 14px;
margin-top: 14px;
font-size: 13px;
font-weight: 500;
color: #64748B;
text-align: center;
line-height: 1.4;
}
.gs-bl-trust-bar span {
display: inline-flex;
align-items: center;
}
.gs-bl-trust-bar .gs-trust-sep {
opacity: 0.5;
font-size: 10px;
} .flatpickr-calendar {
font-family: var(--gs-font-body, 'Inter', sans-serif) !important;
background: #ffffff !important;
width: 326px !important;
max-width: calc(100vw - 20px) !important;
border-radius: 20px !important;
border: 1px solid #E2E8F0 !important;
box-shadow: 0 20px 45px -10px rgba(15, 23, 42, 0.22), 0 0 1px rgba(15, 23, 42, 0.15) !important;
padding: 14px !important;
box-sizing: border-box !important;
z-index: 999999 !important;
overflow: visible !important;
touch-action: manipulation !important;
}
.flatpickr-calendar::before,
.flatpickr-calendar::after {
display: none !important;
} .flatpickr-months {
position: relative !important;
background: #0A0D12 !important;
background: linear-gradient(135deg, #0A0D12 0%, #161F30 100%) !important;
border-radius: 14px !important;
padding: 8px 46px !important;
margin-bottom: 12px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
min-height: 48px !important;
box-sizing: border-box !important;
}
.flatpickr-month {
display: flex !important;
align-items: center !important;
justify-content: center !important;
height: auto !important;
overflow: visible !important;
color: #ffffff !important;
fill: #ffffff !important;
}
.flatpickr-current-month {
position: static !important;
width: auto !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
padding: 0 !important;
line-height: 1 !important;
font-family: var(--gs-font-title, 'Montserrat', sans-serif) !important;
font-size: 15px !important;
font-weight: 700 !important;
color: #ffffff !important;
}
.flatpickr-current-month select.flatpickr-monthDropdown-months {
background: rgba(255, 255, 255, 0.12) !important;
border: 1px solid rgba(255, 255, 255, 0.22) !important;
border-radius: 8px !important;
box-sizing: border-box !important;
color: #ffffff !important;
cursor: pointer !important;
font-size: 14px !important;
font-family: var(--gs-font-title, 'Montserrat', sans-serif) !important;
font-weight: 700 !important;
height: 32px !important;
line-height: 32px !important;
margin: 0 !important;
outline: none !important;
padding: 0 8px !important;
position: relative !important;
vertical-align: middle !important;
transition: all 0.15s ease !important;
}
.flatpickr-current-month select.flatpickr-monthDropdown-months:hover {
background: rgba(255, 255, 255, 0.22) !important;
border-color: #0066FF !important;
}
.flatpickr-current-month select.flatpickr-monthDropdown-months option {
background-color: #0A0D12 !important;
color: #ffffff !important;
padding: 6px !important;
} .flatpickr-current-month .numInputWrapper {
width: 74px !important;
height: 32px !important;
background: rgba(255, 255, 255, 0.12) !important;
border: 1px solid rgba(255, 255, 255, 0.22) !important;
border-radius: 8px !important;
display: inline-flex !important;
align-items: center !important;
position: relative !important;
box-sizing: border-box !important;
padding-right: 20px !important;
transition: all 0.15s ease !important;
}
.flatpickr-current-month .numInputWrapper:hover,
.flatpickr-current-month .numInputWrapper:focus-within {
background: rgba(255, 255, 255, 0.2) !important;
border-color: #0066FF !important;
}
.flatpickr-current-month .numInputWrapper input.cur-year {
background: transparent !important;
border: none !important;
border-radius: 6px !important;
box-sizing: border-box !important;
color: #ffffff !important;
cursor: pointer !important;
display: block !important;
font-family: var(--gs-font-title, 'Montserrat', sans-serif) !important;
font-size: 14px !important;
font-weight: 700 !important;
height: 100% !important;
line-height: 30px !important;
margin: 0 !important;
outline: none !important;
padding: 0 4px !important;
text-align: center !important;
width: 100% !important;
vertical-align: middle !important;
} .flatpickr-current-month .numInputWrapper span {
position: absolute !important;
right: 0 !important;
width: 20px !important;
height: 50% !important;
line-height: 50% !important;
box-sizing: border-box !important;
cursor: pointer !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
opacity: 0.85 !important;
transition: all 0.15s ease !important;
}
.flatpickr-current-month .numInputWrapper span:hover {
opacity: 1 !important;
background: rgba(255, 255, 255, 0.25) !important;
}
.flatpickr-current-month .numInputWrapper span.arrowUp {
top: 0 !important;
border-top-right-radius: 7px !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}
.flatpickr-current-month .numInputWrapper span.arrowDown {
bottom: 0 !important;
border-bottom-right-radius: 7px !important;
}
.flatpickr-current-month .numInputWrapper span.arrowUp::after {
content: "" !important;
display: block !important;
width: 0 !important;
height: 0 !important;
border-bottom: 4px solid #ffffff !important;
border-left: 3.5px solid transparent !important;
border-right: 3.5px solid transparent !important;
margin: 0 auto !important;
}
.flatpickr-current-month .numInputWrapper span.arrowDown::after {
content: "" !important;
display: block !important;
width: 0 !important;
height: 0 !important;
border-top: 4px solid #ffffff !important;
border-left: 3.5px solid transparent !important;
border-right: 3.5px solid transparent !important;
margin: 0 auto !important;
} .flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
position: absolute !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 32px !important;
height: 32px !important;
padding: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 8px !important;
cursor: pointer !important;
transition: all 0.15s ease !important;
color: #FFFFFF !important;
fill: #FFFFFF !important;
z-index: 10 !important;
}
.flatpickr-months .flatpickr-prev-month {
left: 8px !important;
}
.flatpickr-months .flatpickr-next-month {
right: 8px !important;
}
.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
background: rgba(255, 255, 255, 0.2) !important;
transform: translateY(-50%) scale(1.08) !important;
}
.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
width: 14px !important;
height: 14px !important;
fill: #FFFFFF !important;
stroke: #FFFFFF !important;
vertical-align: middle !important;
} .flatpickr-innerContainer {
width: 100% !important;
box-sizing: border-box !important;
overflow: visible !important;
}
.flatpickr-rContainer {
width: 100% !important;
box-sizing: border-box !important;
}
.flatpickr-weekdays {
width: 100% !important;
display: flex !important;
margin-bottom: 8px !important;
padding: 0 0 6px 0 !important;
border-bottom: 1px solid #F1F5F9 !important;
}
.flatpickr-weekdaycontainer {
width: 100% !important;
display: flex !important;
flex: 1 1 100% !important;
}
span.flatpickr-weekday {
flex: 0 0 14.2857143% !important;
width: 14.2857143% !important;
max-width: 14.2857143% !important;
font-family: var(--gs-font-title, 'Montserrat', sans-serif) !important;
font-size: 11px !important;
font-weight: 700 !important;
color: #94A3B8 !important;
text-transform: uppercase !important;
text-align: center !important;
letter-spacing: 0.5px !important;
box-sizing: border-box !important;
margin: 0 !important;
padding: 0 !important;
} .flatpickr-days {
width: 100% !important;
box-sizing: border-box !important;
}
.dayContainer {
width: 100% !important;
min-width: 100% !important;
max-width: 100% !important;
display: flex !important;
flex-wrap: wrap !important;
justify-content: flex-start !important;
padding: 0 !important;
margin: 0 !important;
box-sizing: border-box !important;
}
.flatpickr-day {
flex: 0 0 14.2857143% !important;
width: 14.2857143% !important;
max-width: 14.2857143% !important;
height: 38px !important;
line-height: 34px !important;
border-radius: 10px !important;
font-family: var(--gs-font-body, 'Inter', sans-serif) !important;
font-weight: 600 !important;
font-size: 13.5px !important;
color: #1E293B !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
margin: 2px 0 !important;
box-sizing: border-box !important;
transition: all 0.15s ease !important;
border: 1.5px solid transparent !important;
cursor: pointer !important;
}
.flatpickr-day:hover {
background: #F1F5F9 !important;
color: #0F172A !important;
border-color: #E2E8F0 !important;
transform: scale(1.05) !important;
}
.flatpickr-day.today {
border-color: #0066FF !important;
color: #0066FF !important;
background: #EFF6FF !important;
font-weight: 700 !important;
}
.flatpickr-day.today:hover {
background: #DBEAFE !important;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
background: #0066FF !important;
background: linear-gradient(135deg, #0066FF 0%, #0052CC 100%) !important;
border-color: #0066FF !important;
color: #FFFFFF !important;
font-weight: 700 !important;
border-radius: 10px !important;
box-shadow: 0 4px 14px rgba(0, 102, 255, 0.4) !important;
transform: scale(1.05) !important;
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
color: #CBD5E1 !important;
background: transparent !important;
cursor: not-allowed !important;
opacity: 0.35 !important;
border-color: transparent !important;
transform: none !important;
}
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
color: #CBD5E1 !important;
opacity: 0.4 !important;
} .dayContainer:has(.flatpickr-day:nth-child(36).nextMonthDay) .flatpickr-day:nth-child(n+36),
.dayContainer.gs-hide-week6 .flatpickr-day:nth-child(n+36),
.flatpickr-day.nextMonthDay:nth-child(n+36) {
display: none !important;
} .flatpickr-time {
border-top: 1px solid #E2E8F0 !important;
margin-top: 10px !important;
padding: 10px 14px !important;
background: #F8FAFC !important;
border-radius: 12px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
height: auto !important;
max-height: none !important;
box-sizing: border-box !important;
}
.flatpickr-time::before {
content: "🕒";
font-size: 16px;
margin-right: 4px;
opacity: 0.85;
}
.flatpickr-time .numInputWrapper {
flex: 0 0 auto !important;
width: 58px !important;
height: 40px !important;
background: #FFFFFF !important;
border: 1.5px solid #E2E8F0 !important;
border-radius: 10px !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
display: flex !important;
align-items: center !important;
position: relative !important;
transition: all 0.15s ease !important;
}
.flatpickr-time .numInputWrapper:hover,
.flatpickr-time .numInputWrapper:focus-within {
border-color: #0066FF !important;
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.15) !important;
}
.flatpickr-time input.numInput,
.flatpickr-current-month input.cur-year {
width: 100% !important;
height: 100% !important;
font-family: var(--gs-font-title, 'Montserrat', sans-serif) !important;
font-weight: 800 !important;
font-size: 16px !important;
color: #0F172A !important;
text-align: center !important;
border: none !important;
background: transparent !important;
padding: 0 20px 0 6px !important;
box-sizing: border-box !important;
outline: none !important;
pointer-events: none !important;
-webkit-user-select: none !important;
user-select: none !important;
}
.flatpickr-time .flatpickr-time-separator {
font-family: var(--gs-font-title, 'Montserrat', sans-serif) !important;
font-weight: 800 !important;
font-size: 20px !important;
color: #0066FF !important;
padding: 0 2px !important;
line-height: 1 !important;
user-select: none !important;
} .flatpickr-time .numInputWrapper span.arrowUp,
.flatpickr-time .numInputWrapper span.arrowDown,
.flatpickr-current-month .numInputWrapper span.arrowUp,
.flatpickr-current-month .numInputWrapper span.arrowDown {
width: 22px !important;
height: 50% !important;
padding: 0 !important;
opacity: 0.75 !important;
right: 2px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
cursor: pointer !important;
border-radius: 4px !important;
transition: all 0.1s ease !important;
pointer-events: auto !important;
}
.flatpickr-time .numInputWrapper span.arrowUp:hover,
.flatpickr-time .numInputWrapper span.arrowDown:hover {
opacity: 1 !important;
background: rgba(0, 102, 255, 0.12) !important;
color: #0066FF !important;
}
.flatpickr-time .numInputWrapper span.arrowUp::after {
border-bottom-color: #0F172A !important;
}
.flatpickr-time .numInputWrapper span.arrowDown::after {
border-top-color: #0F172A !important;
} .flatpickr-calendar.hasTime.noCalendar {
width: auto !important;
min-width: 190px !important;
padding: 10px !important;
}
.flatpickr-calendar.hasTime.noCalendar .flatpickr-time {
border-top: none !important;
margin-top: 0 !important;
padding: 8px 12px !important;
} .gs-flatpickr-footer {
width: 100% !important;
padding-top: 10px !important;
margin-top: 10px !important;
border-top: 1px solid #E2E8F0 !important;
display: flex !important;
justify-content: center !important;
box-sizing: border-box !important;
}
.gs-flatpickr-confirm-btn {
width: 100% !important;
height: 40px !important;
background: #0A0D12 !important;
background: linear-gradient(135deg, #0A0D12 0%, #161F30 100%) !important;
color: #ffffff !important;
border: none !important;
border-radius: 10px !important;
font-family: var(--gs-font-title, 'Montserrat', sans-serif) !important;
font-size: 14px !important;
font-weight: 700 !important;
letter-spacing: 0.3px !important;
cursor: pointer !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 6px !important;
box-shadow: 0 4px 12px rgba(10, 13, 18, 0.2) !important;
transition: all 0.2s ease !important;
-webkit-appearance: none !important;
outline: none !important;
}
.gs-flatpickr-confirm-btn:hover,
.gs-flatpickr-confirm-btn:active {
background: #0066FF !important;
background: linear-gradient(135deg, #0066FF 0%, #0052CC 100%) !important;
box-shadow: 0 4px 14px rgba(0, 102, 255, 0.35) !important;
transform: translateY(-1px) !important;
} body.gs-fp-open {
overflow: hidden !important;
}
@keyframes gsFpCenterIn {
from {
opacity: 0;
transform: translate(-50%, -46%) scale(0.96);
}
to {
opacity: 1;
transform: translate(-50%, -50%) scale(1);
}
}
@media (max-width: 768px) {
.flatpickr-calendar {
position: fixed !important;
top: 50% !important;
left: 50% !important;
right: auto !important;
bottom: auto !important;
transform: translate(-50%, -50%) !important;
margin: 0 !important;
width: min(330px, calc(100vw - 28px)) !important;
max-height: calc(100vh - 30px) !important;
overflow-y: auto !important;
z-index: 999999 !important;
box-shadow: 0 25px 60px rgba(0, 0, 0, 0.45), 0 0 0 100vmax rgba(10, 13, 18, 0.6) !important;
}
.flatpickr-calendar.open,
.flatpickr-calendar.animate.open {
animation: gsFpCenterIn 0.22s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}
.flatpickr-calendar::before,
.flatpickr-calendar::after {
display: none !important;
}
} @media (max-width: 480px) {
.flatpickr-calendar {
width: min(308px, calc(100vw - 24px)) !important;
padding: 12px 10px !important;
}
.flatpickr-day {
flex: 0 0 14.2857143% !important;
width: 14.2857143% !important;
max-width: 14.2857143% !important;
height: 34px !important;
line-height: 34px !important;
font-size: 13px !important;
box-sizing: border-box !important;
}
} .gs-bl-flatpickr-input,
.gs-flatpickr-date,
.gs-flatpickr-time {
cursor: pointer !important;
}
.gs-bl-col-datetime .flatpickr-input,
.gs-bl-col-return .flatpickr-input,
.gs-bl-return-active-wrap .flatpickr-input,
.gs-bl-col-content input,
.gs-bl-col-content input.flatpickr-input,
.gs-bl-col-content .form-control,
.gs-bl-col-content input.form-control {
font-family: var(--gs-font-body) !important;
font-size: 14px !important;
font-weight: 600 !important;
color: #111827 !important;
border: none !important;
border-radius: 0 !important;
outline: none !important;
background: transparent !important;
background-color: transparent !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0 !important;
height: auto !important;
min-height: 0 !important;
line-height: normal !important;
cursor: pointer !important;
width: 100% !important;
-webkit-appearance: none !important;
-moz-appearance: none !important;
appearance: none !important;
}
.gs-bl-col-datetime .flatpickr-input::placeholder,
.gs-bl-col-return .flatpickr-input::placeholder,
.gs-bl-return-active-wrap .flatpickr-input::placeholder,
.gs-bl-col-content input::placeholder {
color: #9CA3AF !important;
font-weight: 400 !important;
opacity: 1 !important;
} @media (max-width: 991px) {
.gs-bl-search-bar {
flex-wrap: wrap;
border-radius: 16px;
padding: 14px;
gap: 12px;
}
.gs-bl-divider { display: none; }
.gs-bl-col {
flex: 1 1 45%;
background: #F9FAFB;
border-radius: 10px;
padding: 10px 14px;
border: 1px solid #E5E7EB;
}
.gs-bl-col-btn {
flex: 1 1 100%;
}
.gs-bl-submit-btn {
width: 100%;
justify-content: center;
border-radius: 10px;
}
}
@media (max-width: 600px) {
.gs-bl-col {
flex: 1 1 100%;
}
.gs-bl-trust-bar {
flex-direction: column;
gap: 6px;
}
.gs-bl-trust-bar span:nth-child(even) { display: none; }
} .gs-modal {
display: none;
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
background: rgba(10, 13, 18, 0.7);
backdrop-filter: blur(4px);
z-index: 99999;
align-items: center;
justify-content: center;
padding: 20px;
}
.gs-modal.open {
display: flex;
animation: fadeIn 0.25s ease;
}
.gs-modal-content {
background: #ffffff;
max-width: 480px;
width: 100%;
border-radius: 16px;
padding: 35px 28px;
text-align: center;
box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}
.gs-modal-icon { font-size: 48px; margin-bottom: 12px; }
.gs-modal-title {
font-family: var(--gs-font-title);
font-size: 24px;
font-weight: 800;
line-height: 1.3;
color: #0F172A;
margin: 0 0 10px;
}
.gs-booking-code-box {
background: #EFF6FF;
border: 2px dashed var(--gs-primary);
color: var(--gs-primary);
font-family: var(--gs-font-title);
font-size: 22px;
font-weight: 800;
padding: 12px;
border-radius: 8px;
margin: 16px 0;
letter-spacing: 1px;
}
.gs-modal-actions {
display: flex;
flex-direction: column;
gap: 10px;
margin-top: 20px;
}
.gs-btn-voucher {
background: var(--gs-primary);
color: #ffffff !important;
text-decoration: none;
padding: 14px 20px;
border-radius: 8px;
font-weight: 700;
font-size: 15px;
transition: background 0.2s;
}
.gs-btn-voucher:hover { background: var(--gs-primary-hover); }
.gs-btn-close {
background: #F3F4F6;
color: #4B5563;
border: none;
padding: 12px;
border-radius: 8px;
font-weight: 600;
cursor: pointer;
}  body:has(.getseat-driver-portal-wrapper) header,
body:has(.getseat-driver-portal-wrapper) header.whb-header,
body:has(.getseat-driver-portal-wrapper) .whb-header,
body:has(.getseat-driver-portal-wrapper) .whb-sticky-header,
body:has(.getseat-driver-portal-wrapper) .whb-clone,
body:has(.getseat-driver-portal-wrapper) .whb-main-header,
body:has(.getseat-driver-portal-wrapper) .whb-top-bar,
body:has(.getseat-driver-portal-wrapper) .whb-general-header,
body:has(.getseat-driver-portal-wrapper) .whb-header-bottom,
body:has(.getseat-driver-portal-wrapper) .woodmart-header,
body:has(.getseat-driver-portal-wrapper) .site-header,
body:has(.getseat-driver-portal-wrapper) #masthead,
body:has(.getseat-driver-portal-wrapper) .elementor-location-header,
body:has(.getseat-driver-portal-wrapper) .woodmart-toolbar,
body:has(.getseat-driver-portal-wrapper) .woodmart-sticky-toolbar,
body:has(.getseat-driver-portal-wrapper) .mobile-nav,
body.gs-driver-portal-active header,
body.gs-driver-portal-active header.whb-header,
body.gs-driver-portal-active .whb-header,
body.gs-driver-portal-active .whb-sticky-header,
body.gs-driver-portal-active .whb-clone,
body.gs-driver-portal-active .whb-main-header,
body.gs-driver-portal-active .whb-top-bar,
body.gs-driver-portal-active .whb-general-header,
body.gs-driver-portal-active .whb-header-bottom,
body.gs-driver-portal-active .woodmart-header,
body.gs-driver-portal-active .site-header,
body.gs-driver-portal-active #masthead,
body.gs-driver-portal-active .elementor-location-header,
body.gs-driver-portal-active .woodmart-toolbar,
body.gs-driver-portal-active .woodmart-sticky-toolbar,
body.gs-driver-portal-active .mobile-nav {
display: none !important;
height: 0 !important;
min-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
opacity: 0 !important;
visibility: hidden !important;
}
body:has(.getseat-driver-portal-wrapper) .page-title,
body:has(.getseat-driver-portal-wrapper) .page-heading,
body:has(.getseat-driver-portal-wrapper) .woodmart-page-title,
body:has(.getseat-driver-portal-wrapper) .page-title-default,
body:has(.getseat-driver-portal-wrapper) .title-size-default,
body:has(.getseat-driver-portal-wrapper) .title-design-default,
body:has(.getseat-driver-portal-wrapper) .entry-header,
body:has(.getseat-driver-portal-wrapper) .page-header,
body:has(.getseat-driver-portal-wrapper) h1.entry-title,
body:has(.getseat-driver-portal-wrapper) .woodmart-breadcrumbs,
body.gs-driver-portal-active .page-title,
body.gs-driver-portal-active .page-heading,
body.gs-driver-portal-active .woodmart-page-title,
body.gs-driver-portal-active .page-title-default,
body.gs-driver-portal-active .title-size-default,
body.gs-driver-portal-active .title-design-default,
body.gs-driver-portal-active .entry-header,
body.gs-driver-portal-active .page-header,
body.gs-driver-portal-active h1.entry-title,
body.gs-driver-portal-active .woodmart-breadcrumbs {
display: none !important;
height: 0 !important;
min-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
opacity: 0 !important;
visibility: hidden !important;
}
body:has(.getseat-driver-portal-wrapper) footer,
body:has(.getseat-driver-portal-wrapper) footer.footer-container,
body:has(.getseat-driver-portal-wrapper) .footer-container,
body:has(.getseat-driver-portal-wrapper) .woodmart-footer,
body:has(.getseat-driver-portal-wrapper) .site-footer,
body:has(.getseat-driver-portal-wrapper) #colophon,
body:has(.getseat-driver-portal-wrapper) .footer-sidebar,
body:has(.getseat-driver-portal-wrapper) .copyrights-wrapper,
body:has(.getseat-driver-portal-wrapper) .elementor-location-footer,
body.gs-driver-portal-active footer,
body.gs-driver-portal-active footer.footer-container,
body.gs-driver-portal-active .footer-container,
body.gs-driver-portal-active .woodmart-footer,
body.gs-driver-portal-active .site-footer,
body.gs-driver-portal-active #colophon,
body.gs-driver-portal-active .footer-sidebar,
body.gs-driver-portal-active .copyrights-wrapper,
body.gs-driver-portal-active .elementor-location-footer {
display: none !important;
height: 0 !important;
min-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
opacity: 0 !important;
visibility: hidden !important;
}
body:has(.getseat-driver-portal-wrapper),
body.gs-driver-portal-active {
background: #0F172A !important;
}
body:has(.getseat-driver-portal-wrapper) .main-page-wrapper,
body.gs-driver-portal-active .main-page-wrapper,
body:has(.getseat-driver-portal-wrapper) .site-content,
body.gs-driver-portal-active .site-content {
padding-top: 15px !important;
padding-bottom: 25px !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
background: transparent !important;
}
body:has(.getseat-driver-portal-wrapper) .container,
body.gs-driver-portal-active .container {
max-width: 100% !important;
width: 100% !important;
padding-left: 10px !important;
padding-right: 10px !important;
}
.getseat-driver-portal-wrapper {
font-family: var(--gs-font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
color: #1F2937;
max-width: 920px;
margin: 24px auto;
background: #F8FAFC;
border-radius: 18px;
box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08), 0 4px 12px rgba(0, 0, 0, 0.04);
border: 1px solid #E2E8F0;
overflow: hidden;
} .gs-driver-login-box {
padding: 40px 20px;
display: flex;
justify-content: center;
align-items: center;
min-height: 480px;
background: linear-gradient(180deg, #F8FAFC 0%, #EDF2F7 100%);
}
.gs-portal-login-card {
background: #ffffff;
max-width: 420px;
width: 100%;
padding: 36px 30px;
border-radius: 18px;
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
border: 1px solid #E2E8F0;
}
.gs-portal-brand {
text-align: center;
margin-bottom: 24px;
}
.gs-brand-icon {
width: 54px;
height: 54px;
background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
color: #ffffff;
border-radius: 14px;
display: inline-flex;
align-items: center;
justify-content: center;
margin-bottom: 12px;
box-shadow: 0 6px 16px rgba(15, 23, 42, 0.2);
}
.gs-portal-brand h2 {
margin: 0;
font-family: var(--gs-font-title, sans-serif);
font-size: 22px;
font-weight: 800;
color: #0F172A;
}
.gs-brand-sub {
margin: 4px 0 0;
font-size: 11px;
font-weight: 800;
color: var(--gs-primary, #0066FF);
letter-spacing: 2.5px;
text-transform: uppercase;
}
.gs-input-with-icon {
position: relative;
display: flex;
align-items: center;
}
.gs-input-with-icon svg {
position: absolute;
left: 14px;
color: #94A3B8;
pointer-events: none;
}
.gs-input-with-icon input {
width: 100%;
padding: 12px 14px 12px 42px !important;
border: 1.5px solid #CBD5E1 !important;
border-radius: 10px !important;
font-size: 14px !important;
background: #F8FAFC !important;
transition: all 0.2s ease !important;
box-sizing: border-box !important;
}
.gs-input-with-icon input:focus {
border-color: var(--gs-primary, #0066FF) !important;
background: #ffffff !important;
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.15) !important;
outline: none !important;
}
.gs-portal-login-btn {
width: 100%;
margin-top: 18px;
background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
color: #ffffff !important;
border: none;
padding: 14px 20px;
border-radius: 10px;
font-size: 15px;
font-weight: 700;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
transition: all 0.2s;
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.25);
}
.gs-portal-login-btn:hover {
background: linear-gradient(135deg, #1E293B 0%, #334155 100%);
transform: translateY(-1px);
box-shadow: 0 6px 16px rgba(15, 23, 42, 0.35);
}
.gs-portal-login-footer {
margin-top: 20px;
padding-top: 16px;
border-top: 1px solid #F1F5F9;
display: flex;
align-items: flex-start;
gap: 8px;
font-size: 12px;
color: #64748B;
line-height: 1.4;
}
.gs-portal-login-footer svg {
flex-shrink: 0;
margin-top: 2px;
color: #94A3B8;
} .gs-portal-header-premium {
background: #FFFFFF;
padding: 22px 28px;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #E2E8F0;
flex-wrap: wrap;
gap: 16px;
}
.gs-driver-profile-info {
display: flex;
align-items: center;
gap: 16px;
}
.gs-driver-avatar-ring {
width: 48px;
height: 48px;
border-radius: 50%;
background: #EFF6FF;
color: var(--gs-primary, #0066FF);
display: flex;
align-items: center;
justify-content: center;
font-size: 19px;
font-weight: 800;
border: 1.5px solid #BFDBFE;
position: relative;
box-shadow: 0 2px 8px rgba(0, 102, 255, 0.12);
flex-shrink: 0;
}
.gs-online-indicator {
position: absolute;
bottom: 1px;
right: 1px;
width: 11px;
height: 11px;
background: #10B981;
border: 2px solid #FFFFFF;
border-radius: 50%;
box-shadow: 0 0 0 1.5px rgba(16, 185, 129, 0.3);
}
.gs-driver-meta-text {
color: #0F172A;
}
.gs-driver-greeting {
font-size: 11px;
text-transform: uppercase;
color: #64748B;
letter-spacing: 0.8px;
font-weight: 700;
}
.gs-driver-name {
margin: 2px 0 4px;
font-size: 20px;
font-weight: 800;
color: #0F172A;
font-family: var(--gs-font-title, sans-serif);
line-height: 1.2;
}
.gs-driver-vehicle-row {
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap;
}
.gs-v-model {
font-size: 12.5px;
color: #475569;
font-weight: 600;
display: flex;
align-items: center;
gap: 4px;
}
.gs-v-plate {
background: #F1F5F9;
border: 1px solid #CBD5E1;
color: #0F172A;
font-size: 11px;
font-weight: 800;
padding: 2px 7px;
border-radius: 5px;
letter-spacing: 0.6px;
}
.gs-header-actions-group {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 10px;
}
.gs-header-date-badge {
display: flex;
align-items: center;
gap: 6px;
font-size: 12px;
color: #64748B;
font-weight: 600;
background: #F8FAFC;
border: 1px solid #E2E8F0;
border-radius: 20px;
padding: 4px 12px;
}
.gs-header-buttons-row {
display: flex;
align-items: center;
gap: 8px;
}
.gs-btn-header-refresh {
background: #F8FAFC;
color: #334155 !important;
text-decoration: none;
font-size: 12px;
font-weight: 700;
padding: 7px 13px;
border-radius: 8px;
display: flex;
align-items: center;
gap: 6px;
border: 1px solid #CBD5E1;
transition: all 0.2s;
}
.gs-btn-header-refresh:hover {
background: #F1F5F9;
color: var(--gs-primary, #0066FF) !important;
border-color: #94A3B8;
}
.gs-btn-header-logout {
background: #FEF2F2;
color: #DC2626 !important;
text-decoration: none;
font-size: 12px;
font-weight: 700;
padding: 7px 13px;
border-radius: 8px;
display: flex;
align-items: center;
gap: 6px;
border: 1px solid #FEE2E2;
transition: all 0.2s;
}
.gs-btn-header-logout:hover {
background: #DC2626;
color: #ffffff !important;
border-color: #DC2626;
} .gs-driver-tabs-container {
display: grid;
grid-auto-flow: column;
grid-auto-columns: 1fr;
background: #F8FAFC;
padding: 6px 8px;
gap: 6px;
border-bottom: 1px solid #E2E8F0;
}
.gs-dtab-btn {
background: transparent;
border: 1px solid transparent;
padding: 10px 14px;
border-radius: 8px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
transition: all 0.2s ease;
color: #64748B;
}
.gs-dtab-btn:hover {
background: #FFFFFF;
color: #0F172A;
border-color: #E2E8F0;
}
.gs-dtab-btn.active {
background: #FFFFFF;
color: var(--gs-primary, #0066FF);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
border-color: #E2E8F0;
font-weight: 800;
}
.gs-dtab-btn:hover {
background: rgba(255, 255, 255, 0.6);
color: #1E293B;
}
.gs-dtab-btn.active {
background: #ffffff;
color: var(--gs-primary, #0066FF);
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
font-weight: 800;
}
.gs-tab-title-wrap {
display: flex;
align-items: center;
gap: 6px;
font-size: 13.5px;
font-weight: 700;
}
.gs-tab-count {
background: #CBD5E1;
color: #334155;
font-size: 11px;
font-weight: 800;
padding: 2px 8px;
border-radius: 12px;
min-width: 18px;
text-align: center;
}
.gs-tab-count.has-rides {
background: var(--gs-primary, #0066FF);
color: #ffffff;
box-shadow: 0 2px 6px rgba(0, 102, 255, 0.35);
}
.gs-tab-pending-badge.has-pending {
background: #DC2626 !important;
color: #ffffff !important;
box-shadow: 0 0 8px rgba(220, 38, 38, 0.5) !important;
animation: gsPulseBadge 2s infinite ease-in-out;
}
@keyframes gsPulseBadge {
0%, 100% { transform: scale(1); }
50% { transform: scale(1.12); }
}
@media (max-width: 640px) {
.gs-driver-tabs-container {
display: flex;
flex-wrap: wrap;
padding: 4px;
gap: 4px;
}
.gs-dtab-btn {
flex: 1 1 calc(33.333% - 4px);
min-width: 85px;
padding: 8px 4px;
flex-direction: column;
gap: 4px;
justify-content: center;
text-align: center;
}
.gs-tab-title-wrap {
font-size: 11px;
gap: 3px;
justify-content: center;
}
.gs-tab-title-wrap svg {
width: 14px;
height: 14px;
}
.gs-tab-count {
font-size: 10px;
padding: 1px 6px;
}
} .gs-portal-content-body {
padding: 20px 22px;
}
.gs-dtab-content {
display: none;
}
.gs-dtab-content.active {
display: block;
animation: gsFadeIn 0.25s ease-out;
}
@keyframes gsFadeIn {
from { opacity: 0; transform: translateY(4px); }
to { opacity: 1; transform: translateY(0); }
}
.gs-rides-list {
display: flex;
flex-direction: column;
gap: 16px;
} .gs-day-group {
margin-bottom: 24px;
}
.gs-day-group:last-child {
margin-bottom: 0;
}
.gs-day-divider {
display: flex;
align-items: center;
justify-content: space-between;
background: #FFFFFF;
border: 1px solid #CBD5E1;
border-left: 4.5px solid #0066FF;
border-radius: 12px;
padding: 11px 16px;
margin-bottom: 14px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.gs-day-divider.is-today {
border-left-color: #10B981;
background: linear-gradient(90deg, #F0FDF4 0%, #FFFFFF 65%);
border-color: #A7F3D0;
}
.gs-day-divider.is-tomorrow {
border-left-color: #0284C7;
background: linear-gradient(90deg, #F0F9FF 0%, #FFFFFF 65%);
border-color: #BAE6FD;
}
.gs-day-divider-left {
display: flex;
align-items: center;
gap: 12px;
min-width: 0;
}
.gs-day-divider-icon {
width: 32px;
height: 32px;
border-radius: 8px;
background: #EFF6FF;
color: #0284C7;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.gs-day-divider.is-today .gs-day-divider-icon {
background: #DCFCE7;
color: #16A34A;
}
.gs-day-divider.is-tomorrow .gs-day-divider-icon {
background: #E0F2FE;
color: #0284C7;
}
.gs-day-date-group {
display: flex;
flex-direction: column;
min-width: 0;
}
.gs-day-date-title {
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap;
}
.gs-day-badge {
font-size: 10px;
font-weight: 900;
padding: 2.5px 7px;
border-radius: 5px;
letter-spacing: 0.5px;
text-transform: uppercase;
display: inline-block;
}
.gs-day-badge.today {
background: #10B981;
color: #FFFFFF;
}
.gs-day-badge.tomorrow {
background: #0284C7;
color: #FFFFFF;
}
.gs-day-date-text {
font-size: 14px;
font-weight: 800;
color: #0F172A;
}
.gs-day-count-badge {
background: #F1F5F9;
border: 1px solid #CBD5E1;
color: #475569;
font-size: 12px;
font-weight: 700;
padding: 4px 10px;
border-radius: 20px;
white-space: nowrap;
flex-shrink: 0;
}
.gs-day-divider.is-today .gs-day-count-badge {
background: #DCFCE7;
border-color: #86EFAC;
color: #15803D;
}
.gs-day-divider.is-tomorrow .gs-day-count-badge {
background: #E0F2FE;
border-color: #7DD3FC;
color: #0369A1;
}
.gs-rides-day-list {
margin-bottom: 20px;
} .gs-empty-state-card {
text-align: center;
padding: 50px 20px;
background: #ffffff;
border-radius: 16px;
border: 1px dashed #CBD5E1;
}
.gs-empty-icon-circle {
width: 64px;
height: 64px;
border-radius: 50%;
background: #F1F5F9;
color: #94A3B8;
display: inline-flex;
align-items: center;
justify-content: center;
margin-bottom: 16px;
}
.gs-empty-state-card h3 {
margin: 0 0 6px;
font-size: 17px;
font-weight: 700;
color: #1E293B;
}
.gs-empty-state-card p {
margin: 0;
font-size: 13px;
color: #64748B;
max-width: 360px;
margin: 0 auto;
line-height: 1.5;
} .gs-driver-ride-card {
background: #ffffff;
border: 1.5px solid #E2E8F0;
border-radius: 16px;
padding: 20px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
transition: all 0.25s ease;
}
.gs-driver-ride-card:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
border-color: #CBD5E1;
}
.gs-driver-ride-card.card-pending-action {
border-color: #F59E0B;
background: #FFFDF9;
box-shadow: 0 4px 20px rgba(245, 158, 11, 0.12);
} .gs-card-top {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 14px;
margin-bottom: 16px;
border-bottom: 1px solid #F1F5F9;
flex-wrap: wrap;
gap: 10px;
}
.gs-time-badge-group {
display: flex;
align-items: center;
gap: 12px;
}
.gs-time-badge {
display: flex;
align-items: center;
gap: 6px;
color: var(--gs-primary, #0066FF);
}
.gs-ride-time {
font-family: var(--gs-font-title, sans-serif);
font-size: 24px;
font-weight: 800;
line-height: 1;
}
.gs-date-label {
display: flex;
align-items: center;
gap: 5px;
font-size: 12px;
font-weight: 600;
color: #64748B;
}
.gs-badge-today {
background: #EFF6FF;
color: #1D4ED8;
border: 1px solid #BFDBFE;
font-size: 10px;
font-weight: 800;
padding: 1px 6px;
border-radius: 4px;
margin-left: 2px;
}
.gs-card-top-tags {
display: flex;
align-items: center;
gap: 6px;
flex-wrap: wrap;
}
.gs-leg-badge {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 11px;
font-weight: 800;
padding: 3px 8px;
border-radius: 6px;
text-transform: uppercase;
}
.gs-leg-badge.leg-outward {
background: #EFF6FF;
color: #1D4ED8;
border: 1px solid #BFDBFE;
}
.gs-leg-badge.leg-return {
background: #ECFDF5;
color: #047857;
border: 1px solid #A7F3D0;
}
.gs-status-tag {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 3px 9px;
border-radius: 20px;
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
}
.gs-status-tag.status-accepted {
background: #DEF7EC;
color: #03543F;
border: 1px solid #BCF0DA;
}
.gs-status-tag.status-assigned {
background: #FEF3C7;
color: #92400E;
border: 1px solid #FDE68A;
}
.gs-status-tag.status-completed {
background: #F1F5F9;
color: #475569;
border: 1px solid #CBD5E1;
}
.gs-status-tag.status-declined {
background: #FDE8E8;
color: #9B1C1C;
border: 1px solid #FBD5D5;
}
.gs-code-tag {
font-size: 11px;
font-weight: 700;
color: #94A3B8;
background: #F1F5F9;
padding: 3px 8px;
border-radius: 6px;
} .gs-pending-action-bar {
background: #FFFBEB;
border: 1.5px solid #F59E0B;
border-radius: 12px;
padding: 12px 16px;
margin-bottom: 16px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 12px;
}
.gs-pending-text {
display: flex;
align-items: center;
gap: 10px;
color: #92400E;
}
.gs-pending-text strong {
display: block;
font-size: 13px;
font-weight: 800;
}
.gs-pending-text span {
font-size: 12px;
color: #B45309;
}
.gs-action-btns {
display: flex;
gap: 8px;
}
.gs-btn-sm-accept {
background: #10B981;
color: #ffffff !important;
text-decoration: none;
padding: 9px 18px;
border-radius: 8px;
font-size: 13px;
font-weight: 800;
display: inline-flex;
align-items: center;
gap: 6px;
box-shadow: 0 2px 8px rgba(16, 185, 129, 0.35);
transition: all 0.2s;
}
.gs-btn-sm-accept:hover {
background: #059669;
transform: translateY(-1px);
}
.gs-btn-sm-decline {
background: #EF4444;
color: #ffffff !important;
text-decoration: none;
padding: 9px 14px;
border-radius: 8px;
font-size: 13px;
font-weight: 800;
display: inline-flex;
align-items: center;
gap: 6px;
transition: all 0.2s;
}
.gs-btn-sm-decline:hover {
background: #DC2626;
transform: translateY(-1px);
} .gs-ride-route-timeline {
position: relative;
padding-left: 20px;
margin-bottom: 16px;
}
.gs-timeline-line {
position: absolute;
left: 6px;
top: 14px;
bottom: 22px;
width: 2px;
background: repeating-linear-gradient(to bottom, #94A3B8 0, #94A3B8 4px, transparent 4px, transparent 8px);
}
.gs-timeline-node {
position: relative;
display: flex;
align-items: flex-start;
gap: 12px;
margin-bottom: 14px;
}
.gs-timeline-node:last-child {
margin-bottom: 0;
}
.gs-node-dot {
position: absolute;
left: -20px;
top: 4px;
width: 14px;
height: 14px;
border-radius: 50%;
background: #ffffff;
box-sizing: border-box;
}
.gs-node-dot.dot-green {
border: 3.5px solid #10B981;
box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2);
}
.gs-node-dot.dot-red {
border: 3.5px solid #EF4444;
box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.2);
}
.gs-node-content {
flex: 1;
}
.gs-node-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 2px;
}
.gs-node-title {
font-size: 10px;
font-weight: 800;
color: #94A3B8;
letter-spacing: 0.8px;
text-transform: uppercase;
}
.gs-mini-gps-btn {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 11px;
font-weight: 700;
color: #0066FF;
background: #EFF6FF;
border: 1px solid #DBEAFE;
padding: 2px 7px;
border-radius: 5px;
text-decoration: none;
transition: all 0.2s;
}
.gs-mini-gps-btn:hover {
background: #0066FF;
color: #ffffff;
}
.gs-node-address {
font-size: 14px;
font-weight: 700;
color: #0F172A;
line-height: 1.35;
} .gs-flight-callout {
background: #FFFBEB;
border: 1px solid #FDE68A;
border-radius: 10px;
padding: 10px 14px;
margin-bottom: 14px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 10px;
}
.gs-flight-left {
display: flex;
align-items: center;
gap: 10px;
}
.gs-flight-icon-box {
width: 32px;
height: 32px;
border-radius: 8px;
background: #FEF3C7;
color: #D97706;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.gs-flight-label {
font-size: 10px;
font-weight: 800;
color: #B45309;
letter-spacing: 0.5px;
display: block;
}
.gs-flight-number {
font-size: 15px;
font-weight: 800;
color: #92400E;
}
.gs-flight-check-btn {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 11px;
font-weight: 700;
color: #92400E;
background: #FEF3C7;
border: 1px solid #FCD34D;
padding: 5px 10px;
border-radius: 6px;
text-decoration: none;
transition: all 0.2s;
}
.gs-flight-check-btn:hover {
background: #F59E0B;
color: #ffffff;
} .gs-specs-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 10px;
margin-bottom: 14px;
}
.gs-spec-card {
background: #F8FAFC;
border: 1px solid #E2E8F0;
border-radius: 10px;
padding: 9px 12px;
display: flex;
align-items: center;
gap: 8px;
color: #64748B;
}
.gs-spec-card svg {
flex-shrink: 0;
color: #64748B;
}
.gs-spec-title {
font-size: 9px;
font-weight: 800;
color: #94A3B8;
text-transform: uppercase;
display: block;
line-height: 1;
margin-bottom: 2px;
}
.gs-spec-val {
font-size: 13px;
font-weight: 700;
color: #0F172A;
display: block;
line-height: 1;
} .gs-child-seats-alert {
background: #FEF2F2;
border: 1.5px solid #FECACA;
border-radius: 10px;
padding: 10px 14px;
margin-bottom: 14px;
display: flex;
align-items: center;
gap: 10px;
color: #991B1B;
}
.gs-child-seats-icon {
flex-shrink: 0;
color: #DC2626;
}
.gs-child-seats-content strong {
display: block;
font-size: 11px;
font-weight: 800;
letter-spacing: 0.5px;
}
.gs-child-seats-content span {
font-size: 13px;
font-weight: 700;
} .gs-driver-notes-box {
background: #F0FDF4;
border: 1px solid #BBF7D0;
border-radius: 10px;
padding: 10px 14px;
margin-bottom: 14px;
}
.gs-notes-header {
display: flex;
align-items: center;
gap: 5px;
font-size: 10px;
font-weight: 800;
color: #166534;
letter-spacing: 0.5px;
text-transform: uppercase;
margin-bottom: 4px;
}
.gs-notes-body {
font-size: 13px;
font-weight: 500;
font-style: italic;
color: #14532D;
line-height: 1.4;
} .gs-customer-contact-card {
background: #F8FAFC;
border: 1px solid #E2E8F0;
border-radius: 12px;
padding: 12px 14px;
margin-bottom: 14px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.gs-customer-info-left {
display: flex;
align-items: center;
gap: 10px;
}
.gs-cust-avatar {
width: 38px;
height: 38px;
border-radius: 50%;
background: #0F172A;
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
font-weight: 800;
flex-shrink: 0;
}
.gs-cust-name {
font-size: 14px;
font-weight: 800;
color: #0F172A;
display: block;
line-height: 1.2;
}
.gs-cust-phone-label {
font-size: 12px;
color: #64748B;
font-weight: 600;
}
.gs-contact-actions-bar {
display: flex;
align-items: center;
gap: 6px;
}
.gs-contact-btn {
display: inline-flex;
align-items: center;
gap: 5px;
font-size: 12px;
font-weight: 700;
padding: 8px 12px;
border-radius: 8px;
text-decoration: none;
transition: all 0.2s;
}
.gs-contact-btn.btn-call {
background: #EFF6FF;
color: #1D4ED8;
border: 1px solid #BFDBFE;
}
.gs-contact-btn.btn-call:hover {
background: #1D4ED8;
color: #ffffff;
}
.gs-contact-btn.btn-whatsapp {
background: #DCFCE7;
color: #15803D;
border: 1px solid #86EFAC;
}
.gs-contact-btn.btn-whatsapp:hover {
background: #15803D;
color: #ffffff;
}
.gs-contact-btn.btn-email {
background: #F1F5F9;
color: #475569;
border: 1px solid #CBD5E1;
}
.gs-contact-btn.btn-email:hover {
background: #475569;
color: #ffffff;
} .gs-payment-collection-box {
border-radius: 12px;
padding: 14px 18px;
margin-bottom: 14px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
}
.gs-payment-collection-box.box-paid {
background: #ECFDF5;
border: 1.5px solid #10B981;
}
.gs-payment-collection-box.box-cash {
background: #FFFBEB;
border: 1.5px solid #F59E0B;
}
.gs-pay-left {
display: flex;
align-items: center;
gap: 12px;
}
.gs-pay-icon {
width: 36px;
height: 36px;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.box-paid .gs-pay-icon {
background: #D1FAE5;
color: #059669;
}
.box-cash .gs-pay-icon {
background: #FEF3C7;
color: #D97706;
}
.gs-pay-label {
font-size: 11px;
font-weight: 800;
letter-spacing: 0.5px;
text-transform: uppercase;
display: block;
}
.box-paid .gs-pay-label { color: #047857; }
.box-cash .gs-pay-label { color: #B45309; }
.gs-pay-status-desc {
font-size: 12px;
font-weight: 600;
}
.box-paid .gs-pay-status-desc { color: #065F46; }
.box-cash .gs-pay-status-desc { color: #92400E; }
.gs-pay-amount-due {
font-size: 22px;
font-weight: 800;
color: #B45309;
font-family: var(--gs-font-title, sans-serif);
}
.gs-pay-badge-paid {
background: #10B981;
color: #ffffff;
font-size: 12px;
font-weight: 800;
padding: 5px 12px;
border-radius: 20px;
box-shadow: 0 2px 6px rgba(16, 185, 129, 0.3);
} .gs-card-footer-actions {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
}
.gs-btn-card-action {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 12px 14px;
border-radius: 10px;
font-size: 13px;
font-weight: 700;
text-decoration: none;
transition: all 0.2s;
min-height: 44px;
box-sizing: border-box;
}
.gs-btn-card-action.btn-maps {
background: #F1F5F9;
color: #1E293B !important;
border: 1.5px solid #CBD5E1;
}
.gs-btn-card-action.btn-maps:hover {
background: #E2E8F0;
border-color: #94A3B8;
}
.gs-btn-card-action.btn-voucher {
background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
color: #ffffff !important;
border: 1.5px solid #0F172A;
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.15);
}
.gs-btn-card-action.btn-voucher:hover {
background: linear-gradient(135deg, #1E293B 0%, #334155 100%);
transform: translateY(-1px);
box-shadow: 0 6px 16px rgba(15, 23, 42, 0.25);
} @media (max-width: 640px) {
.gs-portal-header-premium {
padding: 16px;
}
.gs-driver-profile-info {
width: 100%;
}
.gs-header-actions-group {
width: 100%;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.gs-portal-content-body {
padding: 14px;
}
.gs-driver-ride-card {
padding: 16px;
}
.gs-specs-grid {
grid-template-columns: 1fr;
}
.gs-customer-contact-card {
flex-direction: column;
align-items: flex-start;
}
.gs-contact-actions-bar {
width: 100%;
justify-content: space-between;
}
.gs-contact-btn {
flex: 1;
justify-content: center;
}
.gs-card-footer-actions {
grid-template-columns: 1fr;
}
.gs-dtab-btn {
padding: 10px 6px;
flex-direction: column;
gap: 4px;
}
.gs-tab-title-wrap {
font-size: 11px;
}
} .gs-profile-card {
background: #ffffff;
border-radius: 16px;
padding: 24px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
border: 1px solid #E2E8F0;
max-width: 800px;
margin: 0 auto;
}
.gs-profile-form {
display: flex;
flex-direction: column;
gap: 24px;
}
.gs-form-section {
border-bottom: 1px solid #E2E8F0;
padding-bottom: 24px;
}
.gs-form-section:last-of-type {
border-bottom: none;
padding-bottom: 0;
}
.gs-form-section-header {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 18px;
}
.gs-section-icon {
width: 40px;
height: 40px;
border-radius: 10px;
background: #EFF6FF;
color: var(--gs-primary, #0066FF);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.gs-section-title {
font-size: 16px;
font-weight: 800;
color: #0F172A;
margin: 0 0 2px 0;
letter-spacing: -0.2px;
}
.gs-section-desc {
font-size: 12.5px;
color: #64748B;
margin: 0;
line-height: 1.4;
}
.gs-form-grid-2 {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
}
.gs-form-field {
display: flex;
flex-direction: column;
}
.gs-form-field label {
font-size: 13px;
font-weight: 700;
color: #334155;
margin-bottom: 6px;
}
.gs-form-field label .gs-req {
color: #DC2626;
font-weight: 800;
}
.gs-form-field input {
width: 100% !important;
padding: 12px 14px !important;
border: 1.5px solid #CBD5E1 !important;
border-radius: 10px !important;
font-size: 14px !important;
color: #0F172A !important;
background: #F8FAFC !important;
transition: all 0.2s ease !important;
box-sizing: border-box !important;
height: auto !important;
line-height: normal !important;
}
.gs-form-field input:focus {
border-color: var(--gs-primary, #0066FF) !important;
background: #ffffff !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.12) !important;
}
.gs-field-hint {
font-size: 11.5px;
color: #64748B;
margin-top: 5px;
line-height: 1.35;
} .gs-portal-vehicles-list {
display: flex;
flex-direction: column;
gap: 14px;
margin-bottom: 14px;
}
.gs-portal-vehicle-row {
background: #F8FAFC;
border: 1.5px solid #E2E8F0;
border-radius: 12px;
padding: 16px;
transition: all 0.2s;
}
.gs-portal-vehicle-row:hover {
border-color: #CBD5E1;
}
.gs-pv-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 12px;
}
.gs-pv-number {
font-size: 11px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.5px;
color: var(--gs-primary, #0066FF);
background: #EFF6FF;
padding: 3px 10px;
border-radius: 20px;
}
.gs-btn-remove-veh {
background: transparent;
border: 1px solid #FECACA;
color: #DC2626;
padding: 4px 10px;
border-radius: 6px;
font-size: 11.5px;
font-weight: 700;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 4px;
transition: all 0.2s;
}
.gs-btn-remove-veh:hover {
background: #FEE2E2;
}
.gs-pv-fields-grid {
display: grid;
grid-template-columns: 1fr 1.5fr 1.5fr;
gap: 12px;
}
.gs-pv-fields-grid input,
.gs-pv-fields-grid select {
width: 100%;
padding: 10px 12px;
border: 1.5px solid #CBD5E1;
border-radius: 8px;
font-size: 13.5px;
color: #0F172A;
background: #ffffff;
box-sizing: border-box;
transition: all 0.2s;
}
.gs-pv-fields-grid input:focus,
.gs-pv-fields-grid select:focus {
border-color: var(--gs-primary, #0066FF);
outline: none;
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.12);
}
.gs-pv-driver-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
margin-top: 12px;
padding-top: 12px;
border-top: 1px dashed #E2E8F0;
}
@media (max-width: 640px) {
.gs-pv-driver-grid {
grid-template-columns: 1fr;
gap: 10px;
}
}
.gs-btn-add-veh {
background: #F1F5F9;
border: 1.5px dashed #94A3B8;
color: #334155;
padding: 11px 18px;
border-radius: 10px;
font-size: 13px;
font-weight: 700;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
transition: all 0.2s;
width: 100%;
}
.gs-btn-add-veh:hover {
background: #E2E8F0;
border-color: var(--gs-primary, #0066FF);
color: var(--gs-primary, #0066FF);
} .gs-form-submit-wrap {
margin-top: 10px;
}
.gs-btn-save-profile {
background: linear-gradient(135deg, #0066FF 0%, #0044CC 100%);
color: #ffffff;
border: none;
padding: 14px 28px;
border-radius: 12px;
font-size: 15px;
font-weight: 800;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
box-shadow: 0 4px 14px rgba(0, 102, 255, 0.35);
transition: all 0.2s ease;
width: 100%;
}
.gs-btn-save-profile:hover {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(0, 102, 255, 0.45);
}
@media (max-width: 640px) {
.gs-profile-card {
padding: 16px;
}
.gs-form-grid-2 {
grid-template-columns: 1fr;
gap: 12px;
}
.gs-pv-fields-grid {
grid-template-columns: 1fr;
gap: 10px;
}
} @media (max-width: 860px) {
.gs-qs-fields-grid {
grid-template-columns: 1fr 1fr;
}
.gs-qs-submit-btn {
grid-column: span 2;
justify-content: center;
}
} @media (max-width: 768px) {
.gs-wizard-progress {
padding: 12px 14px;
gap: 2px;
overflow-x: hidden;
}
.gs-progress-step {
gap: 6px;
flex-shrink: 0;
} .gs-step-info {
display: none !important;
} .gs-progress-step.current .gs-step-info {
display: flex !important;
flex-direction: column;
justify-content: center;
margin-left: 2px;
animation: gsStepFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.gs-progress-step.current .gs-step-num {
font-size: 9px;
font-weight: 800;
letter-spacing: 0.8px;
color: var(--gs-primary, #0066FF);
line-height: 1;
margin-bottom: 2px;
}
.gs-progress-step.current .gs-step-text {
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
font-size: 11.5px;
font-weight: 700;
color: #ffffff;
white-space: nowrap;
line-height: 1.15;
}
.gs-step-circle {
width: 28px;
height: 28px;
font-size: 12px;
flex-shrink: 0;
}
.gs-progress-step.current .gs-step-circle {
width: 30px;
height: 30px;
font-size: 13px;
border-color: #BFDBFE;
box-shadow: 0 0 10px rgba(0, 102, 255, 0.7);
}
.gs-progress-line {
margin: 0 6px;
min-width: 8px;
height: 2px;
}
}
@media (max-width: 380px) {
.gs-wizard-progress {
padding: 10px 8px;
gap: 2px;
}
.gs-progress-line {
margin: 0 3px;
min-width: 6px;
}
.gs-step-circle {
width: 26px;
height: 26px;
font-size: 11px;
}
.gs-progress-step.current .gs-step-circle {
width: 28px;
height: 28px;
font-size: 12px;
}
.gs-progress-step.current .gs-step-text {
font-size: 10.5px;
}
}
@keyframes gsStepFadeIn {
from {
opacity: 0;
transform: translateX(-4px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
@media (max-width: 640px) {
.gs-summary-bar {
flex-direction: column;
gap: 16px;
align-items: stretch;
text-align: center;
}
.gs-step-nav-bar {
width: 100% !important;
box-sizing: border-box !important;
}
.gs-step-nav-actions,
.gs-tf-choice-actions,
.gs-wizard-nav-step3,
.gs-wizard-nav-final {
width: 100% !important;
}
.gs-vehicle-cards { grid-template-columns: 1fr; }
.gs-card-actions { grid-template-columns: 1fr; }
.gs-pax-luggage-row { flex-direction: column; gap: 12px; }
.gs-qs-fields-grid { grid-template-columns: 1fr; }
.gs-qs-submit-btn { grid-column: span 1; }
}
@media (max-width: 520px) {
.gs-tf-bottom-choice-bar {
flex-direction: column !important;
align-items: stretch !important;
gap: 14px !important;
text-align: center !important;
padding: 16px 14px !important;
}
.gs-tf-choice-info {
justify-content: center !important;
}
.gs-step-nav-bar {
flex-direction: column !important;
align-items: stretch !important;
padding-top: 16px !important;
}
.gs-step-nav-actions,
.gs-tf-choice-actions,
.gs-wizard-nav-step3,
.gs-wizard-nav-final {
display: flex !important;
flex-direction: column !important;
width: 100% !important;
gap: 10px !important;
align-items: stretch !important;
}
.gs-btn-prev,
.gs-btn-next,
.gs-submit-btn,
.gs-tf-btn-continue,
#gs-back-to-step-1-btn,
#gs-back-to-step-2-btn,
#gs-back-to-step-3-btn,
#gs-go-to-step-3,
#gs-go-to-step-4,
#gs_submit_btn {
width: 100% !important;
min-width: 100% !important;
height: 48px !important;
min-height: 48px !important;
justify-content: center !important;
white-space: nowrap !important;
box-sizing: border-box !important;
}
} .gs-step2-transfeero-wrap {
padding: 24px 28px !important;
}
.gs-tf-grid {
display: grid;
grid-template-columns: 1fr 340px;
gap: 30px;
align-items: start;
} .gs-tf-tour-hero-wrap {
position: relative;
height: 250px;
width: 100%;
border-radius: 12px;
overflow: hidden;
border: 1px solid #E2E8F0;
background: #0F172A;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}
.gs-tour-hero-img-container {
position: relative;
width: 100%;
height: 100%;
}
.gs-tour-hero-img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
filter: brightness(0.92);
transition: transform 0.6s ease;
}
.gs-tf-tour-hero-wrap:hover .gs-tour-hero-img {
transform: scale(1.03);
}
.gs-tour-hero-gradient-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(180deg, rgba(15, 23, 42, 0.1) 0%, rgba(15, 23, 42, 0.4) 40%, rgba(15, 23, 42, 0.92) 100%);
pointer-events: none;
}
.gs-tour-hero-content {
position: absolute;
bottom: 16px;
left: 18px;
right: 18px;
z-index: 2;
color: #ffffff;
display: flex;
flex-direction: column;
gap: 6px;
}
.gs-tour-hero-badge {
display: inline-flex;
align-items: center;
gap: 6px;
background: rgba(255, 255, 255, 0.2);
backdrop-filter: blur(8px);
border: 1px solid rgba(255, 255, 255, 0.3);
padding: 3px 10px;
border-radius: 20px;
font-size: 11px;
font-weight: 700;
letter-spacing: 0.4px;
text-transform: uppercase;
color: #FFFFFF;
width: fit-content;
}
.gs-tour-hero-title {
font-size: 20px;
font-weight: 800;
color: #ffffff;
margin: 0;
line-height: 1.25;
text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
font-family: var(--gs-font-title, sans-serif);
}
.gs-tour-hero-pills {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 2px;
}
.gs-tour-hero-pill {
display: inline-flex;
align-items: center;
gap: 4px;
background: rgba(0, 0, 0, 0.5);
backdrop-filter: blur(6px);
border: 1px solid rgba(255, 255, 255, 0.18);
padding: 3px 9px;
border-radius: 16px;
font-size: 11.5px;
font-weight: 600;
color: #F1F5F9;
} .gs-tf-map-wrap {
position: relative;
height: 250px;
width: 100%;
border-radius: 12px;
overflow: hidden;
border: 1px solid #E5E7EB;
background: #F1F5F9;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
}
.gs-tf-map-canvas {
width: 100%;
height: 100%;
z-index: 1;
}
#gs-tf-map-canvas .leaflet-tile-pane {
filter: grayscale(100%) contrast(92%) brightness(104%);
} .gs-map-custom-marker {
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
.gs-marker-pin,
.gs-marker-flag {
display: inline-block;
transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
transform-origin: bottom center;
}
.gs-marker-pin:hover,
.gs-marker-flag:hover {
transform: scale(1.18);
cursor: pointer;
}
.gs-tf-map-badge {
position: absolute;
z-index: 999;
background: rgba(255, 255, 255, 0.96);
backdrop-filter: blur(6px);
border: 1px solid rgba(0, 0, 0, 0.08);
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
border-radius: 8px;
padding: 8px 12px;
display: flex;
align-items: center;
gap: 12px;
pointer-events: auto;
}
.gs-tf-map-badge.badge-pickup {
top: 14px;
left: 14px;
max-width: 320px;
}
.gs-tf-map-badge.badge-dropoff {
bottom: 14px;
right: 14px;
max-width: 320px;
}
.gs-tf-mb-info {
display: flex;
flex-direction: column;
}
.gs-tf-mb-label {
font-size: 10px;
font-weight: 700;
color: #6B7280;
text-transform: uppercase;
letter-spacing: 0.5px;
line-height: 1;
margin-bottom: 3px;
}
.gs-tf-mb-name {
font-size: 13px;
font-weight: 700;
color: #111827;
display: flex;
align-items: center;
gap: 5px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 190px;
}
.gs-tf-mb-icon {
font-size: 13px;
}
.gs-tf-mb-time {
font-size: 11px;
font-weight: 800;
padding: 5px 8px;
border-radius: 6px;
white-space: nowrap;
}
.gs-tf-mb-time.time-dark {
background: #111827;
color: #FFFFFF;
}
.gs-tf-mb-time.time-accent {
background: var(--gs-primary);
color: #FFFFFF;
} .gs-tf-top-notice {
text-align: center;
padding: 12px 0 16px 0;
font-size: 13px;
font-weight: 600;
color: #4B5563;
} .gs-tf-return-drawer {
background: #F8FAFC;
border: 1.5px solid var(--gs-primary);
border-radius: 12px;
padding: 14px 18px;
margin-bottom: 18px;
}
.gs-tf-rd-header {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 13px;
color: var(--gs-dark);
}
.gs-tf-rd-close {
background: transparent;
border: none;
font-size: 20px;
line-height: 1;
cursor: pointer;
color: #6B7280;
} .gs-tf-vehicle-list {
display: flex;
flex-direction: column;
gap: 12px;
}
.gs-tf-card {
display: grid;
grid-template-columns: 160px 1fr auto;
gap: 20px;
align-items: center;
background: #FFFFFF;
border: 1px solid #E5E7EB;
border-radius: 12px;
padding: 16px 20px;
cursor: pointer;
transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s;
user-select: none;
}
.gs-tf-card:hover {
border-color: #CBD5E1;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05);
}
.gs-tf-card.selected {
border: 2px solid var(--gs-primary) !important;
box-shadow: 0 0 0 1px var(--gs-primary), 0 8px 20px rgba(0, 0, 0, 0.06);
background: #FFFFFF;
}
.gs-tf-card-img-wrap {
display: flex;
align-items: center;
justify-content: center;
height: 95px;
}
.gs-tf-car-img {
max-width: 100%;
max-height: 90px;
object-fit: contain;
transition: transform 0.2s ease;
}
.gs-tf-card:hover .gs-tf-car-img,
.gs-tf-card.selected .gs-tf-car-img {
transform: scale(1.03);
}
.gs-tf-card-details {
display: flex;
flex-direction: column;
gap: 4px;
}
.gs-tf-card-header {
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap;
}
.gs-tf-card-title {
font-size: 18px;
font-weight: 800;
color: var(--gs-dark);
margin: 0;
font-family: var(--gs-font-title);
line-height: 1.2;
}
.gs-tf-badge {
display: inline-flex;
align-items: center;
font-size: 10px;
font-weight: 800;
padding: 2.5px 8px;
border-radius: 4px;
text-transform: uppercase;
letter-spacing: 0.6px;
line-height: 1.25;
margin-left: 8px;
vertical-align: middle;
white-space: nowrap;
}
.gs-tf-specs-row {
display: flex;
align-items: center;
gap: 12px;
font-size: 13px;
font-weight: 600;
color: #4B5563;
}
.gs-spec-tip {
font-size: 12px;
cursor: help;
opacity: 0.7;
}
.gs-tf-models-text {
font-size: 12px;
color: #6B7280;
margin: 0;
line-height: 1.4;
} .gs-tf-card-price-col {
text-align: right;
min-width: 125px;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: center;
}
.gs-tf-old-price-wrap {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 5px;
margin-bottom: 2px;
}
.gs-tf-old-price {
font-size: 12px;
color: #9CA3AF;
text-decoration: line-through;
font-weight: 500;
}
.gs-tf-discount-tag {
background: #DCFCE7;
color: #15803D;
font-size: 10px;
font-weight: 800;
padding: 1px 4px;
border-radius: 3px;
}
.gs-tf-current-price {
font-size: 22px;
font-weight: 800;
color: var(--gs-dark);
line-height: 1.1;
font-family: var(--gs-font-title);
}
.gs-tf-price-label {
font-size: 11px;
color: #9CA3AF;
margin-top: 2px;
} .gs-tf-roundtrip-banner {
display: flex;
align-items: center;
justify-content: space-between;
background: #FFFFFF;
border: 1px solid #E5E7EB;
border-radius: 12px;
padding: 14px 18px;
margin: 6px 0;
}
.gs-tf-rt-left {
display: flex;
align-items: center;
gap: 14px;
}
.gs-tf-rt-icon {
font-size: 20px;
color: #111827;
font-weight: 700;
}
.gs-tf-rt-left strong {
display: block;
font-size: 14px;
color: #111827;
margin-bottom: 2px;
}
.gs-tf-rt-left p {
font-size: 12px;
color: #6B7280;
margin: 0;
}
.gs-tf-rt-add-btn {
width: 36px;
height: 36px;
border: 1.5px solid var(--gs-primary);
border-radius: 6px;
background: transparent;
color: var(--gs-primary);
font-size: 22px;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.2s;
}
.gs-tf-rt-add-btn:hover {
background: var(--gs-primary);
color: #FFFFFF;
} .gs-tf-bottom-choice-bar {
display: flex;
align-items: center;
justify-content: space-between;
background: #FFFFFF;
border: 1px solid #E5E7EB;
border-radius: 12px;
padding: 16px 20px;
margin-top: 24px;
box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04);
position: relative;
z-index: 15;
}
.gs-tf-choice-info {
display: flex;
align-items: center;
gap: 6px;
}
.gs-tf-choice-lbl {
font-size: 14px;
color: #6B7280;
font-weight: 500;
}
.gs-tf-choice-name {
font-size: 15px;
font-weight: 800;
color: #111827;
}
.gs-tf-choice-actions {
display: flex !important;
align-items: center !important;
gap: 12px !important;
position: relative !important;
z-index: 16 !important;
}
.gs-tf-choice-actions .gs-btn-prev,
.gs-tf-choice-actions #gs-back-to-step-1-btn {
cursor: pointer !important;
pointer-events: auto !important;
position: relative !important;
z-index: 17 !important;
}
.gs-tf-btn-continue {
background: var(--gs-btn-bg, #0A0D12) !important;
color: var(--gs-btn-color, #FFFFFF) !important;
border: 1.5px solid transparent !important;
height: 48px !important;
min-height: 48px !important;
padding: 0 26px !important;
border-radius: 10px !important;
font-weight: 700 !important;
font-size: 14px !important;
letter-spacing: 0.3px !important;
text-transform: none !important;
white-space: nowrap !important;
cursor: pointer !important;
pointer-events: auto !important;
position: relative !important;
z-index: 17 !important;
transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
font-family: var(--gs-btn-font, var(--gs-font-title, 'Montserrat', sans-serif)) !important;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
}
.gs-tf-btn-continue:hover {
background: var(--gs-btn-bg-hover, #1E293B) !important;
color: var(--gs-btn-color-hover, #FFFFFF) !important;
transform: translateY(-1px) !important;
box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25) !important;
} .gs-tf-sidebar-col {
position: sticky;
top: 24px;
display: flex;
flex-direction: column;
gap: 16px;
}
.gs-tf-summary-card {
background: #FFFFFF;
border: 1px solid #E5E7EB;
border-radius: 14px;
padding: 22px;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
}
.gs-tf-sc-header {
margin-bottom: 12px;
}
.gs-tf-sc-title {
font-size: 19px;
font-weight: 800;
color: var(--gs-dark);
margin: 0;
font-family: var(--gs-font-title);
}
.gs-tf-sc-meta-row {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 12px;
}
.gs-tf-sc-badge,
.gs-tf-sc-pax {
background: #F3F4F6;
color: #374151;
padding: 4px 10px;
border-radius: 6px;
font-size: 12px;
font-weight: 600;
}
.gs-tf-sc-outward-date {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 13px;
color: #4B5563;
padding-bottom: 12px;
border-bottom: 1px solid #F1F5F9;
margin-bottom: 14px;
}
.gs-tf-btn-edit-top {
background: transparent;
border: none;
color: #4B5563;
font-weight: 600;
font-size: 12px;
cursor: pointer;
text-decoration: underline;
padding: 0;
}
.gs-tf-btn-edit-top:hover {
color: var(--gs-primary);
} .gs-tf-timeline {
display: flex;
flex-direction: column;
margin-bottom: 16px;
}
.gs-tf-tl-stop {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
}
.gs-tf-tl-icon-stop {
width: 22px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.gs-tl-pin-img {
width: 18px;
height: 24px;
object-fit: contain;
display: block;
filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.2));
}
.gs-tl-flag-svg {
width: 20px;
height: 22px;
display: block;
filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.2));
}
.gs-tf-tl-sq-dot {
font-size: 12px;
line-height: 1.2;
}
.gs-tf-tl-sq-dot.dot-black {
color: #111827;
}
.gs-tf-tl-sq-dot.dot-accent {
color: var(--gs-primary);
}
.gs-tf-tl-details {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
gap: 3px;
padding: 0 6px;
}
.gs-tf-tl-place {
font-size: 13.5px;
font-weight: 700;
color: #0F172A;
line-height: 1.35;
word-break: break-word;
}
.gs-tf-tl-sub {
font-size: 11.5px;
color: #64748B;
line-height: 1.3;
margin-top: 1px;
}
.gs-tf-tl-sub:empty {
display: none !important;
}
.gs-tf-tl-extra {
display: flex;
flex-direction: column;
gap: 4px;
margin-top: 4px;
width: 100%;
}
.gs-tf-tl-extra:empty {
display: none !important;
}
.gs-tf-tl-extra-badge {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 11.5px;
font-weight: 600;
line-height: 1.35;
padding: 3px 8px;
border-radius: 6px;
background: #F8FAFC;
border: 1px solid #E2E8F0;
color: #1E293B;
max-width: 100%;
word-break: break-word;
}
.gs-tf-tl-extra-badge svg {
flex-shrink: 0;
}
.gs-tf-tl-extra-badge.badge-address {
background: #F0FDF4;
border-color: #BBF7D0;
color: #15803D;
}
.gs-tf-tl-extra-badge.badge-flight {
background: #EFF6FF;
border-color: #BFDBFE;
color: #1D4ED8;
}
.gs-tf-tl-extra-badge.badge-ferry {
background: #F5F3FF;
border-color: #DDD6FE;
color: #6D28D9;
}
.gs-tf-tl-time {
font-size: 12px;
font-weight: 700;
color: #374151;
white-space: nowrap;
flex-shrink: 0;
padding-top: 1px;
}
.gs-tf-tl-connecting-line {
margin-left: 10px;
padding: 10px 0 10px 18px;
border-left: 2px dashed #CBD5E1;
}
.gs-tf-tl-pill-info {
display: inline-block;
background: #F8FAFC;
border: 1px solid #E2E8F0;
border-radius: 12px;
padding: 3px 8px;
font-size: 10px;
font-weight: 700;
color: #64748B;
}
.gs-tf-sidebar-add-return-btn {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 5px;
width: 100%;
border: 1.5px dashed #CBD5E1;
border-radius: 10px;
background: #F8FAFC;
padding: 12px 14px;
cursor: pointer;
text-align: center;
margin-bottom: 18px;
transition: all 0.2s ease;
box-sizing: border-box;
text-decoration: none;
}
.gs-tf-sidebar-add-return-btn:hover {
border-color: #0066FF;
background: #EFF6FF;
box-shadow: 0 4px 14px rgba(0, 102, 255, 0.12);
transform: translateY(-1px);
}
.gs-tf-sidebar-add-return-btn:active {
transform: translateY(0);
}
.gs-tf-sar-main {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 7px;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
font-weight: 800;
font-size: 13.5px;
color: #0F172A;
letter-spacing: 0.5px;
}
.gs-tf-sar-icon {
font-size: 14px;
color: #0066FF;
}
.gs-tf-sar-discount-tag {
background: #DCFCE7;
color: #15803D;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
font-size: 11px;
font-weight: 800;
padding: 2px 7px;
border-radius: 6px;
line-height: 1.2;
letter-spacing: 0;
}
.gs-tf-sar-motto {
font-family: var(--gs-font-body, 'Inter', sans-serif);
font-size: 12px;
font-weight: 600;
color: #059669;
letter-spacing: 0.1px;
line-height: 1.3;
}
.gs-tf-sidebar-add-return-btn:hover .gs-tf-sar-motto {
color: #047857;
} .gs-tf-trust-wrap {
background: #FFFFFF;
border: 1px solid #E5E7EB;
border-radius: 14px;
padding: 18px 20px;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
}
.gs-tf-trust-card {
background: transparent;
border: none;
padding: 0;
margin-bottom: 14px;
display: flex;
flex-direction: column;
gap: 14px;
box-shadow: none;
}
.gs-tf-trust-item {
display: flex;
align-items: flex-start;
gap: 12px;
}
.gs-tf-ti-icon {
font-size: 18px;
line-height: 1.2;
flex-shrink: 0;
margin-top: 1px;
}
.gs-tf-ti-content {
flex: 1;
}
.gs-tf-ti-title {
display: block;
font-size: 13.5px;
font-weight: 700;
color: var(--gs-primary, #0066FF);
line-height: 1.3;
margin-bottom: 2px;
}
.gs-tf-ti-desc {
font-size: 11.5px;
color: #6B7280;
line-height: 1.45;
margin: 0;
}
.gs-tf-trust-list {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 18px;
}
.gs-tf-trust-pill {
display: flex;
align-items: center;
gap: 8px;
font-size: 12px;
font-weight: 600;
color: #374151;
}
.pill-green-outline {
border: 1px solid #16A34A;
color: #16A34A;
border-radius: 20px;
padding: 3px 10px;
width: fit-content;
background: #F0FDF4;
font-size: 11px;
} .gs-tf-payment-bar {
display: flex;
justify-content: center;
align-items: center;
padding-top: 14px;
border-top: 1px solid #F1F5F9;
text-align: center;
}
.gs-tf-payment-icons-strip {
height: 27px;
width: auto;
max-width: 100%;
object-fit: contain;
display: inline-block;
filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.05));
transition: opacity 0.2s ease, transform 0.2s ease;
}
.gs-tf-payment-icons-strip:hover {
transform: scale(1.02);
} @media (max-width: 992px) {
.gs-tf-grid {
display: flex;
flex-direction: column;
gap: 0;
}
.gs-tf-sidebar-col {
display: contents;
}
.gs-tf-main-col {
display: contents;
} .gs-tf-summary-card {
order: 1;
margin-bottom: 18px;
width: 100%;
box-sizing: border-box;
} .gs-tf-tour-hero-wrap,
.gs-step2-tour-box,
.gs-tf-map-wrap {
order: 2;
margin-bottom: 14px;
width: 100%;
box-sizing: border-box;
}
.gs-tf-top-notice {
order: 3;
margin-bottom: 12px;
text-align: center;
}
.gs-tf-return-drawer {
order: 3;
margin-bottom: 16px;
width: 100%;
box-sizing: border-box;
} .gs-tf-vehicle-list {
order: 4;
width: 100%;
box-sizing: border-box;
} .gs-tf-bottom-choice-bar {
order: 5;
margin-top: 18px;
margin-bottom: 18px;
width: 100%;
box-sizing: border-box;
} .gs-tf-trust-wrap {
order: 6;
margin-top: 0;
margin-bottom: 20px;
width: 100%;
box-sizing: border-box;
}
}
@media (max-width: 640px) {
.gs-step2-transfeero-wrap {
padding: 16px 14px !important;
}
.gs-tf-card {
grid-template-columns: 1fr;
text-align: center;
gap: 12px;
}
.gs-tf-card-price-col {
align-items: center;
text-align: center;
}
.gs-tf-card-header {
justify-content: center;
}
.gs-tf-specs-row {
justify-content: center;
}
.gs-tf-bottom-choice-bar {
flex-direction: column !important;
gap: 14px !important;
text-align: center !important;
}
.gs-tf-choice-actions {
width: 100% !important;
flex-direction: column !important;
gap: 10px !important;
justify-content: center !important;
}
.gs-tf-choice-actions .gs-btn-prev,
.gs-tf-choice-actions .gs-btn-next,
.gs-tf-btn-continue {
width: 100% !important;
min-width: 100% !important;
justify-content: center !important;
white-space: nowrap !important;
}
} .gs-autocomplete-wrapper {
position: relative !important;
overflow: visible !important;
}
.gs-autocomplete-wrapper.gs-ac-open,
.gs-autocomplete-wrapper:focus-within {
z-index: 50 !important;
}
.gs-autocomplete-dropdown {
position: absolute;
top: calc(100% + 6px);
left: 0;
width: 100%;
min-width: 300px;
max-width: min(380px, 92vw);
background: #ffffff;
border: 1px solid #cbd5e1;
border-radius: 12px;
box-shadow: 0 16px 45px rgba(15, 23, 42, 0.25), 0 4px 12px rgba(15, 23, 42, 0.08);
z-index: 100 !important;
max-height: 340px;
overflow-y: auto;
overflow-x: hidden;
scrollbar-width: thin;
scrollbar-color: #cbd5e1 transparent;
display: none;
box-sizing: border-box;
-webkit-overflow-scrolling: touch;
touch-action: pan-y;
overscroll-behavior: contain;
}
#bl-dropoff-autocomplete-list,
#gs-dropoff-autocomplete-list {
left: auto;
right: 0;
}
.gs-autocomplete-dropdown::-webkit-scrollbar {
width: 4px;
}
.gs-autocomplete-dropdown::-webkit-scrollbar-track {
background: transparent;
}
.gs-autocomplete-dropdown::-webkit-scrollbar-thumb {
background: #cbd5e1;
border-radius: 8px;
}
@media (max-width: 640px) {
.gs-autocomplete-dropdown {
min-width: 100% !important;
max-width: 100% !important;
left: 0 !important;
right: 0 !important;
width: 100% !important;
border-radius: 8px;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
max-height: 270px;
}
}
.gs-ac-item {
display: flex;
align-items: center;
gap: 7px;
padding: 3.5px 8px;
cursor: pointer;
font-size: 11px;
color: #1e293b;
border-bottom: 1px solid #f8fafc;
transition: background 0.12s ease;
text-align: left;
min-height: 24px;
}
.gs-ac-item:last-child {
border-bottom: none;
}
.gs-ac-item:hover,
.gs-ac-item.active {
background: #f1f5f9;
color: var(--gs-primary, #0066FF);
}
.gs-ac-icon {
font-size: 12.5px;
flex-shrink: 0;
line-height: 1;
display: inline-flex;
align-items: center;
justify-content: center;
width: 16px;
}
.gs-ac-text {
font-weight: 600;
font-size: 11px;
color: #0f172a;
flex-grow: 1;
white-space: normal;
line-height: 1.2;
word-break: break-word;
}
.gs-ac-section-header {
padding: 2.5px 8px;
font-size: 8px;
font-weight: 700;
letter-spacing: 0.4px;
text-transform: uppercase;
color: #64748b;
background: #f8fafc;
border-bottom: 1px solid #f1f5f9;
border-top: 1px solid #f1f5f9;
user-select: none;
text-align: left;
line-height: 13px;
}
.gs-ac-section-header:first-child {
border-top: none;
}
.gs-ac-text-col {
display: flex;
flex-direction: column;
flex-grow: 1;
min-width: 0;
overflow: hidden;
text-align: left;
}
.gs-ac-subtext {
font-size: 9.5px;
color: #64748b;
font-weight: 400;
margin-top: 1px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
line-height: 1.15;
}
.gs-ac-loading {
padding: 11px 14px;
font-size: 12px;
color: #64748b;
display: flex;
align-items: center;
gap: 8px;
background: #fafafa;
border-top: 1px solid #f1f5f9;
}
.gs-ac-spinner {
width: 13px;
height: 13px;
border: 2px solid #cbd5e1;
border-top-color: #0066FF;
border-radius: 50%;
animation: gsAcSpin 0.7s linear infinite;
flex-shrink: 0;
}
@keyframes gsAcSpin {
to { transform: rotate(360deg); }
}
.gs-ac-empty {
padding: 12px 14px;
font-size: 12px;
color: #64748b;
font-style: italic;
line-height: 1.4;
text-align: left;
} .gs-ac-pill-bar {
position: sticky;
top: 0;
z-index: 10;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 3px;
padding: 3px 6px;
background: #ffffff;
border-bottom: 1px solid #f1f5f9;
}
.gs-ac-pill {
background: #f8fafc;
border: 1px solid #e2e8f0;
color: #475569;
border-radius: 5px;
padding: 2px 5px !important;
font-size: 10px !important;
font-weight: 600 !important;
line-height: 1.2 !important;
text-transform: none !important;
cursor: pointer;
transition: all 0.15s ease;
display: inline-flex;
align-items: center;
gap: 2.5px;
flex-shrink: 0;
outline: none;
box-shadow: none;
}
.gs-ac-pill:hover {
border-color: #cbd5e1;
background: #f1f5f9;
color: #0f172a;
}
.gs-ac-pill.active {
background: #0066FF !important;
border-color: #0066FF !important;
color: #ffffff !important;
box-shadow: 0 1px 3px rgba(0, 102, 255, 0.25) !important;
}
.gs-ac-pill .gs-ac-pill-count {
font-size: 8px !important;
font-weight: 700 !important;
background: rgba(0, 0, 0, 0.07);
padding: 0px 3px;
border-radius: 4px;
line-height: 10px;
}
.gs-ac-pill.active .gs-ac-pill-count {
background: rgba(255, 255, 255, 0.25);
color: #ffffff;
}
.gs-ac-badge {
display: inline-block;
font-size: 7.5px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.2px;
padding: 1px 3.5px;
border-radius: 3px;
flex-shrink: 0;
line-height: 10px;
margin-left: 4px;
vertical-align: middle;
}
.gs-ac-badge-popular {
background: #ffedd5;
color: #c2410c;
}
.gs-ac-badge-airport {
background: #e0f2fe;
color: #0369a1;
}
.gs-ac-badge-port {
background: #e0e7ff;
color: #4338ca;
}
.gs-ac-badge-ski {
background: #e0f2fe;
color: #0284c7;
}
.gs-ac-badge-center,
.gs-ac-badge-city {
background: #fdf4ff;
color: #a21caf;
}
.gs-ac-badge-area {
background: #f1f5f9;
color: #475569;
}
.gs-ac-badge-beach {
background: #fffbeb;
color: #b45309;
}
.gs-ac-badge-hotel,
.gs-ac-badge-poi {
background: #fef3c7;
color: #92400e;
}
.gs-ac-match {
background: #fef08a;
color: #854d0e;
font-weight: 700;
border-radius: 2px;
padding: 0 1px;
} .gs-smart-detail-card {
background: #ffffff;
border: 1px solid #e2e8f0;
border-radius: 14px;
padding: 18px 20px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
transition: border-color 0.2s ease;
}
.gs-smart-detail-card:focus-within {
border-color: #93c5fd;
}
.gs-smart-detail-header {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 14px;
padding-bottom: 12px;
border-bottom: 1px solid #f1f5f9;
}
.gs-smart-detail-icon {
width: 44px;
height: 44px;
border-radius: 12px;
background: #f8fafc;
border: 1px solid #e2e8f0;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
color: #0f172a;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.gs-smart-detail-icon svg {
width: 22px;
height: 22px;
display: block;
stroke: currentColor;
fill: none;
transition: transform 0.2s ease;
}
.gs-smart-detail-card:hover .gs-smart-detail-icon {
background: #f1f5f9;
border-color: #cbd5e1;
transform: translateY(-1px);
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.06);
}
.gs-smart-detail-title {
font-size: 15px;
font-weight: 800;
color: #0f172a;
margin: 0;
}
.gs-smart-detail-sub {
font-size: 12.5px;
color: #64748b;
margin: 2px 0 0;
}
.gs-type-fields-group {
transition: opacity 0.2s ease;
} .gs-review-card {
background: #0f172a;
color: #ffffff;
border-radius: 14px;
padding: 22px 24px;
margin-bottom: 24px;
box-shadow: 0 4px 16px rgba(15, 23, 42, 0.12);
}
.gs-review-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 16px;
padding-bottom: 14px;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.gs-review-service-badge {
background: var(--gs-primary);
color: #ffffff;
padding: 4px 12px;
border-radius: 20px;
font-size: 11.5px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.gs-review-title {
font-size: 17px;
font-weight: 800;
color: #ffffff;
margin: 0;
}
.gs-review-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 16px;
}
.gs-review-item {
display: flex;
flex-direction: column;
gap: 4px;
}
.gs-review-label {
font-size: 11.5px;
color: #94a3b8;
font-weight: 600;
}
.gs-review-val {
font-size: 14px;
color: #f8fafc;
font-weight: 700;
} .gs-phone-input-group {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
border: 1.5px solid #d1d5db !important;
border-radius: 10px !important;
background: #ffffff !important;
transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
overflow: hidden !important;
height: 48px !important;
box-sizing: border-box !important;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}
.gs-phone-input-group:focus-within {
border-color: var(--gs-primary) !important;
box-shadow: 0 0 0 3px rgba(1, 111, 248, 0.14) !important;
}
.gs-phone-flag-box {
position: relative !important;
width: 92px !important;
min-width: 92px !important;
max-width: 92px !important;
flex: 0 0 92px !important;
height: 100% !important;
background: #f8fafc !important;
border-right: 1.5px solid #e2e8f0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 5px !important;
cursor: pointer !important;
flex-shrink: 0 !important;
box-sizing: border-box !important;
}
.gs-phone-flag-box select#gs_phone_country_code {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
opacity: 0 !important;
cursor: pointer !important;
z-index: 5 !important;
margin: 0 !important;
padding: 0 !important;
border: none !important;
background: transparent !important;
}
.gs-phone-input-group input[type="tel"]#gs_customer_phone {
flex: 1 1 auto !important;
width: 100% !important;
min-width: 0 !important;
border: none !important;
outline: none !important;
height: 100% !important;
padding: 0 14px !important;
font-size: 15px !important;
background: transparent !important;
color: #1e293b !important;
box-shadow: none !important;
margin: 0 !important;
box-sizing: border-box !important;
}
.gs-phone-input-group input[type="tel"]#gs_customer_phone:focus {
outline: none !important;
box-shadow: none !important;
} .gs-invoice-box {
transition: all 0.25s ease;
}
.gs-invoice-box:hover {
border-color: #CBD5E1 !important;
}
.gs-invoice-box input[type="text"] {
width: 100%;
height: 44px;
padding: 0 14px;
border: 1.5px solid #d1d5db;
border-radius: 8px;
font-size: 14px;
background: #ffffff;
box-sizing: border-box;
transition: border-color 0.2s, box-shadow 0.2s;
}
.gs-invoice-box input[type="text"]:focus {
border-color: #0066FF;
outline: none;
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.12);
}
.gs-btn-coupon:hover {
background: #1e293b !important;
}
.gs-btn-coupon:active {
transform: scale(0.98);
}
.gs-remove-coupon-btn:hover {
color: #b91c1c !important;
transform: scale(1.15);
}
#gs-coupon-feedback.success {
color: #16A34A !important;
}
#gs-coupon-feedback.error {
color: #DC2626 !important;
} .gs-unserviceable-route-banner {
display: flex;
align-items: flex-start;
gap: 14px;
background: #FFF1F2;
border: 1.5px solid #FCA5A5;
border-radius: 12px;
padding: 14px 18px;
margin: 14px 0 16px;
color: #991B1B;
box-shadow: 0 4px 14px rgba(239, 68, 68, 0.08);
animation: gsShake 0.4s ease-in-out;
}
.gs-unserviceable-route-banner .gs-urb-icon {
font-size: 24px;
line-height: 1;
flex-shrink: 0;
margin-top: 1px;
}
.gs-unserviceable-route-banner .gs-urb-content {
flex: 1;
}
.gs-unserviceable-route-banner .gs-urb-title {
font-size: 15px;
font-weight: 700;
color: #B91C1C;
margin-bottom: 4px;
}
.gs-unserviceable-route-banner .gs-urb-desc {
font-size: 13.5px;
line-height: 1.5;
color: #7F1D1D;
font-weight: 500;
}
.gs-unserviceable-route-banner .gs-urb-email-text {
font-weight: 700;
color: #B91C1C;
text-decoration: underline;
}
.gs-unserviceable-route-banner .gs-urb-link {
display: inline-flex;
align-items: center;
gap: 6px;
margin-top: 10px;
padding: 7px 16px;
background: #DC2626;
color: #FFFFFF !important;
font-size: 13px;
font-weight: 600;
border-radius: 7px;
text-decoration: none !important;
box-shadow: 0 2px 6px rgba(220, 38, 38, 0.25);
transition: background 0.2s, transform 0.15s, box-shadow 0.2s;
}
.gs-unserviceable-route-banner .gs-urb-link:hover {
background: #B91C1C;
color: #FFFFFF !important;
transform: translateY(-1px);
box-shadow: 0 4px 10px rgba(185, 28, 28, 0.35);
} .aeo-royal-box,
div.vc_message_box.aeo-royal-box,
div.wpb_alert.aeo-royal-box,
.wpb_alert.aeo-royal-box {
border: 1.5px solid rgb(0, 71, 186) !important;
background-color: rgba(0, 71, 186, 0.04) !important;
background-image: none !important;
border-radius: 8px !important;
}
.aeo-royal-box .vc_message_box-icon,
.aeo-royal-box i,
.aeo-royal-box svg {
color: rgb(0, 71, 186) !important;
}
.aeo-royal-box p,
.aeo-royal-box {
color: #1e293b !important;
font-size: 15px !important;
line-height: 1.6 !important;
} .getseat-manage-wrapper {
font-family: var(--gs-font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
color: #0F172A;
max-width: 1140px;
margin: 24px auto 50px;
padding: 0 16px;
box-sizing: border-box;
} .gs-manage-lookup-card {
max-width: 540px;
margin: 40px auto;
background: #FFFFFF;
border: 1px solid #E2E8F0;
border-radius: 20px;
box-shadow: 0 16px 40px -12px rgba(15, 23, 42, 0.10), 0 0 1px rgba(15, 23, 42, 0.08);
padding: 38px 34px;
text-align: center;
box-sizing: border-box;
}
.gs-manage-icon-badge {
width: 64px;
height: 64px;
border-radius: 18px;
background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);
border: 1px solid #BFDBFE;
display: inline-flex;
align-items: center;
justify-content: center;
margin-bottom: 18px;
box-shadow: 0 4px 14px rgba(0, 102, 255, 0.12);
}
.gs-manage-lookup-header h2 {
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
font-size: 24px;
font-weight: 800;
color: #0F172A;
margin: 0 0 10px;
letter-spacing: -0.3px;
}
.gs-manage-lookup-header p {
font-size: 14px;
color: #64748B;
line-height: 1.55;
margin: 0 0 24px;
}
.gs-manage-form {
text-align: left;
}
.gs-manage-field-group {
margin-bottom: 20px;
}
.gs-manage-field-group label {
display: block;
font-size: 13px;
font-weight: 700;
color: #1E293B;
margin-bottom: 6px;
}
.gs-manage-input-wrap {
position: relative;
display: flex;
align-items: center;
}
.gs-manage-input-icon {
position: absolute;
left: 14px;
font-size: 15px;
color: #94A3B8;
pointer-events: none;
font-weight: 700;
}
.gs-manage-input-wrap input {
width: 100% !important;
padding: 12px 14px 12px 42px !important;
border: 1.5px solid #CBD5E1 !important;
border-radius: 10px !important;
font-size: 14.5px !important;
color: #0F172A !important;
background: #FFFFFF !important;
transition: all 0.2s ease !important;
box-sizing: border-box !important;
outline: none !important;
}
.gs-manage-input-wrap input:focus {
border-color: #0066FF !important;
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.15) !important;
}
.gs-manage-field-hint {
display: block;
font-size: 11.5px;
color: #94A3B8;
margin-top: 5px;
}
.gs-manage-btn-primary {
width: 100%;
background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
color: #FFFFFF;
border: none;
padding: 14px 24px;
font-size: 15px;
font-weight: 800;
border-radius: 10px;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
transition: all 0.2s ease;
box-shadow: 0 4px 14px rgba(15, 23, 42, 0.25);
margin-top: 10px;
}
.gs-manage-btn-primary:hover {
background: linear-gradient(135deg, #1E293B 0%, #334155 100%);
transform: translateY(-1px);
box-shadow: 0 6px 20px rgba(15, 23, 42, 0.35);
}
.gs-manage-lookup-footer {
margin-top: 26px;
padding-top: 20px;
border-top: 1px solid #F1F5F9;
font-size: 13px;
color: #64748B;
}
.gs-manage-link {
color: #0066FF;
text-decoration: none;
font-weight: 600;
}
.gs-manage-link:hover {
text-decoration: underline;
} .gs-manage-alert {
padding: 12px 16px;
border-radius: 10px;
margin-bottom: 20px;
font-size: 13.5px;
line-height: 1.45;
}
.gs-manage-alert-danger {
background: #FEF2F2;
border: 1px solid #FECACA;
color: #991B1B;
}
.gs-manage-alert-cancelled {
display: flex;
align-items: center;
gap: 14px;
background: #FEF2F2;
border: 1.5px solid #FECACA;
border-radius: 14px;
color: #991B1B;
margin-bottom: 22px;
padding: 18px 22px;
box-shadow: 0 4px 12px rgba(220, 38, 38, 0.06);
}
.gs-manage-alert-icon {
font-size: 32px;
flex-shrink: 0;
}
.gs-manage-alert-text strong {
display: block;
font-size: 15.5px;
margin-bottom: 3px;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
} .gs-manage-dashboard {
width: 100%;
}
.gs-manage-top-bar {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 14px;
margin-bottom: 24px;
background: #FFFFFF;
border: 1px solid #E2E8F0;
border-radius: 16px;
padding: 12px 18px;
box-shadow: 0 2px 10px rgba(15, 23, 42, 0.03);
}
.gs-manage-back-btn {
display: inline-flex;
align-items: center;
gap: 6px;
color: #475569;
font-size: 13px;
font-weight: 700;
text-decoration: none;
padding: 7px 14px;
border-radius: 9px;
background: #F8FAFC;
border: 1px solid #E2E8F0;
transition: all 0.15s ease;
}
.gs-manage-back-btn:hover {
background: #F1F5F9;
color: #0F172A;
border-color: #CBD5E1;
}
.gs-manage-header-badges {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.gs-manage-code-pill {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
color: #1E293B;
background: #F8FAFC;
border: 1px solid #CBD5E1;
padding: 6px 13px;
border-radius: 10px;
cursor: pointer;
transition: all 0.15s ease;
}
.gs-manage-code-pill:hover {
background: #EFF6FF;
border-color: #93C5FD;
color: #1E40AF;
}
.gs-manage-code-pill.copied {
background: #DCFCE7;
border-color: #86EFAC;
color: #166534;
}
.gs-ref-prefix {
color: #64748B;
font-size: 12px;
}
.gs-ref-num {
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
font-weight: 800;
letter-spacing: 0.3px;
}
.gs-copy-icon {
font-size: 12px;
opacity: 0.7;
}
.gs-manage-status-pill {
display: inline-flex;
align-items: center;
gap: 7px;
padding: 6px 14px;
border-radius: 20px;
font-size: 11.5px;
font-weight: 800;
letter-spacing: 0.5px;
text-transform: uppercase;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-status-bullet {
width: 7px;
height: 7px;
border-radius: 50%;
display: inline-block;
background: currentColor;
box-shadow: 0 0 5px currentColor;
}
.gs-manage-status-pill.status-green { background: #DEF7EC; color: #03543F; border: 1px solid #BCF0DA; }
.gs-manage-status-pill.status-blue  { background: #EFF6FF; color: #1E40AF; border: 1px solid #DBEAFE; }
.gs-manage-status-pill.status-amber { background: #FEF3C7; color: #92400E; border: 1px solid #FDE68A; }
.gs-manage-status-pill.status-red   { background: #FDE8E8; color: #9B1C1C; border: 1px solid #FBD5D5; }
.gs-manage-status-pill.status-gray  { background: #F1F5F9; color: #475569; border: 1px solid #E2E8F0; }
.gs-manage-edit-badge {
display: inline-flex;
align-items: center;
gap: 5px;
font-size: 11.5px;
font-weight: 700;
color: #0369A1;
background: #F0F9FF;
border: 1px solid #BAE6FD;
padding: 5px 11px;
border-radius: 8px;
} .gs-manage-grid {
display: grid;
grid-template-columns: 1.85fr 1fr;
gap: 24px;
align-items: start;
}
@media (max-width: 960px) {
.gs-manage-grid {
grid-template-columns: 1fr;
}
} .gs-manage-card {
background: #FFFFFF;
border: 1px solid #E2E8F0;
border-radius: 18px;
box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.05);
margin-bottom: 24px;
overflow: hidden;
}
.gs-manage-card-header {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 10px;
padding: 16px 22px;
background: linear-gradient(180deg, #F8FAFC 0%, #F1F5F9 100%);
border-bottom: 1px solid #E2E8F0;
}
.gs-manage-card-title {
display: flex;
align-items: center;
gap: 12px;
}
.gs-leg-icon-pill {
width: 38px;
height: 38px;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.gs-leg-icon-pill.outward {
background: #EFF6FF;
border: 1px solid #BFDBFE;
color: #0066FF;
}
.gs-leg-icon-pill.return {
background: #ECFDF5;
border: 1px solid #A7F3D0;
color: #059669;
}
.gs-leg-icon-pill.passenger {
background: #F8FAFC;
border: 1px solid #E2E8F0;
color: #0F172A;
}
.gs-manage-card-title h3 {
margin: 0;
font-size: 16px;
font-weight: 800;
color: #0F172A;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
letter-spacing: -0.2px;
}
.gs-leg-sub {
display: block;
font-size: 10.5px;
font-weight: 800;
color: #94A3B8;
letter-spacing: 0.6px;
text-transform: uppercase;
margin-top: 1px;
}
.gs-manage-date-badge {
font-size: 12.5px;
font-weight: 700;
color: #0284C7;
background: #F0F9FF;
border: 1px solid #BAE6FD;
padding: 5px 12px;
border-radius: 9px;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-card-body {
padding: 22px 24px;
} .gs-manage-route-summary {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
padding: 16px 20px;
background: #F8FAFC;
border: 1px solid #E2E8F0;
border-radius: 14px;
margin-bottom: 12px;
}
.gs-manage-route-point {
display: flex;
align-items: center;
gap: 12px;
flex: 1;
}
.gs-route-icon-box {
width: 36px;
height: 36px;
border-radius: 10px;
background: #FFFFFF;
border: 1.5px solid #CBD5E1;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
box-shadow: 0 2px 6px rgba(15, 23, 42, 0.05);
}
.gs-tl-pin-img {
width: 18px;
height: auto;
display: block;
}
.gs-tl-flag-svg {
display: block;
}
.gs-manage-point-info {
display: flex;
flex-direction: column;
}
.gs-manage-point-label {
font-size: 10.5px;
color: #64748B;
text-transform: uppercase;
font-weight: 800;
letter-spacing: 0.6px;
margin-bottom: 2px;
}
.gs-manage-point-name {
font-size: 14px;
color: #0F172A;
font-weight: 800;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
line-height: 1.35;
}
.gs-manage-route-connector {
display: flex;
align-items: center;
gap: 8px;
flex: 0 0 auto;
padding: 0 8px;
}
.gs-connector-line {
width: 32px;
height: 2px;
background: repeating-linear-gradient(90deg, #CBD5E1, #CBD5E1 4px, transparent 4px, transparent 8px);
}
.gs-connector-badge {
font-size: 15px;
background: #FFFFFF;
border: 1px solid #E2E8F0;
border-radius: 50%;
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06);
}
.gs-route-hub-notice {
font-size: 12px;
color: #64748B;
background: #EFF6FF;
border: 1px solid #DBEAFE;
border-radius: 8px;
padding: 8px 12px;
margin-bottom: 20px;
line-height: 1.45;
} .gs-edit-sections-wrap {
display: flex;
flex-direction: column;
gap: 18px;
}
.gs-edit-group {
background: #FFFFFF;
border: 1px solid #E2E8F0;
border-radius: 12px;
padding: 16px 18px;
transition: border-color 0.15s ease;
}
.gs-edit-group:focus-within {
border-color: #93C5FD;
}
.gs-group-header {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 12px;
padding-bottom: 8px;
border-bottom: 1px dashed #E2E8F0;
}
.gs-group-icon {
font-size: 15px;
}
.gs-group-header strong {
font-size: 13px;
font-weight: 800;
color: #1E293B;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
letter-spacing: -0.1px;
}
.gs-manage-fields-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 14px 16px;
}
.gs-manage-field.full-width {
grid-column: span 2;
}
@media (max-width: 640px) {
.gs-manage-fields-grid {
grid-template-columns: 1fr;
}
.gs-manage-field.full-width {
grid-column: span 1;
}
.gs-manage-route-summary {
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
.gs-manage-route-connector {
padding: 4px 0;
}
}
.gs-manage-field label {
display: block;
font-size: 12px;
font-weight: 700;
color: #334155;
margin-bottom: 6px;
}
.gs-field-input-box {
position: relative;
display: flex;
align-items: center;
}
.gs-input-prefix-icon {
position: absolute;
left: 12px;
font-size: 15px;
color: #94A3B8;
pointer-events: none;
z-index: 2;
}
.gs-field-input-box input,
.gs-field-input-box select,
.gs-field-input-box textarea {
width: 100% !important;
padding: 10px 12px 10px 38px !important;
border: 1.5px solid #CBD5E1 !important;
border-radius: 9px !important;
font-size: 13.5px !important;
font-weight: 600 !important;
color: #0F172A !important;
background: #FFFFFF !important;
box-sizing: border-box !important;
outline: none !important;
transition: all 0.15s ease !important;
}
.gs-field-input-box.textarea-box textarea {
padding: 10px 12px !important;
min-height: 80px !important;
}
.gs-field-input-box input::placeholder,
.gs-field-input-box textarea::placeholder,
.gs-manage-container input::placeholder,
.gs-manage-container textarea::placeholder {
color: #94A3B8 !important;
font-weight: 400 !important;
opacity: 0.65 !important;
}
.gs-field-input-box input::-webkit-input-placeholder,
.gs-field-input-box textarea::-webkit-input-placeholder,
.gs-manage-container input::-webkit-input-placeholder,
.gs-manage-container textarea::-webkit-input-placeholder {
color: #94A3B8 !important;
font-weight: 400 !important;
opacity: 0.65 !important;
}
.gs-field-input-box input::-moz-placeholder,
.gs-field-input-box textarea::-moz-placeholder,
.gs-manage-container input::-moz-placeholder,
.gs-manage-container textarea::-moz-placeholder {
color: #94A3B8 !important;
font-weight: 400 !important;
opacity: 0.65 !important;
}
.gs-field-input-box input:-ms-input-placeholder,
.gs-field-input-box textarea:-ms-input-placeholder,
.gs-manage-container input:-ms-input-placeholder,
.gs-manage-container textarea:-ms-input-placeholder {
color: #94A3B8 !important;
font-weight: 400 !important;
opacity: 0.65 !important;
}
.gs-field-input-box input:focus,
.gs-field-input-box select:focus,
.gs-field-input-box textarea:focus {
border-color: #0066FF !important;
background: #FFFFFF !important;
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.14) !important;
}
.gs-field-input-box.is-readonly input,
.gs-field-input-box input[disabled],
.gs-field-input-box textarea[disabled] {
background: #F8FAFC !important;
color: #64748B !important;
border-color: #E2E8F0 !important;
cursor: not-allowed !important;
} .gs-field-input-box input.gs-manage-flatpickr-date,
.gs-field-input-box input.gs-manage-flatpickr-time,
.gs-manage-container input.flatpickr-input {
cursor: pointer !important;
background: #FFFFFF !important;
color: #0F172A !important;
}
.gs-field-input-box input.gs-manage-flatpickr-date:hover,
.gs-field-input-box input.gs-manage-flatpickr-time:hover,
.gs-manage-container input.flatpickr-input:hover {
border-color: #0066FF !important;
}
.gs-field-input-box input.gs-manage-flatpickr-date[disabled],
.gs-field-input-box input.gs-manage-flatpickr-time[disabled],
.gs-manage-container input.flatpickr-input[disabled] {
cursor: not-allowed !important;
background: #F8FAFC !important;
color: #64748B !important;
border-color: #E2E8F0 !important;
}
.gs-lock-indicator {
position: absolute;
right: 12px;
font-size: 13px;
color: #94A3B8;
pointer-events: none;
}
.gs-field-hint {
display: block;
font-size: 11px;
color: #94A3B8;
margin-top: 4px;
} .gs-manage-edit-actions {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 14px;
margin-top: 22px;
padding: 16px 20px;
background: #F8FAFC;
border: 1px solid #E2E8F0;
border-radius: 12px;
}
.gs-action-left {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
.gs-manage-btn-save {
background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
color: #FFFFFF;
border: 1px solid #334155;
padding: 12px 24px;
border-radius: 9px;
font-size: 14px;
font-weight: 800;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 8px;
transition: all 0.2s ease;
box-shadow: 0 4px 14px rgba(15, 23, 42, 0.25);
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-btn-save:hover {
background: linear-gradient(135deg, #0066FF 0%, #0052CC 100%);
border-color: #0066FF;
transform: translateY(-1px);
box-shadow: 0 6px 18px rgba(0, 102, 255, 0.35);
}
.gs-manage-btn-save.loading {
opacity: 0.7;
pointer-events: none;
}
.gs-manage-status-msg {
font-size: 13px;
font-weight: 700;
padding: 6px 12px;
border-radius: 6px;
}
.gs-manage-status-msg.success { background: #DCFCE7; color: #166534; border: 1px solid #BBF7D0; }
.gs-manage-status-msg.danger  { background: #FEE2E2; color: #991B1B; border: 1px solid #FECACA; }
.gs-action-hint {
font-size: 12px;
color: #64748B;
font-weight: 600;
} .gs-manage-side-card {
background: #FFFFFF;
border: 1px solid #E2E8F0;
border-radius: 18px;
box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.05);
padding: 22px;
margin-bottom: 22px;
}
.gs-manage-side-title {
margin: 0;
font-size: 14px;
font-weight: 800;
color: #0F172A;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
text-transform: uppercase;
letter-spacing: 0.5px;
} .gs-manage-voucher-card {
background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
color: #FFFFFF;
border: 1px solid #334155;
box-shadow: 0 8px 24px -4px rgba(15, 23, 42, 0.25);
}
.gs-manage-voucher-head {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 10px;
}
.gs-manage-voucher-icon {
font-size: 26px;
width: 44px;
height: 44px;
background: rgba(255, 255, 255, 0.10);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
}
.gs-manage-voucher-head h4 {
margin: 0;
color: #FFFFFF;
font-size: 15.5px;
font-weight: 800;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-voucher-sub {
font-size: 10px;
font-weight: 800;
color: #94A3B8;
letter-spacing: 0.6px;
text-transform: uppercase;
}
.gs-manage-voucher-card p {
font-size: 13px;
color: #94A3B8;
line-height: 1.5;
margin: 0 0 18px;
}
.gs-manage-btn-voucher {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
width: 100%;
background: linear-gradient(135deg, #0066FF 0%, #0052CC 100%);
color: #FFFFFF !important;
text-decoration: none;
font-size: 14px;
font-weight: 800;
padding: 12px 18px;
border-radius: 10px;
transition: all 0.2s ease;
box-sizing: border-box;
box-shadow: 0 4px 14px rgba(0, 102, 255, 0.35);
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-btn-voucher:hover {
background: linear-gradient(135deg, #0052CC 0%, #003D99 100%);
transform: translateY(-1px);
box-shadow: 0 6px 20px rgba(0, 102, 255, 0.45);
} .gs-fin-header,
.gs-cancel-header,
.gs-support-header {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 14px;
padding-bottom: 10px;
border-bottom: 1px solid #F1F5F9;
}
.gs-fin-icon,
.gs-cancel-icon,
.gs-support-icon {
font-size: 18px;
}
.gs-manage-fin-row {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 14px;
padding: 7px 0;
color: #64748B;
}
.gs-fin-lbl {
font-weight: 600;
}
.gs-fin-val {
color: #0F172A;
font-weight: 800;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-fin-green {
color: #10B981;
font-weight: 800;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-fin-total {
border-top: 1.5px solid #F1F5F9;
margin-top: 8px;
padding-top: 12px;
font-size: 14.5px;
color: #0F172A;
}
.gs-fin-total-lbl {
font-weight: 700;
}
.gs-manage-fin-due {
color: #0066FF;
font-size: 20px;
font-weight: 900;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-fin-meta {
margin-top: 16px;
padding-top: 14px;
border-top: 1px dashed #E2E8F0;
display: flex;
justify-content: space-between;
align-items: center;
font-size: 12.5px;
}
.gs-fin-meta-item small {
display: block;
color: #94A3B8;
font-size: 10.5px;
text-transform: uppercase;
font-weight: 700;
letter-spacing: 0.4px;
margin-bottom: 2px;
}
.gs-meta-bold {
font-weight: 700;
color: #1E293B;
}
.gs-manage-badge-pay {
font-size: 10.5px;
font-weight: 800;
padding: 3px 8px;
border-radius: 5px;
letter-spacing: 0.4px;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-badge-pay.paid { background: #DCFCE7; color: #166534; border: 1px solid #BBF7D0; }
.gs-manage-badge-pay.unpaid { background: #FEF3C7; color: #92400E; border: 1px solid #FDE68A; } .gs-manage-policy-box {
display: flex;
align-items: flex-start;
gap: 12px;
padding: 14px 16px;
border-radius: 12px;
font-size: 13px;
line-height: 1.45;
margin-bottom: 16px;
}
.gs-manage-policy-box.status-eligible {
background: #F0FDF4;
border: 1px solid #BBF7D0;
color: #166534;
}
.gs-manage-policy-box.status-locked {
background: #FFFBEB;
border: 1px solid #FDE68A;
color: #92400E;
}
.gs-manage-policy-box.status-cancelled {
background: #FEF2F2;
border: 1px solid #FECACA;
color: #991B1B;
}
.gs-manage-policy-info strong {
display: block;
font-size: 13.5px;
font-weight: 800;
margin-bottom: 3px;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-btn-cancel-trigger {
width: 100%;
background: #FFFFFF;
color: #DC2626;
border: 1.5px solid #FCA5A5;
padding: 11px 18px;
border-radius: 9px;
font-size: 13.5px;
font-weight: 700;
cursor: pointer;
transition: all 0.15s ease;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-btn-cancel-trigger:hover {
background: #FEF2F2;
border-color: #EF4444;
}
.gs-manage-urgent-support {
display: flex;
flex-direction: column;
gap: 8px;
}
.gs-manage-btn-support-call {
display: flex;
align-items: center;
justify-content: center;
background: #0F172A;
color: #FFFFFF !important;
text-decoration: none;
font-size: 13px;
font-weight: 700;
padding: 10px;
border-radius: 8px;
}
.gs-manage-btn-support-mail {
display: flex;
align-items: center;
justify-content: center;
background: #F1F5F9;
color: #334155 !important;
text-decoration: none;
font-size: 12.5px;
font-weight: 600;
padding: 9px;
border-radius: 8px;
} .gs-support-desc {
font-size: 13px;
color: #64748B;
line-height: 1.45;
margin: 0 0 14px;
}
.gs-support-actions {
display: flex;
flex-direction: column;
gap: 8px;
}
.gs-btn-support-wa {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
background: #25D366;
color: #FFFFFF !important;
text-decoration: none;
font-size: 13.5px;
font-weight: 800;
padding: 11px 16px;
border-radius: 9px;
transition: background 0.15s ease;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
box-shadow: 0 3px 10px rgba(37, 211, 102, 0.25);
}
.gs-btn-support-wa:hover {
background: #1EBE5D;
}
.gs-btn-support-phone {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
background: #F8FAFC;
color: #0F172A !important;
border: 1px solid #CBD5E1;
text-decoration: none;
font-size: 13px;
font-weight: 700;
padding: 10px 16px;
border-radius: 9px;
transition: all 0.15s ease;
}
.gs-btn-support-phone:hover {
background: #F1F5F9;
border-color: #94A3B8;
} .gs-manage-modal-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(15, 23, 42, 0.65);
backdrop-filter: blur(4px);
z-index: 9999999;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
box-sizing: border-box;
}
.gs-manage-modal-box {
background: #FFFFFF;
border-radius: 18px;
max-width: 520px;
width: 100%;
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
padding: 28px 30px;
box-sizing: border-box;
animation: gsManageModalIn 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes gsManageModalIn {
from { opacity: 0; transform: scale(0.94); }
to { opacity: 1; transform: scale(1); }
}
.gs-manage-modal-header {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 16px;
position: relative;
}
.gs-manage-modal-alert-icon {
font-size: 28px;
width: 46px;
height: 46px;
border-radius: 12px;
background: #FEF2F2;
border: 1px solid #FECACA;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.gs-manage-modal-header h3 {
margin: 0;
font-size: 18px;
font-weight: 800;
color: #0F172A;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-modal-sub {
font-size: 10.5px;
font-weight: 800;
color: #DC2626;
letter-spacing: 0.6px;
text-transform: uppercase;
}
.gs-manage-modal-close {
position: absolute;
right: 0;
top: -2px;
background: none;
border: none;
font-size: 26px;
color: #94A3B8;
cursor: pointer;
line-height: 1;
}
.gs-manage-modal-body p {
font-size: 14px;
color: #475569;
line-height: 1.55;
margin: 0 0 16px;
}
.gs-manage-select {
width: 100% !important;
padding: 10px 12px !important;
border: 1.5px solid #CBD5E1 !important;
border-radius: 8px !important;
font-size: 13.5px !important;
color: #0F172A !important;
background: #FFFFFF !important;
outline: none !important;
}
.gs-manage-modal-footer {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 12px;
margin-top: 24px;
padding-top: 18px;
border-top: 1px solid #F1F5F9;
}
.gs-manage-btn-secondary {
background: #F1F5F9;
color: #334155;
border: none;
padding: 11px 20px;
border-radius: 9px;
font-size: 13.5px;
font-weight: 700;
cursor: pointer;
}
.gs-manage-btn-danger {
background: #DC2626;
color: #FFFFFF;
border: none;
padding: 11px 22px;
border-radius: 9px;
font-size: 13.5px;
font-weight: 800;
cursor: pointer;
transition: background 0.15s ease;
font-family: var(--gs-font-title, 'Montserrat', sans-serif);
}
.gs-manage-btn-danger:hover {
background: #B91C1C;
} .gs-otp-container {
text-align: center;
padding: 10px 0 20px;
}
.gs-otp-badge {
width: 64px;
height: 64px;
line-height: 64px;
background: #EFF6FF;
border: 2px solid #BFDBFE;
color: #0066FF;
font-size: 30px;
border-radius: 50%;
margin: 0 auto 16px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 14px rgba(0, 102, 255, 0.12);
}
.gs-otp-digit-wrap {
display: flex;
justify-content: center;
margin: 22px 0 16px;
}
.gs-otp-digit-input {
width: 100%;
max-width: 260px;
height: 62px;
font-family: 'SF Mono', Consolas, Monaco, monospace;
font-size: 32px;
font-weight: 900;
letter-spacing: 12px;
text-align: center;
padding-left: 20px;
color: #0066FF;
background: #F8FAFC;
border: 2px solid #CBD5E1;
border-radius: 12px;
outline: none;
transition: all 0.2s ease;
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.04);
}
.gs-otp-digit-input:focus {
border-color: #0066FF;
background: #FFFFFF;
box-shadow: 0 0 0 4px rgba(0, 102, 255, 0.15);
}
.gs-otp-meta-actions {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
margin-top: 18px;
}
.gs-manage-link-btn {
background: none;
border: none;
color: #0066FF;
font-size: 13.5px;
font-weight: 700;
cursor: pointer;
padding: 4px 8px;
text-decoration: underline;
transition: color 0.15s ease;
}
.gs-manage-link-btn:hover {
color: #004ecc;
}
.gs-manage-link-btn:disabled {
color: #94A3B8;
cursor: not-allowed;
text-decoration: none;
}
.gs-otp-back-wrap {
margin-top: 8px;
} .gs-manage-pax-lug-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 12px;
width: 100%;
}
@media (max-width: 640px) {
.gs-manage-pax-lug-grid {
grid-template-columns: 1fr;
gap: 10px;
}
}
.gs-manage-seats-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 12px;
margin-top: 8px;
width: 100%;
}
@media (max-width: 640px) {
.gs-manage-seats-grid {
grid-template-columns: 1fr;
gap: 10px;
}
}
.gs-manage-seat-card {
background: #F8FAFC;
border: 1.5px solid #E2E8F0;
border-radius: 10px;
padding: 12px 14px;
transition: all 0.2s ease;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.gs-manage-seat-card.has-selected {
background: #F0FDF4;
border-color: #86EFAC;
}
.gs-seat-card-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 8px;
}
.gs-seat-card-title {
font-size: 13px;
font-weight: 700;
color: #0F172A;
margin: 0 0 2px;
}
.gs-seat-card-sub {
font-size: 11.5px;
color: #64748B;
display: block;
}
.gs-seat-card-counter {
display: flex;
align-items: center;
gap: 8px;
margin-top: 4px;
}
.gs-seat-counter-btn {
width: 32px;
height: 32px;
border-radius: 7px;
border: 1.5px solid #CBD5E1;
background: #FFFFFF;
color: #0F172A;
font-size: 16px;
font-weight: 800;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
transition: all 0.15s ease;
padding: 0;
line-height: 1;
}
.gs-seat-counter-btn:hover:not(:disabled) {
background: #0066FF;
border-color: #0066FF;
color: #FFFFFF;
}
.gs-seat-counter-btn:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.gs-seat-counter-val {
width: 48px;
text-align: center;
font-size: 14px;
font-weight: 800;
color: #0F172A;
border: 1.5px solid #CBD5E1;
border-radius: 7px;
padding: 5px 0;
background: #FFFFFF;
}
.gs-seat-status-tag {
display: inline-flex;
align-items: center;
gap: 5px;
font-size: 11px;
font-weight: 700;
padding: 2px 7px;
border-radius: 6px;
background: #DCFCE7;
color: #166534;
} input::placeholder,
textarea::placeholder,
.getseat-booking-container input::placeholder,
.getseat-booking-container textarea::placeholder,
.gs-unified-panel input::placeholder,
.gs-unified-panel textarea::placeholder,
.gs-manage-container input::placeholder,
.gs-manage-container textarea::placeholder,
.gs-sbb-container input::placeholder,
.gs-sbb-container textarea::placeholder,
#getseat-quick-search input::placeholder,
#getseat-quick-search textarea::placeholder,
.gs-portal-card input::placeholder,
.gs-portal-card textarea::placeholder,
input.gs-autocomplete-input::placeholder,
input.flatpickr-input::placeholder,
input.gs-bl-flatpickr-input::placeholder,
.gs-bl-col-content input::placeholder {
color: #94A3B8 !important;
font-weight: 400 !important;
font-style: normal !important;
opacity: 0.65 !important;
-webkit-text-fill-color: #94A3B8 !important;
letter-spacing: normal !important;
text-transform: none !important;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
.getseat-booking-container input::-webkit-input-placeholder,
.getseat-booking-container textarea::-webkit-input-placeholder,
.gs-unified-panel input::-webkit-input-placeholder,
.gs-unified-panel textarea::-webkit-input-placeholder,
.gs-manage-container input::-webkit-input-placeholder,
.gs-manage-container textarea::-webkit-input-placeholder,
.gs-sbb-container input::-webkit-input-placeholder,
.gs-sbb-container textarea::-webkit-input-placeholder,
#getseat-quick-search input::-webkit-input-placeholder,
#getseat-quick-search textarea::-webkit-input-placeholder,
.gs-portal-card input::-webkit-input-placeholder,
.gs-portal-card textarea::-webkit-input-placeholder,
input.gs-autocomplete-input::-webkit-input-placeholder,
input.flatpickr-input::-webkit-input-placeholder,
input.gs-bl-flatpickr-input::-webkit-input-placeholder,
.gs-bl-col-content input::-webkit-input-placeholder {
color: #94A3B8 !important;
font-weight: 400 !important;
font-style: normal !important;
opacity: 0.65 !important;
-webkit-text-fill-color: #94A3B8 !important;
letter-spacing: normal !important;
text-transform: none !important;
}
input::-moz-placeholder,
textarea::-moz-placeholder,
.getseat-booking-container input::-moz-placeholder,
.getseat-booking-container textarea::-moz-placeholder,
.gs-unified-panel input::-moz-placeholder,
.gs-unified-panel textarea::-moz-placeholder,
.gs-manage-container input::-moz-placeholder,
.gs-manage-container textarea::-moz-placeholder,
.gs-sbb-container input::-moz-placeholder,
.gs-sbb-container textarea::-moz-placeholder,
#getseat-quick-search input::-moz-placeholder,
#getseat-quick-search textarea::-moz-placeholder,
.gs-portal-card input::-moz-placeholder,
.gs-portal-card textarea::-moz-placeholder,
input.gs-autocomplete-input::-moz-placeholder,
input.flatpickr-input::-moz-placeholder,
input.gs-bl-flatpickr-input::-moz-placeholder,
.gs-bl-col-content input::-moz-placeholder {
color: #94A3B8 !important;
font-weight: 400 !important;
font-style: normal !important;
opacity: 0.65 !important;
letter-spacing: normal !important;
text-transform: none !important;
} .getseat-route-highlights {
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 10px !important;
width: 100% !important;
margin: 15px 0 25px 0 !important;
box-sizing: border-box !important;
}
@media (max-width: 768px) {
.getseat-route-highlights {
grid-template-columns: repeat(2, 1fr) !important;
gap: 8px !important;
margin: 10px 0 20px 0 !important;
}
}
@media (max-width: 340px) {
.getseat-route-highlights {
grid-template-columns: 1fr !important;
}
}
.route-highlight-card {
background: #ffffff !important;
border: 1px solid #e2e8f0 !important;
border-radius: 8px !important;
padding: 10px 10px !important;
display: flex !important;
align-items: center !important;
gap: 8px !important;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03) !important;
box-sizing: border-box !important;
min-width: 0 !important;
}
.route-highlight-card .highlight-icon {
font-size: 18px !important;
width: 34px !important;
height: 34px !important;
min-width: 34px !important;
background: #f1f5f9 !important;
border-radius: 6px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.route-highlight-card.highlight-card-pricing .highlight-icon {
background: #ecfdf5 !important;
}
.route-highlight-card .highlight-content {
min-width: 0 !important;
line-height: 1.25 !important;
overflow: hidden !important;
}
.route-highlight-card .highlight-label {
font-size: 10.5px !important;
color: #64748b !important;
text-transform: uppercase !important;
font-weight: 600 !important;
display: block !important;
white-space: nowrap !important;
}
.route-highlight-card .highlight-value {
font-size: 13.5px !important;
color: #0f172a !important;
display: block !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
.route-highlight-card.highlight-card-pricing .highlight-label {
color: #059669 !important;
}
.route-highlight-card.highlight-card-pricing .highlight-value {
color: #047857 !important;
}
.route-highlight-card .highlight-sub {
font-size: 10.5px !important;
color: #94a3b8 !important;
display: block !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
.route-highlight-card.highlight-card-pricing .highlight-sub {
color: #10b981 !important;
} .gs-fin-dashboard {
width: 100%;
} .gs-fin-kpi-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
margin-bottom: 24px;
}
.gs-fin-card {
background: #FFFFFF;
border: 1.5px solid #E2E8F0;
border-radius: 14px;
padding: 20px 22px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
position: relative;
overflow: hidden;
transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.gs-fin-card:hover {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
border-color: #CBD5E1;
}
.gs-fin-card-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 8px;
}
.gs-fin-card-title {
font-size: 12.5px;
font-weight: 700;
color: #64748B;
text-transform: uppercase;
letter-spacing: 0.5px;
display: flex;
align-items: center;
gap: 6px;
}
.gs-fin-card-icon {
width: 28px;
height: 28px;
border-radius: 8px;
display: inline-flex;
align-items: center;
justify-content: center;
}
.gs-fin-card-value {
font-size: 28px;
font-weight: 900;
line-height: 1.15;
color: #0F172A;
margin-bottom: 6px;
letter-spacing: -0.5px;
}
.gs-fin-card-sub {
font-size: 12px;
color: #64748B;
font-weight: 500;
line-height: 1.35;
} .gs-fin-card-receivables {
background: #FFFFFF;
border: 2px solid #10B981;
color: #0F172A;
box-shadow: 0 4px 14px rgba(16, 185, 129, 0.1);
}
.gs-fin-card-receivables .gs-fin-card-title {
color: #065F46;
}
.gs-fin-card-receivables .gs-fin-card-value {
color: #059669;
}
.gs-fin-card-receivables .gs-fin-card-sub {
color: #64748B;
}
.gs-fin-card-receivables .gs-fin-card-icon {
background: #ECFDF5;
color: #059669;
}
.gs-fin-card-net .gs-fin-card-value {
color: #0066FF;
}
.gs-fin-card-net .gs-fin-card-icon {
background: #EFF6FF;
color: #0066FF;
}
.gs-fin-card-gross .gs-fin-card-icon {
background: #F8FAFC;
color: #475569;
}
.gs-fin-card-rides .gs-fin-card-icon {
background: #F5F3FF;
color: #7C3AED;
} .gs-fin-settlement-banner {
background: #F8FAFC;
border: 1.5px solid #E2E8F0;
border-radius: 12px;
padding: 16px 20px;
margin-bottom: 24px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
flex-wrap: wrap;
}
.gs-fin-settlement-left {
display: flex;
align-items: center;
gap: 12px;
}
.gs-fin-settlement-icon {
width: 38px;
height: 38px;
border-radius: 10px;
background: #EFF6FF;
color: #0066FF;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.gs-fin-settlement-text strong {
color: #0F172A;
font-size: 14px;
display: block;
margin-bottom: 2px;
}
.gs-fin-settlement-text span {
color: #64748B;
font-size: 12.5px;
}
.gs-fin-settlement-pills {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.gs-fin-pill {
background: #FFFFFF;
border: 1px solid #CBD5E1;
border-radius: 8px;
padding: 6px 12px;
font-size: 12px;
color: #334155;
font-weight: 700;
display: inline-flex;
align-items: center;
gap: 6px;
}
.gs-fin-pill.is-highlight {
background: #ECFDF5;
border-color: #A7F3D0;
color: #065F46;
} .gs-fin-toolbar {
background: #FFFFFF;
border: 1.5px solid #E2E8F0;
border-radius: 14px 14px 0 0;
padding: 16px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
flex-wrap: wrap;
border-bottom: 1px solid #E2E8F0;
}
.gs-fin-filters-group {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.gs-fin-select {
background: #F8FAFC;
border: 1.5px solid #CBD5E1;
border-radius: 8px;
padding: 8px 12px;
font-size: 13px;
font-weight: 600;
color: #1E293B;
cursor: pointer;
outline: none;
transition: border-color 0.2s;
}
.gs-fin-select:focus {
border-color: #0066FF;
background: #FFFFFF;
}
.gs-fin-search-input {
background: #F8FAFC;
border: 1.5px solid #CBD5E1;
border-radius: 8px;
padding: 8px 14px;
font-size: 13px;
color: #1E293B;
outline: none;
min-width: 200px;
}
.gs-fin-search-input:focus {
border-color: #0066FF;
background: #FFFFFF;
} .gs-fin-table-wrapper {
background: #FFFFFF;
border: 1.5px solid #E2E8F0;
border-top: none;
border-radius: 0 0 14px 14px;
overflow-x: auto;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
}
.gs-fin-table {
width: 100%;
border-collapse: collapse;
text-align: left;
font-size: 13.5px;
}
.gs-fin-table th {
background: #F8FAFC;
padding: 14px 16px;
font-size: 11.5px;
font-weight: 800;
color: #64748B;
text-transform: uppercase;
letter-spacing: 0.6px;
border-bottom: 1.5px solid #E2E8F0;
white-space: nowrap;
}
.gs-fin-table td {
padding: 14px 16px;
border-bottom: 1px solid #F1F5F9;
color: #1E293B;
vertical-align: middle;
}
.gs-fin-table tr:hover td {
background: #F8FAFC;
}
.gs-fin-table tr:last-child td {
border-bottom: none;
} .gs-fin-code-pill {
background: #F1F5F9;
color: #0F172A;
font-weight: 800;
font-size: 12px;
padding: 3px 8px;
border-radius: 6px;
letter-spacing: 0.5px;
display: inline-block;
}
.gs-fin-datetime {
font-size: 13px;
font-weight: 700;
color: #0F172A;
}
.gs-fin-datetime small {
display: block;
font-size: 11.5px;
color: #64748B;
font-weight: normal;
}
.gs-fin-route-cell {
max-width: 220px;
line-height: 1.35;
}
.gs-fin-route-from {
font-weight: 700;
color: #0F172A;
font-size: 13px;
}
.gs-fin-route-to {
color: #475569;
font-size: 12px;
}
.gs-fin-veh-tag {
font-weight: 800;
font-size: 11.5px;
background: #0F172A;
color: #FFFFFF;
padding: 2px 6px;
border-radius: 4px;
letter-spacing: 0.8px;
display: inline-block;
margin-right: 4px;
}
.gs-fin-amount-gross {
font-size: 13.5px;
font-weight: 700;
color: #475569;
}
.gs-fin-amount-comm {
font-size: 12px;
color: #DC2626;
font-weight: 600;
}
.gs-fin-amount-net {
font-size: 15px;
font-weight: 900;
color: #0066FF;
} .gs-fin-badge-receivable {
background: #ECFDF5;
color: #065F46;
border: 1px solid #A7F3D0;
padding: 4px 10px;
border-radius: 8px;
font-size: 11.5px;
font-weight: 800;
display: inline-flex;
align-items: center;
gap: 4px;
white-space: nowrap;
}
.gs-fin-badge-cash {
background: #FFFBEB;
color: #92400E;
border: 1px solid #FDE68A;
padding: 4px 10px;
border-radius: 8px;
font-size: 11.5px;
font-weight: 700;
display: inline-flex;
align-items: center;
gap: 4px;
white-space: nowrap;
}
.gs-fin-action-btn {
background: #0F172A;
color: #FFFFFF;
border: none;
border-radius: 6px;
padding: 6px 12px;
font-size: 11.5px;
font-weight: 700;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 4px;
transition: background 0.2s;
white-space: nowrap;
}
.gs-fin-action-btn:hover {
background: #1E293B;
color: #FFFFFF;
} @media (max-width: 860px) {
.gs-fin-kpi-grid {
grid-template-columns: 1fr;
gap: 12px;
}
.gs-fin-card {
padding: 16px 18px;
}
.gs-fin-card-value {
font-size: 24px;
}
.gs-fin-toolbar {
flex-direction: column;
align-items: stretch;
}
.gs-fin-filters-group {
flex-direction: column;
align-items: stretch;
}
.gs-fin-select, .gs-fin-search-input {
width: 100%;
min-width: unset;
}
.gs-fin-settlement-banner {
flex-direction: column;
align-items: flex-start;
}
}.wd-header-overlap:where(:not(.single-product)) .wd-content-layout:first-child{padding-top:0}.whb-overcontent{min-height:.2px}.whb-overcontent .whb-main-header{position:absolute}body:not(.single-product) .whb-overcontent,.whb-overcontent.whb-custom-header{margin-bottom:0;padding-top:0 !important}@media(min-width: 1025px){.wd-header-overlap .wd-page-title{padding-top:calc(var(--wd-header-h) + var(--wd-header-boxed-sp, 0.001px) + var(--wd-title-sp))}.single-product .whb-overcontent:not(.whb-custom-header){padding-top:calc(var(--wd-header-h) + var(--wd-header-boxed-sp, 0.001px))}}@media(max-width: 1024px){.wd-header-overlap .wd-page-title{padding-top:calc(var(--wd-header-sm-h) + var(--wd-title-sp))}.single-product .whb-overcontent:not(.whb-custom-header){padding-top:var(--wd-header-sm-h)}}.wd-header-search{--wd-tools-icon: "\f130"}.wd-header-search:is(.wd-design-6.wd-with-wrap,.wd-design-7.wd-with-wrap,.wd-design-8){min-width:var(--wd-tools-icon-base-width)}.title-wrapper{--wd-mb: 10px}.title-wrapper [class*=title]{display:inline-block}.title-wrapper .title{margin-bottom:0}.title-wrapper .img-wrapper{display:block;margin-top:10px}.subtitle-color-black.subtitle-style-default{color:#000}.subtitle-color-black.subtitle-style-background{background-color:#333;color:#fff}.subtitle-color-white.subtitle-style-default{color:rgba(255,255,255,.8)}.subtitle-color-white.subtitle-style-background{background-color:rgba(255,255,255,.8);color:#242424}.subtitle-color-gradient.subtitle-style-default{color:var(--color-gray-400)}.subtitle-color-gradient.subtitle-style-background{background-color:#f1f1f1;color:#333}.wd-title-color-default{--el-title-color: rgba(0, 0, 0, 0.105)}.wd-title-color-primary{--el-title-color: var(--wd-primary-color)}.wd-title-color-alt{--el-title-color: var(--wd-alternative-color)}.wd-title-color-black{--el-title-color: #000}.wd-title-color-white{color:var(--wd-text-color);--wd-text-color: rgba(255, 255, 255, 0.8);--wd-title-color: #FFF;--el-title-color: #FFF}.wd-title-color-gradient .title{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0)}.wd-title-style-shadow{padding:25px;border-radius:var(--wd-brd-radius);box-shadow:0 0 8px rgba(0,0,0,.12)}.wpb-js-composer .title-wrapper{--content-width: var(--wd-max-width)}.wpb-js-composer .title-wrapper [class*=title]{max-width:var(--content-width)}.wpb-js-composer .title-wrapper.wd-title-empty .liner-continer{margin-bottom:0}.wpb-js-composer .title-wrapper.wd-title-empty .liner-continer .title{display:none}@media(max-width: 1024px){.title-subtitle.wd-fontsize-m,.title-after_title.wd-fontsize-s{font-size:14px}}@media(max-width: 576px){.title-wrapper .title-subtitle{font-size:12px}.title-wrapper .title{font-size:20px}}[class*=wd-underline] :is(u,.wd-highlight){text-decoration:none}[class*=wd-underline-colored] :is(u,.wd-highlight){color:var(--wd-primary-color)}.wd-underline-colored-alt :is(u,.wd-highlight){font-family:var(--wd-alternative-font);font-style:var(--wd-alternative-font-style)}.wd-underline-bordered :is(u,.wd-highlight){text-decoration:underline 3px solid var(--wd-primary-color);text-underline-offset:.25em}.wd-underline-gradient :is(u,.wd-highlight){-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);background-color:currentColor}.subtitle-style-background[class*=subtitle]{display:inline-block;padding:6px 10px;font-weight:600;line-height:1.2;font-size:14px;border-radius:calc(var(--wd-brd-radius)/1.5)}.subtitle-color-default.subtitle-style-default{color:var(--color-gray-400)}.subtitle-color-default.subtitle-style-background{background-color:#f1f1f1;color:#333}.subtitle-color-primary.subtitle-style-default{color:var(--wd-primary-color)}.subtitle-color-primary.subtitle-style-background{color:#fff;background-color:var(--wd-primary-color)}.subtitle-color-alt.subtitle-style-default{color:var(--wd-alternative-color)}.subtitle-color-alt.subtitle-style-background{color:#fff;background-color:var(--wd-alternative-color)}.wd-text-block:not(.inline-element){max-width:var(--content-width);--content-width: var(--wd-max-width)}.wd-text-block:not(.inline-element).text-left{margin-right:auto}.wd-text-block:not(.inline-element).text-center{margin-inline:auto}.wd-text-block:not(.inline-element).text-right{margin-left:auto}