/* LJPc theme overrides for the embedded BookingModule iframe. Applied when the iframe is loaded with ?theme=ljpc. Activated by the .theme-ljpc class on . */ .theme-ljpc, .theme-ljpc * { font-family: 'Poppins', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important; } /* Brand headings */ .theme-ljpc h1, .theme-ljpc h2, .theme-ljpc h3 { color: #312e51; letter-spacing: 0.08px; } /* Indigo accent → LJPc blue */ .theme-ljpc .text-indigo-600 { color: #507abd !important; } .theme-ljpc .text-indigo-700, .theme-ljpc .hover\:text-indigo-700:hover { color: #3a5d96 !important; } .theme-ljpc .dark\:text-indigo-400, .theme-ljpc .text-indigo-400 { color: #6b8fce !important; } .theme-ljpc .bg-indigo-600 { background-color: #507abd !important; } .theme-ljpc .focus\:ring-indigo-600:focus, .theme-ljpc .ring-indigo-600 { --tw-ring-color: #507abd !important; } /* Calendar day pills */ .theme-ljpc button[data-is-selected]:not([data-is-today]) { background-color: #312e51 !important; } .theme-ljpc button[data-is-selected][data-is-today] { background-color: #507abd !important; } /* Today indicator (non-selected) */ .theme-ljpc button[data-is-today]:not([data-is-selected]) time { color: #507abd !important; } /* Time slot buttons */ .theme-ljpc .grid > button.bg-indigo-600 { background-color: #507abd !important; } /* Primary CTA: the confirm-booking button. Match the LJPc contact form button: green, full-rounded, h-12, bold. */ .theme-ljpc button[wire\:click*="confirmBooking"] { background-color: #32BF3D !important; color: #ffffff !important; border-radius: 9999px !important; font-weight: 700 !important; height: 48px !important; padding-top: 0 !important; padding-bottom: 0 !important; border: 0 !important; box-shadow: none !important; transition: opacity 0.15s ease; } .theme-ljpc button[wire\:click*="confirmBooking"]:hover { background-color: #32BF3D !important; opacity: 0.95; } .theme-ljpc button[wire\:click*="confirmBooking"]:disabled { opacity: 0.7; cursor: not-allowed; } /* Form inputs and textareas match LJPc contact form: border-[#979797] rounded-[3px] h-12 px-[13px], no ring, no shadow. */ .theme-ljpc input[type="text"], .theme-ljpc input[type="email"], .theme-ljpc input[type="number"], .theme-ljpc input[type="tel"], .theme-ljpc input[type="password"], .theme-ljpc textarea, .theme-ljpc select { border: 1px solid #979797 !important; border-radius: 3px !important; background-color: #ffffff !important; box-shadow: none !important; --tw-ring-shadow: 0 0 #0000 !important; --tw-ring-offset-shadow: 0 0 #0000 !important; font-size: 16px !important; color: #111827; } .theme-ljpc input[type="text"], .theme-ljpc input[type="email"], .theme-ljpc input[type="number"], .theme-ljpc input[type="tel"], .theme-ljpc input[type="password"], .theme-ljpc select { height: 48px !important; padding: 0 13px !important; } .theme-ljpc textarea { padding: 12px 13px !important; } .theme-ljpc input:focus, .theme-ljpc textarea:focus, .theme-ljpc select:focus { outline: none !important; border-color: #979797 !important; box-shadow: none !important; --tw-ring-shadow: 0 0 #0000 !important; } /* Card containers: keep a subtle inner shadow but the iframe wrapper shadow is removed in the parent so we don't get double-shadowing. */ .theme-ljpc .shadow-sm { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important; }