/* Lapin kumi 2026-06-15 */

:root {
    /* logo */
    --logo-image: url("/images/themes/lapin-kumi-logo-header.png");
    /* main colors */
    --color-primary: #E52429;
    --color-primary-light: #E2686C;
    --color-secondary: #000;
    --color-light: #fff;
    --color-light-plus: #E9ECEF;
    --color-medium: #888;
    --color-medium-plus: #333;
    --color-medium-minus: #aaa;
    --color-dark: #000;
    --color-blue: #123f92;
    --color-blue-dark: #0c2b66;
    --color-blue-bright-light: #f0f7ff;
    --color-blue-light: #EDF0F7;
    --color-error: #E52429;
    --color-error-rgb: 220, 53, 69;
    --color-ok: green;
    --color-required: #fff3cd;
    --color-wait: orange;
    --color-wait-light: #ffd08a;
    /* text colors */
    --color-txt-selectable: var(--color-medium-plus);
    --color-txt-selected: var(--color-light);
    /* work status colors */
    --color-status-break: #E57F24;
    --color-status-busy: green;
    --color-status-free: green;
    --color-status-pause: #888;
    --color-status-stop: grey;
    --color-status-working: var(--color-blue);
    --color-status-queue: #FD7E14;
    --color-status-ready: green;
    --color-status-wait: green;
    /* day view colors */
    --color-dv-bg: white;
    --color-dv-ready: #129212;
    --color-dv-working: #123f92;
    --color-dv-queue: #333;
    /* rgba */
    --color-rgba-primary: rgba(32, 42, 68, 1.0);
    /* buttons */
    --color-btn-bg: var(--color-primary);
    --color-btn-bg-focus: var(--color-primary-light);
    --color-btn-font: var(--color-light);
    --color-btn-font-focus: var(--color-primary);
    --color-btn-ftr-bg: var(--color-light);
    --color-btn-ftr-bg-focus: var(--color-primary-light);
    --color-btn-ftr-font: var(--color-primary);
    /* checkboxes */
    --color-cb-border: var(--color-secondary);
    --color-cb-checked-bg: var(--color-secondary);
    --color-cb-shadow: var(--color-medium);
    /* cards */
    --color-card-bg-active: var(--color-primary-light);
    --color-card-border: var(--color-medium);
    --color-card-border-active: var(--color-primary);
    /* semantic theme roles */
    --color-on-primary: var(--color-light);
    --color-on-blue: var(--color-light);
    --color-primary-border: var(--color-primary);
    /* panel headers */
    --color-panel-header-bg: var(--color-primary);
    --color-panel-header-text: var(--color-on-primary);
    /* modal headers */
    --color-modal-header-bg: var(--color-primary);
    --color-modal-header-text: var(--color-on-primary);
    /* number badges / hint bars */
    --color-number-bg: var(--color-primary);
    --color-number-text: var(--color-on-primary);
    --color-hint-bg: var(--color-primary);
    --color-hint-text: var(--color-on-primary);
    /* selectable choice buttons */
    --color-choice-bg: var(--color-light);
    --color-choice-text: var(--color-txt-selectable);
    --color-choice-border: var(--color-blue);
    --color-choice-hover-bg: var(--color-blue);
    --color-choice-hover-text: var(--color-on-blue);
    --color-choice-hover-border: var(--color-blue);
    --color-choice-hover-icon: var(--color-choice-hover-text);
    --color-choice-selected-bg: var(--color-blue);
    --color-choice-selected-text: var(--color-on-blue);
    --color-choice-selected-border: var(--color-blue);
    --color-choice-selected-icon: var(--color-choice-selected-text);
    /* queue tickets */
    --color-queue-ticket-badge: var(--color-light);
    /* work cards */
    --color-work-card-bg: var(--color-light);
    --color-work-card-text: var(--color-txt-selectable);
    --color-work-card-border: var(--color-blue);
    --color-work-card-hover-bg: var(--color-blue);
    --color-work-card-hover-text: var(--color-on-blue);
    --color-work-card-hover-border: var(--color-blue);
    --color-work-card-selected-bg: var(--color-blue);
    --color-work-card-selected-text: var(--color-on-blue);
    --color-work-card-selected-border: var(--color-blue);
    /* vehicle / mask icons */
    --color-vehicle-icon: var(--color-blue);
    --color-vehicle-icon-hover: var(--color-choice-hover-icon);
    --color-vehicle-icon-selected: var(--color-choice-selected-icon);
    /* service reception */
    --color-resv-stat-value: var(--color-primary);
    --color-resv-stat-value-shadow: none;
    /* outside display */
    --color-outside-bg: #000;
    --color-outside-clock-text: var(--color-light);
    --color-outside-capsule-left-bg: var(--color-primary);
    --color-outside-capsule-left-text: var(--color-light);
    --color-outside-capsule-right-bg: var(--color-light);
    --color-outside-capsule-right-text: var(--color-secondary);
    --color-outside-next-text: var(--color-light);
    --color-outside-licno-capsule-bg: #4D4D4D;
    --color-outside-licno-capsule-text: var(--color-light);
    --color-outside-blink-color-1: var(--color-primary);
    --color-outside-blink-color-2: black;
    /* login page */
    --color-login-panel-border: var(--color-medium);
    --color-login-feedback-text: white;
    --color-login-btn-disabled-bg: #ccc;
    --color-login-btn-disabled-text: #888;
    --color-login-btn: var(--color-blue);
    --color-login-passwd-icon: #666;
    /* account management */
    --color-account-divider: var(--color-medium-minus);
    --color-account-btn-role: var(--color-blue);
    --color-account-btn-role-hover: var(--color-primary);
    --color-account-btn-checked: var(--color-blue-light);
    --color-account-btn-checked-border: var(--color-blue);
    --color-account-btn-checked-bg: var(--color-primary);
    --color-account-excel-bg: #f3f3f3;
    --color-account-excel-border: #d0d0d0;
    --color-account-excel-row: #fafafa;
    --color-account-excel-hover: #e6f7ff;
    /* mobile queue page */
    --color-mobile-bg: #000000;
    --color-mobile-number-bg: var(--color-primary);
    --color-mobile-number-text: var(--color-light);
    --color-mobile-line-bg: var(--color-light);
    --color-mobile-line-text: black;
    --color-mobile-time-text: var(--color-light);
    --color-mobile-fooder-text: var(--color-light);
    --color-mobile-error-text: var(--color-light);
    /* card background images */
    --card-bg-overlay: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,.5));
    --card-left-bg-image: url("/images/themes/lapin-kumi-bg-left.png");
    --card-middle-bg-image: url("/images/themes/lapin-kumi-bg-middle.png");
    --card-right-bg-image: url("/images/themes/lapin-kumi-bg-right.png");
    --card-left-bg-position: center 7px;
    --card-middle-bg-position: center bottom;
    --card-right-bg-position: center -25px;
    --card-left-bg-size: 100% 100%;
    --card-middle-bg-size: 100% 100%;
    --card-right-bg-size: 100% calc(100% + 25px);
}