)
Aesthetic: Levia Luxury Minimal (Cyan Glow, Plus Jakarta Sans & Outfit)
========================================================================= */
.lux-fluent-form-wrap {
width: 100%;
margin-top: 10px;
position: relative;
}
/* Reset form typography & layout */
.lux-fluent-form-wrap .fluentform,
.lux-fluent-form-wrap .fluentform-wrapper,
.lux-fluent-form-wrap form.fluent_form_3,
.lux-fluent-form-wrap .fluentform_3 {
font-family: var(--lx-font-body) !important;
color: var(--lx-dark) !important;
width: 100% !important;
}
.lux-fluent-form-wrap .fluentform .ff-el-group {
margin-bottom: 12px !important;
}
/* Multi-Column Container & Row Spacing (Fixes double bottom margin bug) */
.lux-fluent-form-wrap .fluentform .ff-t-container,
.lux-fluent-form-wrap .fluentform table.ff-t-container {
width: 100% !important;
margin: 0 0 12px 0 !important;
border-collapse: separate !important;
}
.lux-fluent-form-wrap .fluentform .ff-t-cell,
.lux-fluent-form-wrap .fluentform table.ff-t-container td.ff-t-cell {
padding: 0 8px !important;
vertical-align: top !important;
}
.lux-fluent-form-wrap .fluentform .ff-t-row .ff-t-cell:first-child,
.lux-fluent-form-wrap .fluentform table.ff-t-container td.ff-t-cell:first-child {
padding-left: 0 !important;
}
.lux-fluent-form-wrap .fluentform .ff-t-row .ff-t-cell:last-child,
.lux-fluent-form-wrap .fluentform table.ff-t-container td.ff-t-cell:last-child {
padding-right: 0 !important;
}
/* Crucial: zero out inner ff-el-group margin inside multi-column table cells to prevent stacked gaps */
.lux-fluent-form-wrap .fluentform .ff-t-cell .ff-el-group,
.lux-fluent-form-wrap .fluentform table.ff-t-container td.ff-t-cell .ff-el-group,
.lux-fluent-form-wrap .fluentform .ff-t-container .ff-el-group {
margin-bottom: 0 !important;
}
@media (max-width: 640px) {
.lux-fluent-form-wrap .fluentform .ff-t-cell,
.lux-fluent-form-wrap .fluentform table.ff-t-container td.ff-t-cell {
display: block !important;
width: 100% !important;
padding: 0 !important;
margin-bottom: 12px !important;
}
}
/* Form Labels */
.lux-fluent-form-wrap .fluentform .ff-el-input--label,
.lux-fluent-form-wrap .fluentform .ff-el-input--label label,
.lux-fluent-form-wrap .fluentform .ff-el-form-top label {
font-family: var(--lx-font-body) !important;
font-size: 13px !important;
font-weight: 700 !important;
color: #1E293B !important;
margin-bottom: 4px !important;
display: block !important;
line-height: 1.3 !important;
letter-spacing: -0.01em !important;
}
.lux-fluent-form-wrap .fluentform .ff-el-is-required .ff-el-input--label label::after,
.lux-fluent-form-wrap .fluentform .ff-el-input--label.ff-el-is-required label::after,
.lux-fluent-form-wrap .fluentform .text-danger,
.lux-fluent-form-wrap .fluentform .ff-el-input--label span.ff-el-is-required {
color: #EF4444 !important;
margin-left: 3px !important;
font-weight: 800 !important;
}
/* ── TACTILE BRAND SELECTOR CARDS (Compact Chips in Fluent Forms) ── */
.lux-fluent-form-wrap .fluentform .ff_checkbox_container,
.lux-fluent-form-wrap .fluentform .ff-el-form-check-elements,
.lux-fluent-form-wrap .fluentform .ff_checkable_input_container,
.lux-fluent-form-wrap .fluentform .ff-el-group:has(.ff-el-form-check) .ff-el-input--content {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 8px !important;
margin: 4px 0 0 0 !important;
}
@media (min-width: 640px) {
.lux-fluent-form-wrap .fluentform .ff_checkbox_container,
.lux-fluent-form-wrap .fluentform .ff-el-form-check-elements,
.lux-fluent-form-wrap .fluentform .ff_checkable_input_container,
.lux-fluent-form-wrap .fluentform .ff-el-group:has(.ff-el-form-check) .ff-el-input--content {
grid-template-columns: repeat(4, 1fr) !important;
}
}
/* Individual Checkbox Card (Sleek, Compact Height) */
.lux-fluent-form-wrap .fluentform .ff-el-form-check {
display: flex !important;
align-items: center !important;
gap: 0 !important;
padding: 0 !important;
min-height: 36px !important;
background: #F8FAFC !important;
background-color: #F8FAFC !important;
border: 1.5px solid #E2E8F0 !important;
border-radius: 8px !important;
cursor: pointer !important;
transition: all 0.2s ease !important;
user-select: none !important;
margin: 0 !important;
box-sizing: border-box !important;
box-shadow: 0 1px 3px rgba(11, 25, 44, 0.02) !important;
position: relative !important;
}
.lux-fluent-form-wrap .fluentform .ff-el-form-check:hover {
border-color: #00A3FF !important;
background: #FFFFFF !important;
background-color: #FFFFFF !important;
transform: translateY(-1px) !important;
box-shadow: 0 3px 10px rgba(0, 163, 255, 0.12) !important;
}
/* Active / Checked State */
.lux-fluent-form-wrap .fluentform .ff-el-form-check:has(input:checked),
.lux-fluent-form-wrap .fluentform .ff-el-form-check.is-active {
border-color: #00A3FF !important;
background: #EBF8FF !important;
background-color: #EBF8FF !important;
box-shadow: 0 3px 10px rgba(0, 163, 255, 0.18) !important;
transform: translateY(-1px) !important;
}
.lux-fluent-form-wrap .fluentform .ff-el-form-check-label {
margin: 0 !important;
font-size: 13px !important;
font-weight: 700 !important;
color: var(--lx-gray-800) !important;
cursor: pointer !important;
display: flex !important;
align-items: center !important;
gap: 8px !important;
width: 100% !important;
min-height: 33px !important;
padding: 6px 10px !important;
box-sizing: border-box !important;
line-height: 1.2 !important;
}
.lux-fluent-form-wrap .fluentform .ff-el-form-check:has(input:checked) .ff-el-form-check-label,
.lux-fluent-form-wrap .fluentform .ff-el-form-check:has(input:checked) span,
.lux-fluent-form-wrap .fluentform .ff-el-form-check.is-active .ff-el-form-check-label,
.lux-fluent-form-wrap .fluentform .ff-el-form-check.is-active span {
color: #0077CC !important;
font-weight: 800 !important;
}
.lux-fluent-form-wrap .fluentform .ff-el-form-check input[type="checkbox"],
.lux-fluent-form-wrap .fluentform .ff-el-form-check input[type="radio"] {
accent-color: #00A3FF !important;
width: 15px !important;
height: 15px !important;
cursor: pointer !important;
margin: 0 !important;
flex-shrink: 0 !important;
}
/* Text Inputs, Select, Numbers, Phones, Emails (Slim 40px Height) */
.lux-fluent-form-wrap .fluentform input[type="text"],
.lux-fluent-form-wrap .fluentform input[type="email"],
.lux-fluent-form-wrap .fluentform input[type="tel"],
.lux-fluent-form-wrap .fluentform input[type="url"],
.lux-fluent-form-wrap .fluentform input[type="number"],
.lux-fluent-form-wrap .fluentform input[type="password"],
.lux-fluent-form-wrap .fluentform select,
.lux-fluent-form-wrap .fluentform .ff-el-form-control:not(textarea) {
width: 100% !important;
min-height: 40px !important;
height: 40px !important;
padding: 7px 12px !important;
border: 1.5px solid #CBD5E1 !important;
border-radius: 8px !important;
font-size: 13.5px !important;
font-family: var(--lx-font-body) !important;
color: var(--lx-dark) !important;
background: #F8FAFC !important;
background-color: #F8FAFC !important;
transition: all 0.2s ease !important;
box-sizing: border-box !important;
box-shadow: none !important;
line-height: 1.4 !important;
}
.lux-fluent-form-wrap .fluentform select,
.lux-fluent-form-wrap .fluentform select.ff-el-form-control {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: right 14px center !important;
appearance: none !important;
-webkit-appearance: none !important;
padding-right: 36px !important;
}
/* Compact Textarea */
.lux-fluent-form-wrap .fluentform textarea,
.lux-fluent-form-wrap .fluentform textarea.ff-el-form-control {
width: 100% !important;
min-height: 72px !important;
height: 72px !important;
padding: 8px 12px !important;
border: 1.5px solid #CBD5E1 !important;
border-radius: 8px !important;
font-size: 13.5px !important;
font-family: var(--lx-font-body) !important;
color: var(--lx-dark) !important;
background: #F8FAFC !important;
background-color: #F8FAFC !important;
transition: all 0.2s ease !important;
box-sizing: border-box !important;
box-shadow: none !important;
line-height: 1.4 !important;
resize: vertical !important;
}
/* Focus States with Levia Cyan Glow */
.lux-fluent-form-wrap .fluentform input:focus,
.lux-fluent-form-wrap .fluentform select:focus,
.lux-fluent-form-wrap .fluentform textarea:focus,
.lux-fluent-form-wrap .fluentform .ff-el-form-control:focus {
outline: none !important;
border-color: #00A3FF !important;
background: #FFFFFF !important;
background-color: #FFFFFF !important;
box-shadow: 0 0 0 3px rgba(0, 163, 255, 0.18) !important;
}
.lux-fluent-form-wrap .fluentform ::placeholder {
color: var(--lx-gray-400) !important;
opacity: 1 !important;
}
/* Submit Button Container & Compact Levia Styling */
.lux-fluent-form-wrap .fluentform .ff-el-group.ff_submit_btn_wrapper,
.lux-fluent-form-wrap .fluentform .ff-el-group:has(.ff-btn-submit) {
margin-top: 14px !important;
margin-bottom: 6px !important;
text-align: center !important;
width: 100% !important;
}
.lux-fluent-form-wrap .fluentform button.ff-btn-submit,
.lux-fluent-form-wrap .fluentform .ff-btn-submit {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
min-height: 42px !important;
height: 42px !important;
padding: 8px 24px !important;
background: linear-gradient(135deg, #00A3FF 0%, #0088DD 100%) !important;
background-color: #00A3FF !important;
color: #FFFFFF !important;
border: none !important;
border-radius: 8px !important;
font-family: var(--lx-font-body) !important;
font-size: 14.5px !important;
font-weight: 700 !important;
letter-spacing: -0.01em !important;
cursor: pointer !important;
box-shadow: 0 4px 14px rgba(0, 163, 255, 0.3) !important;
transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
text-transform: none !important;
outline: none !important;
}
/* Submit Button Hover (Completely blocks WordPress pink!) */
.lux-fluent-form-wrap .fluentform button.ff-btn-submit:hover,
.lux-fluent-form-wrap .fluentform button.ff-btn-submit:focus,
.lux-fluent-form-wrap .fluentform .ff-btn-submit:hover,
.lux-fluent-form-wrap .fluentform .ff-btn-submit:focus {
background: linear-gradient(135deg, #1AB0FF 0%, #0077CC 100%) !important;
background-color: #008FE0 !important;
border-color: #008FE0 !important;
color: #FFFFFF !important;
transform: translateY(-1px) !important;
box-shadow: 0 6px 18px rgba(0, 163, 255, 0.4) !important;
}
.lux-fluent-form-wrap .fluentform button.ff-btn-submit:active,
.lux-fluent-form-wrap .fluentform .ff-btn-submit:active {
transform: scale(0.98) !important;
}
/* Loading State */
.lux-fluent-form-wrap .fluentform .ff-btn-loading {
opacity: 0.85 !important;
cursor: wait !important;
}
/* Error & Validation Notes */
.lux-fluent-form-wrap .fluentform .ff-errors-in-stack,
.lux-fluent-form-wrap .fluentform .text-danger,
.lux-fluent-form-wrap .fluentform .error {
font-size: 12px !important;
color: #EF4444 !important;
margin-top: 4px !important;
font-weight: 600 !important;
}
/* Submission Success Banner */
.lux-fluent-form-wrap .fluentform .ff-message-success,
.lux-fluent-form-wrap .fluentform .ff_message_success,
.lux-fluent-form-wrap .fluentform .fluentform-success-text,
.lux-fluent-form-wrap .fluentform .ff-success-message {
background: #F4FBEB !important;
background-color: #F4FBEB !important;
color: #365314 !important;
border: 1px solid #BEF264 !important;
border-radius: var(--lx-radius-md) !important;
padding: 16px 22px !important;
font-size: 14.5px !important;
font-weight: 600 !important;
text-align: center !important;
margin: 16px 0 !important;
box-shadow: 0 4px 14px rgba(54, 83, 20, 0.08) !important;
}
/* ── STICKY MOBILE BOTTOM DOCK (HIGH-CONTRAST & VIBRANT) ── */
.lux-mobile-dock {
position: fixed !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
z-index: 99999 !important;
background: rgba(255, 255, 255, 0.98) !important;
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
border-top: 1px solid #E2E8F0 !important;
padding: 10px 16px max(12px, env(safe-area-inset-bottom)) !important;
display: flex !important;
align-items: center !important;
gap: 12px !important;
box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.08) !important;
font-family: var(--lx-font-body) !important;
box-sizing: border-box !important;
}
@media (min-width: 768px) {
.lux-mobile-dock {
display: none !important;
}
}
.lux-dock-btn {
flex: 1 !important;
min-height: 48px !important;
padding: 10px 14px !important;
font-family: var(--lx-font-body) !important;
font-size: 13.5px !important;
font-weight: 800 !important;
letter-spacing: 0.01em !important;
border-radius: var(--lx-radius-pill) !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
text-decoration: none !important;
text-align: center !important;
border: none !important;
cursor: pointer !important;
transition: var(--lx-transition) !important;
box-sizing: border-box !important;
}
.lux-dock-btn:active {
transform: scale(0.96) !important;
}
/* Button 1: Inquire at Booth (Vibrant Cyan / Blue Gradient with White Text) */
.lux-dock-btn.btn-inquire {
background: linear-gradient(135deg, #00A3FF 0%, #0077CC 100%) !important;
color: #FFFFFF !important;
box-shadow: 0 4px 16px rgba(0, 163, 255, 0.35) !important;
border: 1px solid rgba(255, 255, 255, 0.25) !important;
}
.lux-dock-btn.btn-inquire:hover {
box-shadow: 0 6px 20px rgba(0, 163, 255, 0.45) !important;
}
/* Button 2: WhatsApp Us (Vibrant WhatsApp Green with White Text) */
.lux-dock-btn.btn-whatsapp {
background: linear-gradient(135deg, #25D366 0%, #128C7E 100%) !important;
color: #FFFFFF !important;
box-shadow: 0 4px 16px rgba(37, 211, 102, 0.35) !important;
border: 1px solid rgba(255, 255, 255, 0.25) !important;
}
.lux-dock-btn.btn-whatsapp:hover {
box-shadow: 0 6px 20px rgba(37, 211, 102, 0.45) !important;
}
/* Prevent duplicate/colliding theme bottom bar */
.levia-mobile-bottom-bar {
display: none !important;
}
/* ══════════════════════════════════════════════════════════
WORDPRESS THEME COLOR OVERRIDE
Blocks the theme's default purple/pink hover & focus on buttons
══════════════════════════════════════════════════════════ */
/* ── Brand tab pills ── */
.lux-scope button.lux-nav-pill,
.lux-scope button.lux-nav-pill:hover,
.lux-scope button.lux-nav-pill:focus,
.lux-scope button.lux-nav-pill:focus-visible,
.lux-scope button.lux-nav-pill:active {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
color: var(--lx-gray-700) !important;
border: none !important;
box-shadow: none !important;
outline: none !important;
text-decoration: none !important;
}
.lux-scope button.lux-nav-pill.active,
.lux-scope button.lux-nav-pill.active:hover,
.lux-scope button.lux-nav-pill.active:focus,
.lux-scope button.lux-nav-pill.active:focus-visible,
.lux-scope button.lux-nav-pill.active:active {
background: #FFFFFF !important;
background-color: #FFFFFF !important;
color: var(--lx-blue) !important;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1) !important;
}
.lux-scope button.lux-nav-pill.pill-all.active,
.lux-scope button.lux-nav-pill.pill-all.active:hover,
.lux-scope button.lux-nav-pill.pill-all.active:focus {
color: var(--lx-dark) !important;
}
/* ── Previous / Next arrow buttons ── */
.lux-scope button.lux-tab-arrow-btn,
.lux-scope button.lux-tab-arrow-btn:focus,
.lux-scope button.lux-tab-arrow-btn:focus-visible {
background: #FFFFFF !important;
background-color: #FFFFFF !important;
background-image: none !important;
color: var(--lx-gray-700) !important;
border: 1px solid var(--lx-gray-200) !important;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
outline: none !important;
text-decoration: none !important;
}
.lux-scope button.lux-tab-arrow-btn:hover {
background: #FFFFFF !important;
background-color: #FFFFFF !important;
color: var(--lx-blue) !important;
border-color: var(--lx-cyan) !important;
}
.lux-scope button.lux-tab-arrow-btn:active {
background: var(--lx-gray-100) !important;
background-color: var(--lx-gray-100) !important;
color: var(--lx-blue) !important;
border-color: var(--lx-cyan) !important;
}
/* ── Pagination dots ── */
.lux-scope button.lux-tab-dot,
.lux-scope button.lux-tab-dot:hover,
.lux-scope button.lux-tab-dot:focus,
.lux-scope button.lux-tab-dot:focus-visible,
.lux-scope button.lux-tab-dot:active {
background: var(--lx-gray-300) !important;
background-color: var(--lx-gray-300) !important;
background-image: none !important;
border: none !important;
box-shadow: none !important;
outline: none !important;
padding: 0 !important;
min-height: 0 !important;
min-width: 0 !important;
height: 9px !important;
width: 9px !important;
}
.lux-scope button.lux-tab-dot:hover {
background: var(--lx-cyan) !important;
background-color: var(--lx-cyan) !important;
}
.lux-scope button.lux-tab-dot.active,
.lux-scope button.lux-tab-dot.active:hover,
.lux-scope button.lux-tab-dot.active:focus,
.lux-scope button.lux-tab-dot.active:active {
width: 24px !important;
border-radius: 9999px !important;
background: linear-gradient(90deg, var(--lx-cyan) 0%, var(--lx-blue) 100%) !important;
background-color: var(--lx-cyan) !important;
}
/* ── Main CTA buttons (hero) ── */
.lux-scope a.lux-btn-primary,
.lux-scope a.lux-btn-primary:hover,
.lux-scope a.lux-btn-primary:focus,
.lux-scope a.lux-btn-primary:active {
background: linear-gradient(135deg, var(--lx-cyan) 0%, var(--lx-blue) 100%) !important;
background-color: var(--lx-cyan) !important;
color: #FFFFFF !important;
border: none !important;
outline: none !important;
}
.lux-scope a.lux-btn-ghost,
.lux-scope a.lux-btn-ghost:focus,
.lux-scope a.lux-btn-ghost:active {
background: #FFFFFF !important;
background-color: #FFFFFF !important;
color: var(--lx-dark) !important;
border: 1.5px solid var(--lx-gray-200) !important;
outline: none !important;
}
.lux-scope a.lux-btn-ghost:hover {
background: var(--lx-lime-light) !important;
background-color: var(--lx-lime-light) !important;
color: #365314 !important;
border-color: var(--lx-lime) !important;
}
/* ── Card CTA links ── */
.lux-scope a.lux-card-cta,
.lux-scope a.lux-card-cta:hover,
.lux-scope a.lux-card-cta:focus,
.lux-scope a.lux-card-cta:active {
color: var(--lx-blue) !important;
background: transparent !important;
outline: none !important;
box-shadow: none !important;
}
/* ── Sticky mobile dock: stop hover/focus color shifts ── */
.lux-mobile-dock a.lux-dock-btn.btn-inquire,
.lux-mobile-dock a.lux-dock-btn.btn-inquire:hover,
.lux-mobile-dock a.lux-dock-btn.btn-inquire:focus,
.lux-mobile-dock a.lux-dock-btn.btn-inquire:active {
background: linear-gradient(135deg, #00A3FF 0%, #0077CC 100%) !important;
color: #FFFFFF !important;
}
.lux-mobile-dock a.lux-dock-btn.btn-whatsapp,
.lux-mobile-dock a.lux-dock-btn.btn-whatsapp:hover,
.lux-mobile-dock a.lux-dock-btn.btn-whatsapp:focus,
.lux-mobile-dock a.lux-dock-btn.btn-whatsapp:active {
background: linear-gradient(135deg, #25D366 0%, #128C7E 100%) !important;
color: #FFFFFF !important;
}
/* ── Remove theme's tap highlight / focus ring color on all lux buttons ── */
.lux-scope button,
.lux-scope a {
-webkit-tap-highlight-color: transparent;
}
EXPO 2026 • LEVIA TECHNOLOGIES
ONE UNIFIED
ECOSYSTEM
Powering the Future of Hospitality & Retail.
01
POS & Kiosks
Detachable POS architecture, dual merchant touchscreens, and self-ordering KIOSK C2400 stations.
Detachable Screen
KIOSK C2400
Kitchen KDS
02
Cloud OS & AI
Centralised cloud-native operating system with real-time telemetry, AI dashboards, and offline-first
synchronisation.
Cloud Native
AI Telemetry
Omnichannel
03
Robotics & F&B
Autonomous robotic barista hub brewing speciality beverages 24/7 with zero human contact in 45 seconds.
Robotic Arm
45s Speed
Unattended Kiosk
04
Rugged Mobility
Military-grade enterprise tablets (RG1) featuring 6nm Helio G99 compute, 10.1″ FHD Gorilla Glass, and 8000mAh pure cobalt power.
IP68 / IP69K
MIL-STD-810H
Helio G99 • 8GB
8000mAh Cobalt
Levia Technologies Private Limited brings hardware engineering, cloud intelligence, and robotic hospitality
into one unified commercial ecosystem.
By eliminating vendor fragmentation between countertop terminals, mobile scanners, cloud operating systems,
and robotic automation, Levia empowers modern hospitality and retail enterprises to scale with complete
confidence.
⚡
Future Ready
Modular architecture built for emerging payment rails, AI operations, and retail
flows.
🔄
Seamless Integration
Instant interoperability between terminals, tablets, robotics, and central cloud
telemetry.
🛡️
24h Reliability
Industrial reliability backed by offline-first local data failover that never stops
trading.
📈
Scale Your Business
Standardised fleet governance from flagship stores to nationwide multi-store
rollouts.
Expo Enquiries & Enterprise Rollout
Connect with Levia Technologies
Visiting our stand or exploring a rollout? Share your details for bespoke fleet proposals and technical
consultations.
🔒 Your details are confidential and used only by Levia Technologies hardware specialists.
