/* * Boba Bhai (pId 42259) — brand override styles. * Auto-loaded by base.php for this brand. Ports the CI3 * assets/themes/ue_override/bobabhai/css/catering-events_20251217.css * (only the classes the catering-events page uses). * * CI3 used --main-bg-color / --secondary-bg-color; CI4 injects * --brand-primary / --brand-secondary at runtime in , so we * alias them here instead of hardcoding a hex. */ :root { --main-bg-color: var(--brand-primary, #820389); --secondary-bg-color: var(--brand-secondary, #ffffff); } /* ── Layout / shared ────────────────────────────────────────────── */ .TBspace { margin: 30px 0; } /* ── Contact-us-on-brand-bg section ─────────────────────────────── */ .contactuswform { background-color: var(--main-bg-color); color: var(--secondary-bg-color); } .contactuswform p, .contactuswform h3, .contactuswform span { color: #ffffff; } .contactuswform .common-section p, .contactuswform .common-section h3 { color: #ffffff; } /* ── Banner ─────────────────────────────────────────────────────── */ .banner-area-started img { object-fit: cover; } /* ── Form inputs ────────────────────────────────────────────────── */ .input-text, .contactuswform .form-control, input[type=email], input[type=password], input[type=search], input[type=text], input[type=url] { padding: .473em 1.2em; color: #666; outline: 0; border: 1px solid #ccc; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; font-weight: 400; background: #D9D9D9; border-radius: 5px !important; } .contact-form-bg input.primary-button { background: var(--secondary-bg-color) !important; max-width: 150px; padding: 10px 10px; width: 150px; color: var(--main-bg-color); } .contactuswform .contact-form { text-align: left; } /* ── Address info list ──────────────────────────────────────────── */ .addressinfowicon, .addressinfowicon ul li a { color: #ffffff; } .addressinfowicon ul li { position: relative; padding-left: 24px; margin-bottom: 10px; } .addressinfowicon ul li i { height: auto; left: 0; position: absolute; top: 7px; width: 16px; vertical-align: middle; color: var(--secondary-bg-color); } /* ── Banner slider dots (banner-slider5 / slick) ────────────────── */ .slick-dots { margin-top: 25px; text-align: center; } .slick-dots li { cursor: pointer; display: inline-block; margin: 0 4px; position: relative; } .slick-dots li:first-child { margin-left: 0; } .slick-dots li:last-child { margin-right: 0; } .slick-dots li button { outline: none; line-height: 0px; color: transparent; display: block; font-size: 0; width: 12px; height: 12px; padding: 0; background-color: #C8C8C8; border: 1px solid #9d9d9d; cursor: pointer; transition: all 0.4s cubic-bezier(0.55, 0.085, 0.68, 0.53); border-radius: 50% !important; } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; background: #ffffff; border-color: var(--main-bg-color) !important; } .slick-dots li.slick-active button { background: #ffffff; border-color: var(--main-bg-color) !important; width: 35px; border-radius: 5px !important; } /* ── Responsive ─────────────────────────────────────────────────── */ @media screen and (min-width: 768px) { .contact-form { width: 100%; max-width: 365px; margin-left: auto; } } @media (max-width: 767px) { .bbrightimgdiv { text-align: center; } }