@onlive.ai/common-121 0.2.187 → 0.2.191

package/themes/custom/seat-cupra.theme.css

@@ -0,0 +1,475 @@
+/**
+ * SEAT CUPRA Theme
+ * ----------------------------------------------------------------------------------------
+ * Custom theme for SEAT CUPRA branding with dark theme as primary.
+ */
+
+/**
+ * Light Theme Override
+ * ----------------------------------------------------------------------------------------
+ * Overrides for light theme, if applicable.
+ */
+.ol-theme-light {
+  /* Palette */
+  --ol-color-primary-50: rgb(220 220 220);
+  --ol-color-primary-100: rgb(200 200 200);
+  --ol-color-primary-200: rgb(150 150 150);
+  --ol-color-primary-300: rgb(100 100 100);
+  --ol-color-primary-400: rgb(80 80 80);
+  --ol-color-primary-500: rgb(60 60 60);
+  --ol-color-primary-600: rgb(40 40 40);
+  --ol-color-primary-700: rgb(0 0 0);
+  --ol-color-primary-800: rgb(0 0 0);
+  --ol-color-primary-900: rgb(0 0 0);
+  --ol-color-primary-950: rgb(0 0 0);
+}
+
+/**
+ * Dark Theme Override (Primary Theme)
+ * ----------------------------------------------------------------------------------------
+ * Main theme variables for SEAT CUPRA dark theme.
+ */
+:root,
+:host,
+.ol-theme-dark {
+  /* Primary Color Palette */
+  --ol-color-primary-50: rgb(0 0 0);
+  --ol-color-primary-100: rgb(40 40 40);
+  --ol-color-primary-200: rgb(80 80 80);
+  --ol-color-primary-300: rgb(120 120 120);
+  --ol-color-primary-400: rgb(160 160 160);
+  --ol-color-primary-500: rgb(200 200 200);
+  --ol-color-primary-600: rgb(230 230 230);
+  --ol-color-primary-700: rgb(240 240 240);
+  --ol-color-primary-800: rgb(255 255 255);
+  --ol-color-primary-900: rgb(255 255 255);
+  --ol-color-primary-950: rgb(255 255 255);
+
+  /* Typography */
+  --ol-font-sans: "cupra-screen", sans-serif;
+
+  /* Spacing & Layout */
+  --ol-calendar-day-padding: var(--ol-spacing-x-small) var(--ol-spacing-small);
+
+  /* Surface & Background Colors */
+  --ol-color-surface: #2e2f38;
+  --ol-color-default-text: #fafafa;
+
+  /* Scrollbar */
+  --ol-scrollbar-color: transparent;
+  --ol-scrollbar-background-color: transparent;
+
+  /* Button Styles */
+  --ol-button-background-color: #383738;
+  --ol-button-border-radius: 24px;
+
+  /* CUPRA Specific Colors */
+  --ol-cupra-active-color: var(--ol-color-primary-700);
+  --ol-cupra-widget-border-radius: 12px;
+
+  /* Calendar Colors */
+  --ol-calendar-inactive-color: var(--ol-color-primary-400);
+  --ol-calendar-day-color: var(--ol-color-primary-800);
+  --ol-calendar-month-font-size: var(--ol-button-font-size-medium);
+  --ol-calendar-header-color: var(--ol-color-default-text);
+  --ol-calendar-month-font-family: var(--ol-font-sans);
+  --ol-focus-ring-width: 1px;
+  --ol-focus-ring-color: var(--ol-color-primary-600);
+  --ol-calendar-day-font-family: var(--ol-font-sans);
+
+  /* iCall Panel */
+  --onlive-icall-start-panel-header-background-color: transparent;
+}
+
+/**
+ * CORE COMPONENTS
+ * ----------------------------------------------------------------------------------------
+ * Base component styles for Onlive UI components.
+ */
+
+/* Buttons */
+ol-button:not([circle])::part(base) {
+  border-radius: var(--ol-button-border-radius);
+  border-width: 0px;
+  line-height: 2em;
+}
+
+ol-button:not([circle])::part(label) {
+  font-size: var(--ol-button-font-size-medium);
+  padding: var(--ol-spacing-x-small) var(--ol-spacing-medium);
+  font-weight: 400;
+}
+
+ol-button:not([circle])::part(spinner) {
+  font-size: 1.5em;
+}
+
+ol-button:not([circle])[variant="primary"]:not([disabled])::part(base) {
+  background-color: var(--ol-button-background-color);
+  color: var(--ol-color-primary-900);
+  border: solid 1px var(--ol-color-primary-300);
+}
+
+ol-button:not([circle])[variant="default"]:not([disabled])::part(base) {
+  color: var(--ol-color-primary-900);
+  border: solid 1px var(--ol-color-primary-200);
+}
+
+/* Inputs & Textareas */
+ol-input,
+ol-textarea {
+  --ol-input-border-radius-small: var(--ol-button-border-radius);
+  --ol-input-border-radius-medium: var(--ol-button-border-radius);
+  --ol-input-border-radius-large: var(--ol-button-border-radius);
+  padding: 4px 8px;
+  border: 0;
+  border-bottom: 1px solid var(--ol-color-primary-400);
+  border-radius: 4px 4px 0 0;
+  background-color: #ffffff0f;
+}
+
+ol-input:focus::part(base),
+ol-textarea:focus::part(base) {
+  border-color: var(--ol-cupra-active-color);
+  border-width: 0px;
+}
+
+ol-input::part(base) {
+  height: var(--ol-spacing-x-large);
+  border: 0px solid var(--ol-color-neutral-500);
+  background-color: transparent;
+  outline: none;
+  border-radius: 0;
+  box-shadow: none;
+}
+
+ol-input::part(input) {
+  height: calc(var(--ol-spacing-x-large) - 4px);
+  padding: 0;
+  font-family: var(--ol-font-sans);
+  font-size: var(--ol-button-font-size-medium);
+  color: var(--ol-color-default-text);
+  font-weight: 400;
+  line-height: 1.5rem;
+  letter-spacing: 0.5px;
+}
+
+ol-input::part(form-control-label) {
+  font-family: var(--ol-font-sans);
+  font-size: var(--ol-button-font-size-medium);
+  font-weight: 300;
+  line-height: 1.5rem;
+  letter-spacing: 0.5px;
+}
+
+ol-textarea::part(base) {
+  border: 2px solid var(--ol-color-neutral-500);
+  background-color: transparent;
+}
+
+/* Checkboxes & Radios */
+ol-checkbox::part(control--checked),
+ol-radio::part(control--checked) {
+  background-color: var(--ol-cupra-active-color);
+  border-color: var(--ol-cupra-active-color);
+}
+
+ol-checkbox::part(control) {
+  margin: 10px 10px 10px 0;
+}
+
+/* Carousel */
+ol-carousel::part(pagination) {
+  gap: var(--ol-spacing-x-small);
+}
+
+ol-carousel::part(pagination-item) {
+  border: 1px solid var(--ol-color-neutral-600);
+  background-color: transparent;
+}
+
+ol-carousel::part(pagination-item--active) {
+  border-color: transparent;
+  background-color: var(--ol-cupra-active-color);
+}
+
+/* Range Slider */
+ol-range::part(input) {
+  --thumb-size: 20px;
+  --track-height: 5px;
+  --thumb-background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2021%2021%22%3E%3Crect%20fill=%22%23bbbbbb%22%20x=%227%22%20y=%227%22%20width=%221%22%20height=%221%22/%3E%3Crect%20fill=%22%23bbbbbb%22%20x=%2210%22%20y=%227%22%20width=%221%22%20height=%221%22/%3E%3Crect%20fill=%22%23bbbbbb%22%20x=%2213%22%20y=%227%22%20width=%221%22%20height=%221%22/%3E%3Crect%20fill=%22%23bbbbbb%22%20x=%227%22%20y=%2210%22%20width=%221%22%20height=%221%22/%3E%3Crect%20fill=%22%23bbbbbb%22%20x=%2210%22%20y=%2210%22%20width=%221%22%20height=%221%22/%3E%3Crect%20fill=%22%23bbbbbb%22%20x=%2213%22%20y=%2210%22%20width=%221%22%20height=%221%22/%3E%3Crect%20fill=%22%23bbbbbb%22%20x=%227%22%20y=%2213%22%20width=%221%22%20height=%221%22/%3E%3Crect%20fill=%22%23bbbbbb%22%20x=%2210%22%20y=%2213%22%20width=%221%22%20height=%221%22/%3E%3Crect%20fill=%22%23bbbbbb%22%20x=%2213%22%20y=%2213%22%20width=%221%22%20height=%221%22/%3E%3C/svg%3E");
+}
+
+/* Progress Bar */
+ol-progress-bar {
+  --indicator-color: var(--ol-cupra-active-color);
+}
+
+/* Panel */
+ol-panel {
+  color: black;
+}
+
+/* Select */
+ol-select::part(form-control-label) {
+  margin-bottom: var(--ol-spacing-medium);
+}
+
+/* Calendar */
+ol-calendar::part(header-content) {
+  font-family: var(--ol-font-sans);
+  font-size: var(--ol-button-font-size-medium);
+  color: var(--ol-color-default-text);
+  font-weight: 400;
+  line-height: 1.5rem;
+  letter-spacing: 0.5px;
+}
+
+/**
+ * CHAT COMPONENTS
+ * ----------------------------------------------------------------------------------------
+ * Styles for chat interface components.
+ */
+
+/* Chat Buttons */
+.och__send__message::part(base),
+.och__message__form__button::part(base),
+.och__send__submit-button::part(base) {
+  border-radius: 30px;
+}
+
+/* Chat Header */
+.ocb__header__logo {
+  height: 30px;
+}
+
+/* Chat Messages */
+.och__message--me .och__message__box {
+  font-family: var(--ol-font-sans);
+  letter-spacing: 0.5px;
+  border-radius: 12px 12px 0px;
+  background: #26262c;
+}
+
+.och__message__from {
+  color: var(--ol-color-primary-200);
+}
+
+.och__message--system .och__message__box {
+  font-family: var(--ol-font-sans);
+  color: var(--ol-color-primary-600);
+  background-color: #474852;
+}
+
+.och__message--other .och__message__box {
+  font-family: var(--ol-font-sans);
+  font-weight: 500;
+  letter-spacing: 0.5px;
+  color: var(--ol-color-primary-600);
+  background: #474852;
+}
+
+/* Chat Textarea */
+.och__send__textarea-shell {
+  border: 0px solid var(--ol-color-neutral-200);
+  border-radius: 4px 4px 0 0;
+  border-bottom: 1px solid var(--ol-color-primary-600);
+}
+
+.och__send__textarea-shell:focus-within {
+  box-shadow: none;
+  border-bottom: 1px solid #b2764d;
+}
+
+.och__send__message::part(textarea) {
+  color: var(--ol-color-primary-600);
+}
+
+.och__send__emoji-button:hover::part(base) {
+  color: var(--ol-color-primary-600);
+  background: none;
+}
+
+.och__send__submit-button::part(label) {
+  color: var(--ol-color-primary-600);
+  background: none;
+}
+
+/* Chat UI Elements */
+.och__chat__date-separator__text {
+  font-family: var(--ol-font-sans);
+  color: var(--ol-color-primary-600);
+}
+
+.och__evaluation__rating-label {
+  color: var(--ol-color-primary-600);
+}
+
+/* Textarea Controls */
+.textarea__control {
+  font-family: var(--ol-font-sans);
+  color: var(--ol-color-primary-600);
+}
+
+.textarea--standard:hover:not(.textarea--disabled) .textarea__control {
+  font-family: var(--ol-font-sans);
+  color: var(--ol-color-primary-600);
+}
+
+.textarea--resize-auto .textarea__control,
+.textarea--standard {
+  background: #474852;
+  border: none;
+  color: var(--ol-color-primary-600);
+}
+
+/**
+ * CHATBOT WIDGET COMPONENTS
+ * ----------------------------------------------------------------------------------------
+ * Styles for chatbot widget interface.
+ */
+
+/* Widget Buttons */
+.ocb__widget__button {
+  backdrop-filter: blur(80px);
+  border-radius: var(--ol-cupra-widget-border-radius);
+}
+
+.ocb__widget__button.ocb__widget__panel {
+  border-radius: var(--ol-cupra-widget-border-radius);
+}
+
+/* Widget Panels */
+.ocb__widget__panel {
+  border-radius: var(--ol-cupra-widget-border-radius);
+}
+
+.ocb__widget__panel--fx-glass .ocb__widget__body,
+.ocb__widget__panel--fx-glass .ocb__widget__footer {
+  background: transparent;
+  backdrop-filter: blur(80px);
+}
+
+.ocb__widget__panel--fx-glass .ocb__widget__body::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  background: linear-gradient(
+    90deg,
+    var(--dg-global-opacity-white-30, rgba(250, 250, 250, 0.3)) 40%,
+    var(--dg-global-opacity-grey-00, rgba(195, 195, 203, 0)) 100%
+  );
+}
+
+.ocb__widget__panel--fx-glass {
+  background: transparent;
+  border: 0.897px solid var(--dg-color-border-strong, rgba(250, 250, 250, 0.3));
+  backdrop-filter: blur(80px);
+}
+
+/* Initial Chatbot Button */
+.ocb__button {
+  background-color: transparent;
+}
+
+.ocb__button--bubble .ocb__bubble__image {
+  height: 28px;
+}
+
+.ocb__button--bubble {
+  flex-direction: row;
+  padding: 8px 20px;
+  border-radius: var(--ol-cupra-widget-border-radius);
+  background: #000000cc;
+  color: var(--ol-color-primary-600);
+  font-family: var(--ol-font-sans);
+  font-size: 18px;
+  font-weight: 400;
+  box-shadow: 0 1px 1px 1px rgba(14, 139, 137, 0.3);
+  width: auto;
+  letter-spacing: 0.5px;
+}
+
+.ocb__button--bubble::after {
+  bottom: 0;
+  border-width: 0;
+}
+
+.ocb__button--circle {
+  border: 1px solid var(--dg-color-border-strong, rgba(14, 139, 137, 0.3));
+  box-shadow: 0 1px 1px 1px rgba(14, 139, 137, 0.3);
+}
+
+.ocb__button--pop-over:hover {
+  box-shadow: 0 2px 2px 2px rgba(14, 139, 137, 0.3);
+}
+
+/* Header Buttons */
+.ocb__header__maximize-button:not([circle])[variant="default"]:not([disabled])::part(base),
+.ocb__header__minimize-button:not([circle])[variant="default"]:not([disabled])::part(base),
+.ocb__header__close-button:not([circle])[variant="default"]:not([disabled])::part(base),
+.ocb__header__close-button {
+  border-color: transparent;
+}
+
+/**
+ * FLOW COMPONENTS
+ * ----------------------------------------------------------------------------------------
+ * Styles for flow interface components.
+ */
+
+/* Flow Text */
+.ofl__flow--in-container > :first-child {
+  font-family: var(--ol-font-sans);
+  font-size: var(--ol-button-font-size-medium);
+  color: var(--ol-color-default-text);
+  font-weight: 400;
+  line-height: 1.5rem;
+  letter-spacing: 0.5px;
+  padding-top: 10px;
+}
+
+.ofl__flow__title {
+  font-family: var(--ol-font-sans);
+  font-weight: 350;
+}
+
+.ofl__flow__loading-overlay {
+  background-color: transparent;
+}
+
+/* Form Controls */
+.form-control--has-label .form-control__label {
+  font-family: var(--ol-font-sans);
+  font-weight: 350;
+  margin-bottom: var(--ol-spacing-medium) !important;
+}
+
+.ofl__checkbox__checkbox::part(label) {
+  font-size: var(--ol-button-font-size-small);
+}
+
+/* Calendar Components */
+.ofl__calendar__time-list--list .ofl__calendar__time-item::part(button) {
+  font-weight: 400;
+  border-color: var(--ol-color-neutral-400);
+}
+
+.ofl__calendar__label {
+  font-family: var(--ol-font-sans);
+  font-size: var(--ol-button-font-size-medium);
+  color: var(--ol-color-default-text);
+  font-weight: 400;
+  line-height: 1.5rem;
+  letter-spacing: 0.5px;
+}
+
+.ofl__calendar__calendar {
+  font-family: var(--ol-font-sans);
+  font-weight: 400;
+  line-height: 1.5rem;
+  letter-spacing: 0.5px;
+}

package/themes/custom/seat-cupra.theme.d.cts

@@ -1,3 +1,3 @@
-/*! @onlive.ai/common-121 v0.2.187 | © 2026 Onlive.ai */
+/*! @onlive.ai/common-121 v0.2.191 | © 2026 Onlive.ai */
 import 'lit';
-export { s as styles } from '../../seat-cupra.theme-CzvloqhA.cjs';
+export { s as styles } from '../../seat-cupra.theme-DTbnGqGc.cjs';

package/themes/custom/seat-cupra.theme.d.ts

@@ -1,3 +1,3 @@
-/*! @onlive.ai/common-121 v0.2.187 | © 2026 Onlive.ai */
+/*! @onlive.ai/common-121 v0.2.191 | © 2026 Onlive.ai */
 import 'lit';
-export { s as styles } from '../../seat-cupra.theme-CzvloqhA.js';
+export { s as styles } from '../../seat-cupra.theme-DTbnGqGc.js';

package/themes/custom/seat-cupra.theme.js

@@ -1,4 +1,4 @@
-/*! @onlive.ai/common-121 v0.2.187 | © 2026 Onlive.ai */
+/*! @onlive.ai/common-121 v0.2.191 | © 2026 Onlive.ai */
 import{css as o}from"lit";var a=o`
 /**
  * SEAT CUPRA Theme