:root {
--ez-ink: #0d0f12;
--ez-ink-2: #15181d;
--ez-lime: #12813d;
--ez-lime-deep: #0e6b32;
--ez-paper: #ffffff;
--ez-paper-2: #f5f7fa;
--ez-line: #e4e9f0;
--ez-line-strong:#cfd7e3;
--ez-text: #161b22;
--ez-muted: #5c6a7d;
--ez-focus: #0e6b32;
--ez-radius: 14px;
--ez-radius-lg: 22px;
--ez-pill: 999px;
--ez-shadow: 0 24px 60px -20px rgba(13, 15, 18, .28);
--ez-shadow-soft:0 2px 10px rgba(22, 27, 34, .06);
}
.loginCard.loginCard {
position: relative;
min-height: 100dvh;
background: var(--ez-ink);
padding: 32px 20px;
}
.loginCard.loginCard::before {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(620px 620px at 22% 28%, rgba(18,129,61,0.088) 0%, rgba(18,129,61,0.0) 66%),
linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px) 0 0 / 44px 44px,
linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px) 0 0 / 44px 44px;
pointer-events: none;
}
.loginCard.loginCard > * {
position: relative;
z-index: 1;
}
.loginCard .loginPanel {
background: var(--ez-paper);
border: 1px solid rgba(255, 255, 255, .08);
border-radius: var(--ez-radius-lg);
box-shadow: var(--ez-shadow);
padding: 36px 34px 30px;
max-width: 440px;
width: 100%;
}
.loginCard .loginPanelHeader h1 {
font-size: 27px;
line-height: 1.2;
letter-spacing: -.022em;
font-weight: 640;
color: var(--ez-text);
margin: 0 0 22px;
}
.loginCard .loginForm label {
display: grid;
gap: 7px;
font-size: 13.5px;
font-weight: 550;
color: var(--ez-text);
margin-bottom: 16px;
}
.loginCard .loginForm input {
min-height: 48px;
padding: 12px 14px;
font-size: 15px;
color: var(--ez-text);
background: var(--ez-paper);
border: 1px solid var(--ez-line-strong);
border-radius: var(--ez-radius);
transition: border-color .16s ease, box-shadow .16s ease;
}
.loginCard .loginForm input:hover { border-color: #b9c3d2; }
.loginCard .loginForm input:focus {
outline: none;
border-color: var(--ez-focus);
box-shadow: 0 0 0 3px rgba(18,129,61,0.088);
}
.loginCard .loginSubmit.loginSubmit {
width: 100%;
min-height: 50px;
margin-top: 4px;
border: 0;
border-radius: var(--ez-pill);
background: var(--ez-lime);
color: #14171a;
font-size: 15.5px;
font-weight: 620;
cursor: pointer;
transition: background .16s ease, transform .12s ease;
}
.loginCard .loginSubmit.loginSubmit:hover { background: var(--ez-lime-deep); }
.loginCard .loginSubmit.loginSubmit:active { transform: translateY(1px); }
.loginCard .loginSubmit.loginSubmit:focus-visible,
.loginCard .loginForm input:focus-visible {
outline: 3px solid var(--ez-focus);
outline-offset: 3px;
}
.loginCard .loginLinks {
display: grid;
gap: 6px;
margin-top: 18px;
padding-top: 18px;
border-top: 1px solid var(--ez-line);
}
.loginCard .textLinkButton.textLinkButton {
justify-self: start;
min-height: 32px;
padding: 0;
font-size: 13.5px;
font-weight: 550;
color: var(--ez-text);
background: transparent;
border: 0;
cursor: pointer;
text-underline-offset: 3px;
}
.loginCard .textLinkButton.textLinkButton:hover { text-decoration: underline; }
.loginCard .loginBack.loginBack {
display: block;
width: 100%;
margin-top: 14px;
padding: 10px 0 0;
font-size: 13px;
color: var(--ez-muted);
background: transparent;
border: 0;
cursor: pointer;
}
.loginCard .loginBack.loginBack:hover { color: var(--ez-text); }
.siteHeader--dark.siteHeader--dark {
background: rgba(10, 11, 13, .92);
backdrop-filter: saturate(140%) blur(10px);
border-bottom: 1px solid rgba(255, 255, 255, .07);
}
.siteHeader--dark .brandLogo {
letter-spacing: -.02em;
}
.siteHeader--dark .navLink {
border-radius: var(--ez-pill);
padding: 8px 14px;
transition: background .16s ease, color .16s ease;
}
.siteHeader--dark .navLink:hover {
background: rgba(255, 255, 255, .07);
color: #fff;
}
.siteHeader--dark .loginLink.loginLink {
border-radius: var(--ez-pill);
padding: 10px 22px;
min-height: 42px;
font-weight: 600;
background: #fff;
color: #101215;
border: 0;
transition: transform .12s ease, background .16s ease;
}
.siteHeader--dark .loginLink.loginLink:hover { background: #eef1f4; }
.siteHeader--dark .loginLink.loginLink:active { transform: translateY(1px); }
.homeShowcase.homeShowcase {
position: relative;
min-height: 0;
height: auto;
padding: 72px 0 96px;
overflow: hidden;
}
.homeShowcase.homeShowcase::before {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(760px 520px at 78% 34%, rgba(18,129,61,0.055) 0%, rgba(18,129,61,0.0) 62%),
linear-gradient(rgba(255, 255, 255, .03) 1px, transparent 1px) 0 0 / 52px 52px,
linear-gradient(90deg, rgba(255, 255, 255, .03) 1px, transparent 1px) 0 0 / 52px 52px;
mask-image: linear-gradient(to bottom, #000 0%, transparent 82%);
pointer-events: none;
z-index: 0;
}
.homeShowcase.homeShowcase > * { position: relative; z-index: 1; }
.homeShowcase .eyebrow {
letter-spacing: .14em;
font-size: 11.5px;
color: rgba(255, 255, 255, .5);
}
.homeShowcaseCopy h1 {
letter-spacing: -.028em;
line-height: 1.04;
}
.homeShowcaseCopy p {
color: rgba(255, 255, 255, .66);
line-height: 1.6;
max-width: 46ch;
}
.homeShowcaseActions a,
.homeShowcaseActions button {
min-height: 50px;
padding: 0 26px;
border-radius: var(--ez-pill);
font-weight: 600;
display: inline-flex;
align-items: center;
justify-content: center;
transition: background .16s ease, transform .12s ease, border-color .16s ease;
}
.homeShowcaseActions > :first-child {
background: var(--ez-lime);
color: #14171a;
border: 0;
box-shadow: 0 10px 30px -12px rgba(18,129,61,0.33);
}
.homeShowcaseActions > :first-child:hover { background: var(--ez-lime-deep); }
.homeShowcaseActions > :nth-child(2) {
background: transparent;
color: #fff;
border: 1px solid rgba(255, 255, 255, .22);
}
.homeShowcaseActions > :nth-child(2):hover {
background: rgba(255, 255, 255, .06);
border-color: rgba(255, 255, 255, .38);
}
.homeShowcaseActions a:active,
.homeShowcaseActions button:active { transform: translateY(1px); }
.homeShowcaseActions a:focus-visible,
.homeShowcaseActions button:focus-visible {
outline: 3px solid var(--ez-lime);
outline-offset: 3px;
}
.kbLandingLaptop {
border-radius: 18px;
box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .75);
}
.kbLandingPill {
border-radius: var(--ez-pill);
backdrop-filter: blur(6px);
}
.kbLandingStatCard {
border-radius: 16px;
border: 1px solid rgba(255, 255, 255, .08);
}
@media (max-width: 900px) {
.homeShowcase.homeShowcase { padding: 48px 0 64px; }
.loginCard .loginPanel { padding: 28px 22px 24px; }
}
@media (prefers-reduced-motion: reduce) {
.loginCard *,
.homeShowcase * { transition-duration: .01ms !important; }
}
.kbLandingStatCardBottom strong,
.kbLandingStatCard strong {
font-size: clamp(22px, 2.2vw, 34px);
line-height: 1.05;
display: block;
max-width: 100%;
overflow-wrap: anywhere;
hyphens: auto;
}
.headerTop { align-items: center; }
.headerActions.headerActions { margin-left: auto; }
.dropdownPanel.dropdownPanel,
.mobileMenu.mobileMenu {
background: #14171c;
color: #fff;
border: 1px solid rgba(255, 255, 255, .10);
border-radius: 16px;
box-shadow: 0 30px 70px -24px rgba(0, 0, 0, .8);
}
.dropdownPanel .dropdownTitle,
.mobileMenu .mobileBlockTitle {
color: rgba(255, 255, 255, .55);
}
.dropdownPanel .dropdownItem,
.mobileMenu .mobileNav a,
.mobileMenu .mobileSectionList a {
color: rgba(255, 255, 255, .88);
border-radius: 10px;
}
.dropdownPanel .dropdownItem:hover,
.mobileMenu .mobileNav a:hover,
.mobileMenu .mobileSectionList a:hover {
background: rgba(255, 255, 255, .07);
color: #fff;
}
.mobileMenu .mobileLoginButton {
border-radius: var(--ez-pill);
background: var(--ez-lime);
color: #14171a;
font-weight: 620;
min-height: 46px;
}
.homeShowcaseActions > :nth-child(2) {
border-color: rgba(255, 255, 255, .45);
}
.homeShowcaseActions > :nth-child(2):hover {
border-color: rgba(255, 255, 255, .7);
}
.loginCard .loginForm input::placeholder { color: #6b7789; }
.loginCard .loginForm input { border-color: #b3bfd0; }
.adminSplit--single.adminSplit--single {
grid-template-columns: minmax(0, 1fr);
}
.adminCard.adminCard {
min-width: 0;
min-height: 0;
border-radius: var(--ez-radius-lg);
border: 1px solid var(--ez-line);
box-shadow: var(--ez-shadow-soft);
}
.adminWorkspace.adminWorkspace {
padding: 24px 28px 48px;
gap: 20px;
}
.adminHeaderCard.adminHeaderCard {
border-radius: var(--ez-radius-lg);
padding: 26px 28px;
}
.adminMetricGrid.adminMetricGrid {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 14px;
}
@media (max-width: 1100px) {
.adminMetricGrid.adminMetricGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
.adminMetricGrid.adminMetricGrid { grid-template-columns: minmax(0, 1fr); }
.adminWorkspace.adminWorkspace { padding: 16px 16px 40px; }
}
.adminCardIntro.adminCardIntro {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
flex-wrap: wrap;
}
.adminCardIntro .actionButton,
.adminCardIntro button {
border-radius: var(--ez-pill);
min-height: 42px;
padding: 0 20px;
background: var(--ez-lime);
color: #14171a;
border: 0;
font-weight: 620;
}
.adminCardIntro .actionButton:hover,
.adminCardIntro button:hover { background: var(--ez-lime-deep); }
.adminAccountTableWrap.adminAccountTableWrap {
overflow-x: auto;
border-radius: var(--ez-radius);
border: 1px solid var(--ez-line);
}
.adminAccountTable.adminAccountTable { min-width: 100%; }
.adminAccountHeaderRow {
background: var(--ez-paper-2);
font-size: 12px;
letter-spacing: .06em;
text-transform: uppercase;
color: var(--ez-muted);
}
.adminAccountRow { transition: background .12s ease; cursor: pointer; }
.adminAccountRow:hover { background: var(--ez-paper-2); }
.adminAccountRow.active { background: rgba(18,129,61,0.088); }
.adminAccountToolbar .workspaceInput {
min-height: 46px;
border-radius: var(--ez-radius);
border: 1px solid var(--ez-line-strong);
}
.adminAccountToolbar .workspaceInput:focus {
outline: none;
border-color: var(--ez-focus);
box-shadow: 0 0 0 3px rgba(18,129,61,0.088);
}
.sidebarBrand .sidebarBrandMark {
display: block;
max-width: 100%;
font-size: 17px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.adminSidebarTabButton {
border-radius: 10px;
transition: background .12s ease;
}
.adminSidebarTabButton.activeItem {
background: rgba(18,129,61,0.121);
font-weight: 600;
}
.adminModalOverlay .actionButton:not(.secondary):not(.danger) {
border-radius: var(--ez-pill);
background: var(--ez-lime);
color: #14171a;
border: 0;
font-weight: 620;
}
.whEmptyIcon,
.whListEmptyIcon,
.whWhCreateFirstIcon,
.whGroupsEdit,
.userChipAvatarEmoji {
font-size: 0 !important;
line-height: 0;
}
.whEmptyIcon::before,
.whListEmptyIcon::before,
.whWhCreateFirstIcon::before,
.whGroupsEdit::before,
.userChipAvatarEmoji::before {
content: "";
display: inline-block;
width: 1em;
height: 1em;
background: currentColor;
-webkit-mask: var(--ez-icon) center / contain no-repeat;
mask: var(--ez-icon) center / contain no-repeat;
}
.whEmptyIcon,
.whListEmptyIcon,
.whWhCreateFirstIcon {
--ez-icon: url("data:image/svg+xml;utf8,");
color: var(--ez-muted);
}
.whEmptyIcon::before,
.whListEmptyIcon::before,
.whWhCreateFirstIcon::before { width: 44px; height: 44px; }
.whGroupsEdit {
--ez-icon: url("data:image/svg+xml;utf8,");
}
.whGroupsEdit::before { width: 18px; height: 18px; }
.userChipAvatarEmoji {
--ez-icon: url("data:image/svg+xml;utf8,");
color: var(--ez-text);
display: inline-flex;
align-items: center;
justify-content: center;
}
.userChipAvatarEmoji::before { width: 18px; height: 18px; }
.whListEmpty p { margin-top: 12px; }
.loginShell,
.appShell { display: none !important; }
@media (max-width: 760px) {
.finOpsKpiRow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.financeDashboard,
.financeDashboard > * { min-width: 0; max-width: 100%; }
.finOpsKpiCard { padding: 12px 14px; }
}
@media (max-width: 430px) {
.finOpsKpiRow { grid-template-columns: minmax(0, 1fr); }
}
.calendarModal.calendarModal--session {
display: flex;
flex-direction: column;
width: min(1040px, calc(100vw - 28px));
max-height: calc(100dvh - 28px);
padding: 22px 22px 0;
overflow: auto;
overscroll-behavior: contain;
}
.calendarModalBody.calendarModalBody--session {
display: grid;
flex: 0 0 auto;
height: auto;
min-height: 0;
max-height: none;
overflow: visible;
}
.calendarModalFooter.calendarModalFooter--session {
position: sticky;
bottom: 0;
margin: 12px -22px 0;
padding: 12px 22px calc(12px + env(safe-area-inset-bottom));
background: #fff;
border-top: 1px solid var(--ez-line, #e4e9f0);
border-radius: 0 0 18px 18px;
z-index: 3;
}
.calendarModal--session .calendarBookingSidebar > .calendarBookingSidebarForm:only-child { grid-column: 1 / -1; }
@media (min-width: 900px) {
.calendarModal--session .calendarForm--session.calendarBookingSidebarForm {
grid-template-columns: repeat(2, minmax(0, 1fr));
column-gap: 14px;
}
.calendarModal--session .calendarForm--session.calendarBookingSidebarForm > .calendarBookingField--textarea,
.calendarModal--session .calendarForm--session.calendarBookingSidebarForm > .calendarBookingMiniActions { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
.calendarModalLayer { padding: 8px; align-items: stretch; }
.calendarModal.calendarModal--session {
display: flex;
flex-direction: column;
width: 100%;
max-height: calc(100dvh - 16px);
padding: 16px 14px 0;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.calendarModalBody.calendarModalBody--session {
display: grid;
flex: 0 0 auto;
height: auto;
min-height: 0;
max-height: none;
overflow: visible;
}
.calendarModal--session .calendarBookingSidebar { grid-template-columns: minmax(0, 1fr); padding: 12px; }
.calendarBookingFieldGroup { grid-template-columns: minmax(0, 1fr); }
.calendarModalFooter.calendarModalFooter--session {
position: sticky;
bottom: 0;
margin: 8px -14px 0;
padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
background: #fff;
border-top: 1px solid var(--ez-line, #e4e9f0);
z-index: 3;
}
.calendarModalFooter--session .actionButton { flex: 1 1 auto; }
}
@media (max-width: 520px) {
.calendarGrid,
.calendarWeekdays { gap: 3px; }
.calendarDay { min-height: 56px; padding: 6px 4px; border-radius: 8px; }
.calendarDay > strong { font-size: .9rem; }
.calendarDayLabel { display: none; }
.calendarWeekdays span { font-size: .72rem; }
.calendarHeader { flex-direction: column; align-items: stretch; }
.calendarHeaderActions { justify-content: flex-start; gap: 6px; }
.calendarHeaderActions .miniButton { min-width: 40px; min-height: 40px; }
.calendarHeaderActions .actionButton { flex: 1 1 calc(50% - 6px); min-height: 40px; }
}
@media (max-width: 640px) and (pointer: coarse) {
.miniButton,
.whGroupsEdit,
.profileMenu button,
.userChip { min-height: 40px; }
.userChip { padding-top: 3px; padding-bottom: 3px; }
}
.sidebarGroup.active .sidebarGroupHead {
background: linear-gradient(135deg, #12813d 0%, #12813d 50%, #12813d 100%) !important;
box-shadow: 0 6px 14px rgba(18,129,61,0.154) !important;
}
.sidebarCalendarDay.selected,
.miniButton.active,
.salePointsTabs .miniButton.active,
.analyticsRangeTabs .miniButton.active,
.miniAppStartButton,
.subscriptionTypeOnlineToggle input:checked {
background: linear-gradient(135deg, #12813d 0%, #12813d 50%, #12813d 100%) !important;
}
.actionButton.primary {
background: linear-gradient(152deg, #33363b 0%, #141618 70%) !important;
box-shadow: 0 8px 18px rgba(20, 23, 27, .22);
}
.actionButton.primary:hover:not(:disabled) {
background: linear-gradient(152deg, #3d4046 0%, #1c1e21 70%) !important;
}
.detailCard,
.finOpsKpiCard,
.metricCard,
.whTableCard,
.clientPanelCard,
.calendarCard {
background-image: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
}
.sidebar {
background: linear-gradient(180deg, #f5f5f5 0%, #ececec 100%) !important;
}
.sidebarCalendar {
background-image: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
}
.subscriptionPlanCard.active {
background-image: linear-gradient(180deg, #ffffff 0%, #f6fde0 100%);
}
.statusChip.on,
.noticePill--accent {
background: linear-gradient(135deg, rgba(18,129,61,0.303) 0%, rgba(18,129,61,0.248) 100%) !important;
}
.actionButton.primary,
.adminCardIntro .actionButton.primary { color: #fff !important; }
.cgWrap { display: grid; gap: 16px; max-width: 1080px; }
.cgHero.cgHero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 460px); gap: 32px; align-items: center; padding: 28px 30px; }
.cgBrand { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.cgBrandMark { width: 40px; height: 40px; border-radius: 12px; flex: none; background-color: #12813d; background-image: url("data:image/svg+xml;utf8,"), linear-gradient(135deg, #12813d 0%, #12813d 50%, #12813d 100%); background-size: 22px 22px, 100% 100%; background-position: center, center; background-repeat: no-repeat; }
.cgBrand strong { display: block; font-size: 17px; line-height: 1.2; }
.cgBrand small { display: block; color: #677487; font-size: 12.5px; }
.cgHeroCopy h2 { margin: 0 0 10px; font-size: 26px; line-height: 1.15; letter-spacing: -.02em; }
.cgHeroCopy p { margin: 0 0 18px; font-size: 15px; line-height: 1.55; color: #5c6a7d; max-width: 46ch; }
.cgActions { display: flex; gap: 10px; flex-wrap: wrap; }
.cgActions .actionButton { text-decoration: none; display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 0 18px; }
.cgActions .actionButton.secondary { background: #fff; border: 1px solid #dde4ee; color: #232a35; }
.cgActions .actionButton.secondary:hover { background: #f5f7fa; }
.cgNote { display: block; margin-top: 12px; font-size: 12.5px; color: #8a93a3; }
.cgWindow { border: 1px solid #e1e7f0; border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 14px 30px rgba(24,39,75,.10); font-size: 12px; }
.cgWindowBar { display: flex; align-items: center; gap: 5px; height: 28px; padding: 0 10px; background: #f1f4f8; border-bottom: 1px solid #e1e7f0; }
.cgWindowBar i { width: 8px; height: 8px; border-radius: 50%; background: #cfd6e0; }
.cgWindowBar span { margin-left: 8px; flex: 1; height: 16px; border-radius: 4px; background: #fff; border: 1px solid #e1e7f0; font-size: 10px; color: #8a93a3; display: flex; align-items: center; padding: 0 6px; }
.cgWindowBody { display: grid; grid-template-columns: 170px minmax(0, 1fr); min-height: 230px; }
.cgList { border-right: 1px solid #edf1f6; padding: 6px; display: grid; align-content: start; gap: 2px; }
.cgListItem { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 7px; align-items: center; padding: 6px; border-radius: 8px; }
.cgListItem.active { background: #f5fde0; }
.cgListItem strong { display: block; font-size: 11.5px; line-height: 1.2; }
.cgListItem span { display: block; font-size: 10.5px; color: #8a93a3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cgAva { width: 26px; height: 26px; border-radius: 50%; background: #e6ebf3; color: #232a35; font-size: 11px; font-weight: 700; display: grid; place-items: center; }
.cgCh { font-style: normal; font-size: 8.5px; font-weight: 700; letter-spacing: .04em; padding: 2px 5px; border-radius: 4px; color: #fff; }
.cgCh--tg { background: #2aabee; } .cgCh--vk { background: #0077ff; } .cgCh--wa { background: #25d366; } .cgCh--avito { background: #00aaff; }
.cgThread { display: grid; align-content: start; gap: 6px; padding: 10px; background: #fafbfc; }
.cgThreadHead { font-size: 10.5px; color: #8a93a3; padding-bottom: 6px; border-bottom: 1px solid #edf1f6; margin-bottom: 4px; }
.cgMsg { max-width: 82%; padding: 6px 9px; border-radius: 10px; line-height: 1.35; font-size: 11.5px; }
.cgMsg.in { background: #fff; border: 1px solid #e6ebf3; border-bottom-left-radius: 3px; justify-self: start; }
.cgMsg.out { background: #12813d; color: #14171a; border-bottom-right-radius: 3px; justify-self: end; }
.cgInput { margin-top: auto; padding: 7px 10px; border: 1px solid #e1e7f0; border-radius: 8px; background: #fff; color: #9aa1ad; font-size: 11px; }
.cgGrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.cgFeature.cgFeature { display: block; padding: 20px; }
.cgFeatureIcon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: #f1f4f8; margin-bottom: 12px; --ez-icon: none; }
.cgFeatureIcon::before { content: ""; width: 20px; height: 20px; background: #232a35; -webkit-mask: var(--ez-icon) center / contain no-repeat; mask: var(--ez-icon) center / contain no-repeat; }
.cgFeatureIcon--channels { --ez-icon: url("data:image/svg+xml;utf8,"); }
.cgFeatureIcon--team { --ez-icon: url("data:image/svg+xml;utf8,"); }
.cgFeatureIcon--crm { --ez-icon: url("data:image/svg+xml;utf8,"); }
.cgFeature strong { display: block; font-size: 15.5px; margin-bottom: 6px; }
.cgFeature p { margin: 0; color: #5c6a7d; font-size: 13.5px; line-height: 1.5; }
.cgSteps.cgSteps { display: block; padding: 22px 24px; }
.cgSteps ol { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.cgSteps li { display: flex; gap: 12px; align-items: flex-start; }
.cgSteps li b { flex: none; width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(152deg, #33363b 0%, #141618 70%); color: #fff; font-size: 13px; display: grid; place-items: center; }
.cgSteps li strong { display: block; font-size: 14.5px; margin-bottom: 3px; }
.cgSteps li span { font-size: 13px; color: #5c6a7d; line-height: 1.45; }
@media (max-width: 1100px) { .cgHero.cgHero { grid-template-columns: 1fr; } .cgWindow { max-width: 520px; } }
@media (max-width: 760px) { .cgGrid, .cgSteps ol { grid-template-columns: 1fr; } .cgHero.cgHero { padding: 22px 18px; } .cgWindowBody { grid-template-columns: 1fr; } .cgList { display: none; } }
.loyaltyTypeModal.loyaltyTypeModal { width: min(520px, calc(100vw - 32px)); }
.loyaltyTypeModalBody.loyaltyTypeModalBody { display: block; padding: 22px 24px; }
.loyaltyTypeModalContent.loyaltyTypeModalContent { max-width: none; }
.loyaltyTypeForm { display: grid; gap: 16px; }
.loyaltyTypePairGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.loyaltyTypeField input { width: 100%; }
.loyaltyTypeHint { margin: 0; padding: 12px 14px; border-radius: 12px; background: #f5f7fa; color: #5c6a7d; font-size: 13.5px; line-height: 1.5; }
.loyaltyTypeModal .clientModalTopMeta { color: #677487; }
.setupModal.setupModal:has(.subscriptionPlanModalHero) { width: min(560px, calc(100vw - 32px)); padding: 28px; border-radius: 20px; background: #fff; }
.subscriptionPlanModalHero.subscriptionPlanModalHero { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 0 0 18px; margin: 0 0 18px; border: 0; border-bottom: 1px solid #e6ebf3; background: none; text-align: left; box-shadow: none; }
.subscriptionPlanModalHero h2 { margin: 8px 0 6px; font-size: 24px; letter-spacing: -.02em; text-align: left; }
.subscriptionPlanModalHero p { margin: 0; color: #677487; font-size: 14.5px; line-height: 1.5; max-width: 40ch; }
.subscriptionPlanModalPrice.subscriptionPlanModalPrice { flex: none; padding: 0; border: 0; background: none; box-shadow: none; text-align: right; }
.subscriptionPlanModalPrice strong { font-size: 28px; letter-spacing: -.02em; }
.subscriptionPlanModalPrice span { display: block; color: #677487; font-size: 13px; }
.subscriptionPlanModalStats.subscriptionPlanModalStats { display: block; margin: 0 0 14px; }
.subscriptionPlanModalStat.subscriptionPlanModalStat { display: none; }
.subscriptionPlanModalStat.subscriptionPlanModalStat:last-child { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; background: #f1f4f8; border: 0; box-shadow: none; }
.subscriptionPlanModalStat:last-child span { font-size: 12.5px; color: #677487; }
.subscriptionPlanModalStat:last-child strong { font-size: 13.5px; }
.subscriptionPlanModalFeatures.subscriptionPlanModalFeatures { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 10px; }
.subscriptionPlanModalFeatures li { position: relative; padding-left: 28px; font-size: 15px; }
.subscriptionPlanModalFeatures li::before {
content: ""; position: absolute; left: 0; top: 2px; width: 18px; height: 18px; border-radius: 50%;
background: #12813d url("data:image/svg+xml;utf8,") center / 11px no-repeat;
}
.subscriptionPlanModalActions.subscriptionPlanModalActions { display: flex; gap: 10px; justify-content: flex-end; }
.subscriptionPlanModalActions .actionButton { min-height: 44px; padding: 0 20px; border-radius: 999px; }
.subscriptionPlanCard.subscriptionPlanCard { background: linear-gradient(180deg, #fff 0%, #fafbfc 100%); }
.subscriptionPlanCard.active.subscriptionPlanCard { background: linear-gradient(180deg, #ffffff 0%, #eef7f1 100%); border-color: #12813d; }
.subscriptionPlanCard::before, .subscriptionPlanCard::after { display: none !important; }
.serviceCategoriesCard .detailText { color: #677487; }
.serviceCategoriesList.serviceCategoriesList { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; margin-top: 18px; }
.serviceCategoryRowButton.serviceCategoryRowButton {
display: block; width: 100%; text-align: left; padding: 18px 18px 16px; border-radius: 16px;
border: 1px solid #e6ebf3; background: linear-gradient(180deg, #fff 0%, #fafbfc 100%);
transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; cursor: pointer;
}
.serviceCategoryRowButton.serviceCategoryRowButton:hover { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(24,39,75,.10); border-color: #12813d; }
.serviceCategoryRowMain { display: grid; gap: 10px; }
.serviceCategoryRowMain strong { display: block; font-size: 16px; margin-bottom: 4px; }
.serviceCategoryRowMain span { color: #677487; font-size: 13.5px; }
.serviceCategoryRowMain .segmentActions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.serviceCategoriesList .emptyState,
.serviceCategoriesList > div:only-child:not(.serviceCategoryRow) { grid-column: 1 / -1; }
.adminAccountTableHeader.adminAccountTableHeader { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 6px 0 10px; }
.accountUsersList .detailItem { padding: 12px 14px; border-radius: 12px; }
.accountUserAccessBlock .tagList { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.accountUserAccessBlock .statusChip { cursor: pointer; min-height: 34px; padding: 0 14px; border-radius: 999px; border: 1px solid #dde4ee; font-weight: 600; }
.accountUserAccessBlock .statusChip.off { background: #fff; color: #677487; }
.accountUserAccessBlock .statusChip.on { border-color: #12813d; }
.pendingInvitationsPanel { display: grid; gap: 12px; margin-bottom: 16px; }
.pendingInvitationCard { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 18px 20px; border-radius: 16px; border: 1px solid #12813d; background: linear-gradient(180deg, #ffffff 0%, #eef7f1 100%); }
.pendingInvitationCard > div > span { display: block; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #5e7300; margin-bottom: 4px; }
.pendingInvitationCard strong { display: block; font-size: 16px; margin-bottom: 4px; }
.pendingInvitationCard p { margin: 0; color: #5c6a7d; font-size: 13.5px; }
.pendingInvitationActions { display: flex; gap: 8px; }
@keyframes ezDraw { from { stroke-dashoffset: 1600; } to { stroke-dashoffset: 0; } }
@keyframes ezFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ezTip { from { opacity: 0; transform: translate(-50%, 6px); } to { opacity: 1; transform: translate(-50%, 0); } }
.statsAreaChart svg path[stroke]:not([stroke-dasharray]) { stroke-dasharray: 1600; stroke-dashoffset: 0; animation: ezDraw 1.1s cubic-bezier(.22,1,.36,1) both; }
.statsAreaChart svg path[fill^="url"] { animation: ezFade .9s ease .35s both; }
.statsAreaChart svg circle { transition: r .18s ease, stroke-width .18s ease; }
.statsAreaChart svg rect[fill="transparent"] { cursor: crosshair; }
.statsChartTip.statsChartTip { animation: ezTip .16s ease both; padding: 8px 12px; border-radius: 10px; font-size: .84rem; box-shadow: 0 10px 24px rgba(15,23,42,.28); }
.statsChartTip.statsChartTip span { opacity: .75; }
.statsChartEmpty.statsChartEmpty { padding: 40px 16px; }
.statsChartEmpty.statsChartEmpty strong { font-size: 15px; color: #232a35; }
.statsChartEmpty.statsChartEmpty span { color: #8a93a3; font-size: 13.5px; }
@media (prefers-reduced-motion: reduce) {
.statsAreaChart svg path[stroke]:not([stroke-dasharray]),
.statsAreaChart svg path[fill^="url"],
.statsChartTip.statsChartTip { animation: none; }
}
.ezAdminLink {
display: flex; align-items: center; gap: 10px;
margin-top: 10px; padding: 10px 12px; border-radius: 12px;
color: #232a35; text-decoration: none; font-weight: 600; font-size: 15px;
border: 1px dashed #c7cfda;
}
.ezAdminLink svg { width: 22px; height: 22px; color: #677487; }
.ezAdminLink:hover { background: #fff; border-color: #12813d; }
.ezServiceList { list-style: none; margin: 4px 0 0; padding: 10px 0 0; border-top: 1px solid #edf1f6; display: grid; gap: 6px; }
.ezServiceList li { display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px; color: #232a35; }
.ezServiceList li span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ezServiceList li b { flex: none; font-weight: 600; font-variant-numeric: tabular-nums; }
.ezServiceList--off { color: #9aa1ad !important; text-decoration: line-through; }
.ezServiceEmpty { margin-top: 4px; padding: 10px 0 0; border-top: 1px dashed #e1e7f0; font-size: 13px; color: #8a93a3; }
.setupModal.setupModal:has(.subscriptionPlanModalHero) { min-height: 0; padding-top: 24px; }
.setupModal:has(.subscriptionPlanModalHero) .setupClose { top: 14px; right: 14px; width: 34px; height: 34px; border-radius: 50%; background: #f1f4f8; }
.subscriptionPlanModalHero.subscriptionPlanModalHero { padding-right: 44px; }
.subscriptionPlanModalStats.subscriptionPlanModalStats { padding: 0; gap: 0; }
.subscriptionPlanModalActions.subscriptionPlanModalActions { margin: 0; padding: 0; }
.adminModalCard.adminModalCard:has(#dashboard-user-add-title) { width: min(640px, calc(100vw - 32px)); }
.adminModalCard:has(#dashboard-user-add-title) .adminAccountFormGrid { align-items: start; }
.adminModalCard:has(#dashboard-user-add-title) .adminAccountField input { min-height: 44px; }
.adminModalCard:has(#dashboard-user-add-title) .adminSelectedAccountActions { justify-content: flex-end; }
.loyaltyTypeModal .clientModalFooter { justify-content: flex-end; }
.adminWorkspace .adminSplit--single > .adminCard.adminCard { width: 100% !important; margin-right: 0 !important; min-height: auto !important; }
.adminPanelShell .adminWorkspace.adminWorkspace { width: 100% !important; max-width: 100%; }
.adminPanelShell .panelMain { overflow-x: hidden; }
.adminCard .adminMetricGrid.adminMetricGrid { width: 100%; }
.ezMaPanel.ezMaPanel { padding: 10px 24px 0; display: block; }
.ezMaFrame { display: block; width: 100%; height: calc(100vh - 118px); min-height: 640px; border: 0; background: transparent; }
.ezMaError.ezMaError { display: grid; gap: 8px; justify-items: start; padding: 20px 24px; color: #5c6a7d; }
.ezMaError strong { color: #b42318; }
.ezMaError p { margin: 0; }
.ezMaEmpty { padding: 24px; color: #8a93a3; font-size: 14px; }
.ezMaPanel.ezMaPanelModal { min-height: calc(100vh - 108px); }
.ezMaFrame.ezMaFrameModal { position: fixed; inset: 0; width: 100vw; height: 100vh; min-height: 0; z-index: 3000; }
html.ezMaModal { overflow: hidden; }
html.ezMaHost .panelShell, html.ezMaHost .panelMain, html.ezMaHost .ezMaPanel.ezMaPanel { animation: none !important; transform: none !important; }
html.ezMaModal .panelShell, html.ezMaModal .panelMain, html.ezMaModal .ezMaPanel.ezMaPanel { z-index: 4000 !important; }
@media (max-width: 720px) { .ezMaPanel.ezMaPanel { padding: 8px 12px 0; } .ezMaFrame { height: calc(100vh - 150px); min-height: 520px; } }
.analyticsEnhKpiCard.analyticsEnhKpiCard { border-top: 1px solid #e6ebf3; }
.analyticsEnhKpiCard:hover { box-shadow: 0 6px 20px rgba(15,23,42,.08); }
.analyticsEnhKpiLabel { display: inline-flex; align-items: center; gap: 7px; }
.analyticsEnhKpiLabel::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #9aa3b2; flex: none; }
.analyticsEnhKpiCard--green .analyticsEnhKpiLabel::before { background: #12813d; }
.analyticsEnhKpiCard--red .analyticsEnhKpiLabel::before { background: #d64b2a; }
.analyticsEnhKpiCard--blue .analyticsEnhKpiLabel::before { background: #1b1f24; }
.analyticsEnhKpiCard--purple .analyticsEnhKpiLabel::before, .analyticsEnhKpiCard--orange .analyticsEnhKpiLabel::before { background: #6b7280; }
.analyticsEnhKpiCard--blue svg path[stroke] { stroke: #1b1f24; }
.analyticsEnhKpiCard--blue svg circle { fill: #1b1f24; }
.analyticsEnhKpiCard--blue svg linearGradient stop { stop-color: #1b1f24; }
.analyticsEnhKpiCard--purple svg path[stroke], .analyticsEnhKpiCard--orange svg path[stroke] { stroke: #6b7280; }
.analyticsEnhKpiCard--purple svg circle, .analyticsEnhKpiCard--orange svg circle { fill: #6b7280; }
.analyticsEnhKpiCard--purple svg linearGradient stop, .analyticsEnhKpiCard--orange svg linearGradient stop { stop-color: #6b7280; }
.analyticsEnhKpiCard--red svg path[stroke] { stroke: #d64b2a; }
.analyticsEnhKpiCard--red svg circle { fill: #d64b2a; }
.analyticsEnhKpiCard--red svg linearGradient stop { stop-color: #d64b2a; }
.analyticsEnhKpiCard--green svg path[stroke] { stroke: #12813d; }
.analyticsEnhKpiCard--green svg circle { fill: #12813d; }
.analyticsEnhKpiCard--green svg linearGradient stop { stop-color: #12813d; }
.statsCardHead h3 { font-size: 16px; }
@media (max-width: 720px) { .analyticsDashboard .statsAreaChart { overflow-x: auto; -webkit-overflow-scrolling: touch; } .analyticsDashboard .statsAreaChart svg { min-width: 860px; } }
.ezUtmCard.ezUtmCard { display: grid; gap: 12px; }
.ezUtmText { margin: 0; color: #5c6a7d; font-size: 13px; line-height: 1.5; max-width: 720px; }
.ezUtmSelect { border: 1px solid #dfe5ee; border-radius: 10px; padding: 6px 10px; font: inherit; font-size: 13px; background: #fff; color: #232a35; }
.ezUtmForm { display: flex; gap: 10px; }
.ezUtmForm input { flex: 1; min-width: 0; border: 1px solid #dfe5ee; border-radius: 12px; padding: 10px 14px; font: inherit; font-size: 14px; color: #232a35; background: #fff; }
.ezUtmForm input:focus { outline: none; border-color: #12813d; box-shadow: 0 0 0 3px rgba(18,129,61,0.11); }
.ezUtmForm .actionButton { flex: none; }
.ezUtmError { color: #b42318; font-size: 13px; }
.ezUtmEmpty { display: grid; gap: 6px; justify-items: start; padding: 22px 0 6px; color: #5c6a7d; font-size: 14px; }
.ezUtmEmpty strong { color: #232a35; }
.ezUtmEmpty .ezUtmGo { margin-top: 6px; flex: none; }
.ezUtmTableWrap { overflow-x: auto; margin: 0 -4px; }
.ezUtmTable { width: 100%; border-collapse: collapse; font-size: 13px; }
.ezUtmTable th { text-align: left; font-weight: 600; color: #8a93a3; font-size: 12px; padding: 8px 10px; border-bottom: 1px solid #edf1f6; white-space: nowrap; }
.ezUtmTable td { padding: 11px 10px; border-bottom: 1px solid #f1f4f8; vertical-align: middle; color: #232a35; }
.ezUtmTable tr:last-child td { border-bottom: 0; }
.ezUtmTable th.num, .ezUtmTable td.num { text-align: right; font-variant-numeric: tabular-nums; }
.ezUtmLinkCell { display: flex; align-items: center; gap: 8px; }
.ezUtmLinkCell code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; background: #f3f5f8; border-radius: 6px; padding: 4px 8px; color: #3d4756; white-space: nowrap; }
.ezUtmCopy, .ezUtmRemove { border: 0; background: none; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; padding: 4px 6px; border-radius: 6px; }
.ezUtmCopy { color: #12813d; }
.ezUtmCopy:hover { background: #eef8e6; }
.ezUtmRemove { color: #8a93a3; }
.ezUtmRemove:hover { color: #b42318; background: #fdeceb; }
.ezUtmDate { color: #8a93a3; white-space: nowrap; }
.ezUtmActions { text-align: right; }
@media (max-width: 720px) { .ezUtmForm { flex-direction: column; } .ezUtmTable td, .ezUtmTable th { padding: 8px 6px; } }
.ezSalesPanel.ezSalesPanel { display: grid; gap: 14px; }
.ezSalesTabs { display: flex; align-items: center; gap: 8px; }
.ezSalesTabs > button { border: 1px solid #dfe5ee; background: #fff; border-radius: 10px; padding: 8px 14px; font: inherit; font-size: 14px; font-weight: 600; color: #3d4756; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
.ezSalesTabs > button.active { background: #1b1f24; border-color: #1b1f24; color: #fff; }
.ezSalesCount { background: rgba(255,255,255,.18); border-radius: 999px; padding: 1px 7px; font-size: 12px; }
.ezSalesTabs > button:not(.active) .ezSalesCount { background: #f3f5f8; }
.ezSalesToday { margin-left: auto; color: #5c6a7d; font-size: 13px; }
.ezSalesToday b { color: #232a35; }
.ezSalesWh { border: 1px solid #dfe5ee; border-radius: 10px; padding: 7px 10px; font: inherit; font-size: 13px; background: #fff; }
.ezSalesError { color: #b42318; font-size: 13px; padding: 10px 14px; background: #fdeceb; border-radius: 10px; }
.ezSalesDone { display: flex; align-items: center; gap: 16px; padding: 12px 16px; background: #eef8e6; border: 1px solid #cfe9bd; border-radius: 12px; font-size: 13px; color: #1f2a22; }
.ezSalesDone strong { display: block; color: #12813d; margin-bottom: 2px; }
.ezSalesDone > div { flex: 1; }
.ezSalesGrid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 14px; align-items: start; }
.ezSalesCart.ezSalesCart, .ezSalesSide.ezSalesSide, .ezSalesList.ezSalesList { display: grid; gap: 14px; padding: 18px; animation: none; }
.ezSalesSearch { position: relative; }
.ezSalesSearch input { width: 100%; border: 1px solid #dfe5ee; border-radius: 12px; padding: 12px 14px; font: inherit; font-size: 15px; background: #fff; color: #232a35; box-sizing: border-box; }
.ezSalesSearch input:focus { outline: none; border-color: #12813d; box-shadow: 0 0 0 3px rgba(18,129,61,0.11); }
.ezSalesDrop { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; background: #fff; border: 1px solid #e6ebf3; border-radius: 12px; box-shadow: 0 12px 32px rgba(15,23,42,.12); overflow: hidden; }
.ezSalesDrop button { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 14px; border: 0; background: none; font: inherit; font-size: 14px; color: #232a35; cursor: pointer; text-align: left; }
.ezSalesDrop button:hover { background: #f3f5f8; }
.ezSalesDrop small { color: #8a93a3; white-space: nowrap; }
.ezSalesHint { color: #8a93a3; font-size: 13px; padding: 26px 8px; text-align: center; }
.ezSalesTable { width: 100%; border-collapse: collapse; font-size: 14px; }
.ezSalesTable th { text-align: left; font-weight: 600; color: #8a93a3; font-size: 12px; padding: 6px 8px; border-bottom: 1px solid #edf1f6; white-space: nowrap; }
.ezSalesTable td { padding: 10px 8px; border-bottom: 1px solid #f1f4f8; vertical-align: middle; }
.ezSalesTable tr:last-child td { border-bottom: 0; }
.ezSalesTable th.num, .ezSalesTable td.num { text-align: right; font-variant-numeric: tabular-nums; }
.ezSalesTable td strong { display: block; font-weight: 600; }
.ezSalesTable td small { color: #8a93a3; font-size: 12px; }
.ezSalesTable tr.short td small { color: #b42318; }
.ezSalesTable tr.cancelled td { color: #a0a8b4; text-decoration: line-through; }
.ezSalesTable tr.cancelled td.ezSalesActions { text-decoration: none; }
.ezSalesQty { display: inline-flex; align-items: center; border: 1px solid #dfe5ee; border-radius: 10px; overflow: hidden; }
.ezSalesQty button { width: 32px; height: 34px; border: 0; background: #f7f8fa; font-size: 18px; cursor: pointer; color: #3d4756; }
.ezSalesQty input { width: 58px; height: 34px; border: 0; text-align: center; font: inherit; font-size: 14px; -moz-appearance: textfield; }
.ezSalesQty input::-webkit-outer-spin-button, .ezSalesQty input::-webkit-inner-spin-button { -webkit-appearance: none; }
.ezSalesPrice { width: 96px; border: 1px solid #dfe5ee; border-radius: 10px; padding: 7px 8px; font: inherit; font-size: 14px; text-align: right; }
.ezSalesRemove { border: 0; background: none; color: #8a93a3; font-size: 20px; cursor: pointer; padding: 4px 8px; border-radius: 8px; }
.ezSalesRemove:hover { color: #b42318; background: #fdeceb; }
.ezSalesField { display: grid; gap: 6px; }
.ezSalesField > label { font-size: 12px; font-weight: 600; color: #8a93a3; }
.ezSalesField input:not([type=number]), .ezSalesField input[type=number] { border: 1px solid #dfe5ee; border-radius: 12px; padding: 10px 12px; font: inherit; font-size: 14px; background: #fff; width: 100%; box-sizing: border-box; }
.ezSalesField input:disabled { background: #f7f8fa; color: #a0a8b4; }
.ezSalesRow { grid-template-columns: 1fr 1fr; }
.ezSalesRow > div { display: grid; gap: 6px; align-content: start; }
.ezSalesRow label { font-size: 12px; font-weight: 600; color: #8a93a3; }
.ezSalesClient { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; background: #f7f8fa; border-radius: 12px; }
.ezSalesClient strong { display: block; font-size: 14px; }
.ezSalesClient small { color: #5c6a7d; font-size: 12px; }
.ezSalesNote { color: #8a93a3; font-size: 12px; }
.ezSalesLink { border: 0; background: none; color: #12813d; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; padding: 2px 0; justify-self: start; }
.ezSalesPay { display: flex; gap: 6px; }
.ezSalesPay button { flex: 1; border: 1px solid #dfe5ee; background: #fff; border-radius: 10px; padding: 9px 6px; font: inherit; font-size: 13px; font-weight: 600; color: #3d4756; cursor: pointer; }
.ezSalesPay button.active { background: #eef8e6; border-color: #12813d; color: #12813d; }
.ezSalesTotals { display: grid; gap: 6px; padding-top: 10px; border-top: 1px solid #edf1f6; font-size: 14px; color: #5c6a7d; }
.ezSalesTotals > div { display: flex; justify-content: space-between; }
.ezSalesTotals b { color: #232a35; font-variant-numeric: tabular-nums; }
.ezSalesTotal { font-size: 18px; }
.ezSalesTotal b { font-size: 22px; }
.ezSalesEarn b { color: #12813d; }
.ezSalesSubmit.ezSalesSubmit { width: 100%; justify-content: center; padding: 13px; font-size: 15px; }
.ezSalesEmpty { padding: 24px; color: #8a93a3; font-size: 14px; }
.ezSalesEmptyCard.ezSalesEmptyCard { display: grid; gap: 6px; padding: 26px 20px; color: #5c6a7d; font-size: 14px; }
.ezSalesEmptyCard strong { color: #232a35; }
.ezSalesError.detailCard { display: grid; gap: 8px; justify-items: start; }
.ezSalesTableWrap { overflow-x: auto; }
.ezSalesHistory td { font-size: 13px; }
.ezSalesDate { color: #8a93a3; white-space: nowrap; }
.ezSalesItems { color: #5c6a7d; max-width: 360px; }
.ezSalesMuted { color: #a0a8b4; }
.ezSalesActions { text-align: right; }
.ezSalesRemoveText { border: 0; background: none; color: #8a93a3; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; padding: 4px 6px; border-radius: 6px; }
.ezSalesRemoveText:hover { color: #b42318; background: #fdeceb; }
@media (max-width: 900px) { .ezSalesGrid { grid-template-columns: 1fr; } .ezSalesToday { display: none; } }
.whHide.whHide { display: none !important; }
.whStockTable th:nth-child(5), .whStockTable td:nth-child(5), .whStockTable th:nth-child(6), .whStockTable td:nth-child(6) { display: none; }
.ezTfStatus { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; border: 1px solid #e3e8e4; border-radius: 12px; background: #f7faf8; }
.ezTfStatusText { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ezTfStatusText strong { font-size: 14px; color: #111117; }
.ezTfStatusText small { font-size: 12.5px; line-height: 1.4; color: #5f6b64; }
.ezTfStatus .setupSecondary { flex: 0 0 auto; white-space: nowrap; padding: 8px 14px; font-size: 13px; }
@media (max-width: 640px) { .ezTfStatus { flex-direction: column; align-items: stretch; } .ezTfStatus .setupSecondary { width: 100%; } }
.ezCrmBar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 10px; padding: 10px 14px; border: 1px solid #e3e8e4; border-radius: 12px; background: #f7faf8; font-size: 13.5px; color: #4a5560; }
.ezCrmBar .actionButton { flex: 0 0 auto; white-space: nowrap; }
.ezMaFrame.ezCrmFrame { height: calc(100vh - 172px); min-height: 600px; border: 1px solid #e3e8e4; border-radius: 12px; background: #fff; }
@media (max-width: 720px) { .ezCrmBar { flex-direction: column; align-items: stretch; } .ezMaFrame.ezCrmFrame { height: calc(100vh - 220px); min-height: 480px; } }
.ezCrmLinkCard.ezCrmLinkCard { max-width: 640px; padding: 26px 28px; display: block; }
.ezCrmLinkBadge { display: inline-block; padding: 4px 12px; border-radius: 999px; background: #12813d; color: #1f2630; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.ezCrmLinkTitle { margin: 12px 0 8px; font-size: 22px; font-weight: 700; color: #1f2630; }
.ezCrmLinkText { margin: 0; font-size: 14.5px; line-height: 1.55; color: #4a5560; }
.ezCrmLinkList { margin: 14px 0 0; padding: 0 0 0 18px; color: #4a5560; font-size: 13.5px; line-height: 1.6; }
.ezCrmLinkActions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.ezCrmLinkError { margin: 12px 0 0; color: #b42318; font-size: 13px; }
.ezCrmLinkHint { margin: 16px 0 0; font-size: 12.5px; color: #8a93a3; }
.ezCrmLinkHint a { color: #4a5560; }
@media (max-width: 720px) { .ezCrmLinkCard.ezCrmLinkCard { padding: 20px 18px; } .ezCrmLinkActions .actionButton { flex: 1 1 auto; } }
.panelMain::after { content: "ez-business — сервис компании ООО «ОРВИО» · © 2026 ООО «ОРВИО»"; display: block; margin-top: auto; padding: 18px 24px 6px; text-align: center; font-size: 12px; color: #8a93a3; }
@media (max-width: 720px) { .panelMain::after { padding: 14px 16px 4px; font-size: 11.5px; } }
@media (max-width: 900px) {
.loyaltyCardsFiltersGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.loyaltyCardsControlsRow { grid-template-columns: 1fr; }
.loyaltyCardsLayout, .loyaltyCardsFilterCard, .loyaltyCardsTableCard { max-width: 100%; min-width: 0; }
.loyaltyCardsTableCard, .loyaltyTransactionsTableCard { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 720px) {
.whList { padding: 14px 12px; max-width: 100%; min-width: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.whListToolbar { flex-wrap: wrap; row-gap: 8px; }
.whListTable { min-width: 560px; }
.finOpsPanel, .finOpsAnalytics { max-width: 100%; min-width: 0; }
.finOpsActionBtns { justify-self: stretch; flex-wrap: wrap; }
.finOpsActionBtns .actionButton { flex: 1 1 45%; }
.finOpsTable { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.finOpsHeaderRow, .finOpsRow { min-width: 900px; }
.finOpsKpiRow { grid-template-columns: 1fr 1fr; gap: 10px; }
.finOpsChartsRow { grid-template-columns: 1fr; }
.loyaltyCardsFiltersGrid { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) and (min-width: 721px) {
.finOpsKpiRow { grid-template-columns: repeat(2, 1fr); }
.finOpsChartsRow { grid-template-columns: 1fr; }
.finOpsTable { overflow-x: auto; }
.finOpsHeaderRow, .finOpsRow { min-width: 900px; }
}
.ezAccessNoteText { font-size: 13px; line-height: 1.5; color: #4a5560; padding: 10px 12px; border: 1px solid #e3e8e4; border-radius: 10px; background: #f7faf8; }
.ezCalPanel.ezCalPanel { display: block; }
.ezCalCard.ezCalCard { display: grid; gap: 14px; padding: 18px 18px 14px; animation: none; min-width: 0; }
.ezCalTop { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px 18px; flex-wrap: wrap; }
.ezCalTitle h2 { margin: 0; font-size: 20px; line-height: 1.25; font-weight: 700; color: #1b1f24; letter-spacing: -.01em; }
.ezCalTitle p { margin: 4px 0 0; font-size: 13px; color: #8a93a3; }
.ezCalControls { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ezCalNav, .ezCalViews { display: inline-flex; border: 1px solid #dfe5ee; border-radius: 10px; overflow: hidden; background: #fff; }
.ezCalNav button, .ezCalViews button { border: 0; background: none; font: inherit; font-size: 14px; font-weight: 600; color: #3d4756; padding: 8px 12px; cursor: pointer; line-height: 1.2; }
.ezCalNav button + button, .ezCalViews button + button { border-left: 1px solid #dfe5ee; }
.ezCalNav button:first-child, .ezCalNav button:last-child { font-size: 18px; padding: 5px 12px 7px; }
.ezCalNav button:hover, .ezCalViews button:hover { background: #f5f7fa; }
.ezCalToday.current { color: #12813d; }
.ezCalViews button.active { background: #1b1f24; color: #fff; }
.ezCalStaff { border: 1px solid #dfe5ee; border-radius: 10px; padding: 8px 10px; font: inherit; font-size: 14px; background: #fff; color: #232a35; max-width: 200px; }
.ezCalActions { display: inline-flex; gap: 8px; }
.ezCalActions .actionButton { white-space: nowrap; }
.ezCalGridWrap { border: 1px solid #e6ebf2; border-radius: 12px; overflow: hidden; background: #fff; min-width: 0; }
.ezCalGridHead { display: grid; border-bottom: 1px solid #e6ebf2; background: #fafbfc; }
.ezCalGutterHead { border-right: 1px solid #eef1f5; }
.ezCalDayHead { border: 0; border-left: 1px solid #eef1f5; background: none; font: inherit; padding: 8px 6px 7px; display: grid; justify-items: center; gap: 1px; cursor: pointer; color: #5c6a7d; min-width: 0; }
.ezCalDayHead:first-of-type { border-left: 0; }
.ezCalDayHead span { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.ezCalDayHead b { font-size: 18px; line-height: 1.2; color: #1b1f24; font-weight: 700; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; }
.ezCalDayHead small { font-size: 11px; color: #8a93a3; white-space: nowrap; }
.ezCalDayHead.weekend span { color: #a0a8b4; }
.ezCalDayHead.today span { color: #12813d; }
.ezCalDayHead.today b { background: #12813d; color: #fff; }
.ezCalDayHead:hover { background: #f3f5f8; }
.ezCalGridWrap.day .ezCalDayHead { justify-items: start; grid-auto-flow: column; justify-content: start; align-items: center; gap: 8px; padding-left: 12px; cursor: default; }
.ezCalGridWrap.day .ezCalDayHead:hover { background: none; }
.ezCalScroll { max-height: calc(100vh - 250px); min-height: 360px; overflow-y: auto; overscroll-behavior: contain; }
.ezCalGrid { display: grid; position: relative; }
.ezCalGutter { position: relative; border-right: 1px solid #eef1f5; }
.ezCalGutter span { position: absolute; right: 8px; transform: translateY(-50%); font-size: 11px; color: #8a93a3; font-variant-numeric: tabular-nums; background: #fff; padding: 0 2px; }
.ezCalGutter span:first-child { transform: none; top: 2px !important; }
.ezCalCol { position: relative; border-left: 1px solid #eef1f5; cursor: copy; background-image: linear-gradient(to bottom, #eef1f5 1px, transparent 1px), linear-gradient(to bottom, transparent calc(50% - 1px), #f5f7fa calc(50% - 1px), #f5f7fa 50%, transparent 50%); background-repeat: repeat; }
.ezCalCol:first-of-type { border-left: 0; }
.ezCalCol.today { background-color: #fbfdfb; }
.ezCalCol.past { background-color: #fcfcfd; }
.ezCalCol:hover { background-color: #f8faf9; }
.ezCalNow { position: absolute; left: 0; right: 0; height: 2px; background: #d14343; z-index: 3; pointer-events: none; }
.ezCalNow::before { content: ""; position: absolute; left: -5px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: #d14343; }
.ezCalBlock { position: absolute; z-index: 2; box-sizing: border-box; border-radius: 8px; border: 1px solid transparent; border-left-width: 3px; padding: 4px 7px; overflow: hidden; cursor: pointer; display: flex; flex-direction: column; gap: 1px; font-size: 12px; line-height: 1.3; user-select: none; -webkit-user-select: none; box-shadow: 0 1px 2px rgba(22, 27, 34, .06); }
.ezCalBlock:hover { box-shadow: 0 4px 12px rgba(22, 27, 34, .12); z-index: 4; }
.ezCalBlock:focus-visible { outline: 2px solid #1b1f24; outline-offset: 1px; }
.ezCalBlock.dragging { opacity: .88; box-shadow: 0 10px 24px rgba(22, 27, 34, .2); z-index: 6; cursor: grabbing; }
.ezCalBlock.short { flex-direction: row; align-items: center; gap: 6px; padding-top: 2px; padding-bottom: 2px; }
.ezCalBlockTime { font-size: 11px; font-weight: 600; opacity: .8; font-variant-numeric: tabular-nums; white-space: nowrap; display: inline-flex; align-items: center; gap: 5px; }
.ezCalBlockTitle { font-size: 12.5px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ezCalBlockSub { font-size: 11.5px; opacity: .78; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ezCalPaidMark { font-style: normal; font-size: 10px; font-weight: 700; width: 15px; height: 15px; border-radius: 50%; display: inline-grid; place-items: center; background: #12813d; color: #fff; }
.ezCalResize { position: absolute; left: 0; right: 0; bottom: 0; height: 7px; cursor: ns-resize; }
.ezCalBlock--wait { background: #eef3fb; border-color: #d9e3f5; border-left-color: #4a74c9; color: #1d2f55; }
.ezCalBlock--done { background: #e8f5ec; border-color: #cbe8d4; border-left-color: #12813d; color: #0e3b20; }
.ezCalBlock--miss { background: #fbeeee; border-color: #f2d4d4; border-left-color: #c84040; color: #5c1d1d; }
.ezCalBlock--miss .ezCalBlockTitle { text-decoration: line-through; text-decoration-thickness: 1px; }
.ezCalBlock--break { background: repeating-linear-gradient(135deg, #f3f5f8 0 6px, #eaeef3 6px 12px); border-color: #e1e6ed; border-left-color: #aab4c2; color: #5c6a7d; box-shadow: none; }
.ezCalDayLayout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 14px; align-items: start; }
.ezCalAgenda { display: grid; gap: 12px; }
.ezCalStats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ezCalStats > div { border: 1px solid #e6ebf2; border-radius: 10px; padding: 9px 11px; display: grid; gap: 2px; background: #fafbfc; }
.ezCalStats span { font-size: 11.5px; color: #8a93a3; }
.ezCalStats b { font-size: 16px; color: #1b1f24; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ezCalAgendaList { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: calc(100vh - 380px); overflow-y: auto; }
.ezCalAgendaItem { width: 100%; display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 10px; align-items: center; text-align: left; border: 1px solid #e6ebf2; border-left-width: 3px; border-radius: 10px; padding: 8px 10px; background: #fff; font: inherit; cursor: pointer; color: #232a35; }
.ezCalAgendaItem:hover { background: #f7f8fa; }
.ezCalAgendaItem--wait { border-left-color: #4a74c9; }
.ezCalAgendaItem--done { border-left-color: #12813d; }
.ezCalAgendaItem--miss { border-left-color: #c84040; }
.ezCalAgendaItem--break { border-left-color: #aab4c2; color: #5c6a7d; }
.ezCalAgendaTime { display: grid; font-size: 13px; font-weight: 650; font-variant-numeric: tabular-nums; }
.ezCalAgendaTime small { font-size: 11.5px; font-weight: 500; color: #8a93a3; }
.ezCalAgendaText { display: grid; min-width: 0; }
.ezCalAgendaText b { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ezCalAgendaText small { font-size: 12px; color: #8a93a3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ezCalAgendaEmpty { margin: 0; padding: 18px 12px; font-size: 13px; color: #8a93a3; text-align: center; border: 1px dashed #dfe5ee; border-radius: 10px; }
.ezCalBadge { font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
.ezCalBadge--wait { background: #eef3fb; color: #2d4f94; }
.ezCalBadge--done { background: #e8f5ec; color: #12813d; }
.ezCalBadge--miss { background: #fbeeee; color: #a33333; }
.ezCalMonth { border: 1px solid #e6ebf2; border-radius: 12px; overflow: hidden; background: #fff; }
.ezCalMonthHead { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background: #fafbfc; border-bottom: 1px solid #e6ebf2; }
.ezCalMonthHead span { padding: 8px 10px; font-size: 12px; font-weight: 600; color: #5c6a7d; text-transform: uppercase; letter-spacing: .04em; }
.ezCalMonthHead span.weekend { color: #a0a8b4; }
.ezCalMonthGrid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.ezCalCell { min-height: 104px; border-right: 1px solid #eef1f5; border-bottom: 1px solid #eef1f5; padding: 6px 6px 8px; display: flex; flex-direction: column; gap: 3px; cursor: pointer; min-width: 0; background: #fff; }
.ezCalCell:nth-child(7n) { border-right: 0; }
.ezCalCell:hover { background: #f8faf9; }
.ezCalCell.outside { background: #fafbfc; }
.ezCalCell.outside .ezCalCellNum { color: #b3bbc6; }
.ezCalCellNum { font-size: 13px; font-weight: 650; color: #232a35; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; margin-bottom: 2px; }
.ezCalCell.today .ezCalCellNum { background: #12813d; color: #fff; }
.ezCalChip { border: 0; border-left: 3px solid; border-radius: 5px; padding: 2px 6px; font: inherit; font-size: 12px; text-align: left; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; color: #232a35; }
.ezCalChip b { font-weight: 650; font-variant-numeric: tabular-nums; }
.ezCalChip--wait { background: #eef3fb; border-left-color: #4a74c9; }
.ezCalChip--done { background: #e8f5ec; border-left-color: #12813d; }
.ezCalChip--miss { background: #fbeeee; border-left-color: #c84040; color: #7a3434; }
.ezCalChip:hover { filter: brightness(.97); }
.ezCalMore { font-size: 11.5px; color: #5c6a7d; padding-left: 4px; font-weight: 600; }
.ezCalDots { display: none; gap: 3px; padding-left: 4px; }
.ezCalDots i { width: 6px; height: 6px; border-radius: 50%; background: #4a74c9; }
.ezCalDots i.ezCalDot--done { background: #12813d; }
.ezCalDots i.ezCalDot--miss { background: #c84040; }
.ezCalLegend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; font-size: 12px; color: #5c6a7d; }
.ezCalLegend span { display: inline-flex; align-items: center; gap: 6px; }
.ezCalLegend span::before { content: ""; width: 10px; height: 10px; border-radius: 3px; border-left: 3px solid; }
.ezCalLegend--wait::before { background: #eef3fb; border-color: #4a74c9; }
.ezCalLegend--done::before { background: #e8f5ec; border-color: #12813d; }
.ezCalLegend--miss::before { background: #fbeeee; border-color: #c84040; }
.ezCalLegend--break::before { background: repeating-linear-gradient(135deg, #f3f5f8 0 3px, #e1e6ed 3px 6px); border-color: #aab4c2; }
.ezCalLegend em { font-style: normal; margin-left: auto; color: #a0a8b4; }
.ezCalLayer { position: fixed; inset: 0; z-index: 1200; background: rgba(15, 20, 28, .42); display: flex; align-items: flex-start; justify-content: center; padding: 5vh 16px 24px; overflow-y: auto; }
.ezCalModal { width: 100%; max-width: 560px; background: #fff; border-radius: 16px; box-shadow: 0 24px 60px -20px rgba(13, 15, 18, .35); display: flex; flex-direction: column; max-height: calc(100dvh - 8vh); }
.ezCalModalHead { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 20px 12px; border-bottom: 1px solid #eef1f5; }
.ezCalModalHead h3 { margin: 0; font-size: 18px; font-weight: 700; color: #1b1f24; }
.ezCalModalHead p { margin: 3px 0 0; font-size: 13px; color: #5c6a7d; }
.ezCalClose { border: 0; background: none; font-size: 26px; line-height: 1; color: #8a93a3; cursor: pointer; padding: 0 4px; border-radius: 8px; }
.ezCalClose:hover { color: #1b1f24; background: #f3f5f8; }
.ezCalModalBody { padding: 14px 20px 6px; display: grid; gap: 12px; overflow-y: auto; }
.ezCalModalFoot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 20px 16px; border-top: 1px solid #eef1f5; flex-wrap: wrap; }
.ezCalFootLeft, .ezCalFootRight { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ezCalFootRight { margin-left: auto; }
.ezCalConfirm { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; width: 100%; }
.ezCalConfirm span { flex: 1 1 220px; font-size: 13.5px; color: #7a2424; }
.ezCalKind { display: inline-flex; border: 1px solid #dfe5ee; border-radius: 10px; overflow: hidden; justify-self: start; }
.ezCalKind button { border: 0; background: #fff; font: inherit; font-size: 13.5px; font-weight: 600; color: #5c6a7d; padding: 7px 14px; cursor: pointer; }
.ezCalKind button + button { border-left: 1px solid #dfe5ee; }
.ezCalKind button.active { background: #1b1f24; color: #fff; }
.ezCalField { display: grid; gap: 6px; min-width: 0; margin: 0; }
.ezCalField > span { font-size: 12.5px; font-weight: 600; color: #5c6a7d; }
.ezCalField input, .ezCalField select, .ezCalField textarea, .ezCalSearch input { width: 100%; box-sizing: border-box; border: 1px solid #dfe5ee; border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 14px; color: #232a35; background: #fff; min-height: 40px; }
.ezCalField textarea { resize: vertical; min-height: 60px; font-family: inherit; }
.ezCalField input:focus, .ezCalField select:focus, .ezCalField textarea:focus, .ezCalSearch input:focus { outline: none; border-color: #12813d; box-shadow: 0 0 0 3px rgba(18, 129, 61, .14); }
.ezCalRow1, .ezCalRow2, .ezCalRow3 { display: grid; gap: 10px; }
.ezCalRow2 { grid-template-columns: 1fr 1fr; }
.ezCalRow3 { grid-template-columns: 1.25fr 1fr 1.15fr; }
.ezCalHint { font-size: 12px; color: #8a93a3; line-height: 1.4; }
.ezCalWarn { margin: 0; font-size: 12.5px; color: #7a5a12; background: #fdf6e3; border: 1px solid #f1e2b8; border-radius: 10px; padding: 8px 11px; line-height: 1.4; }
.ezCalError { margin: 0; font-size: 13px; color: #b42318; background: #fdeceb; border-radius: 10px; padding: 9px 12px; }
.ezCalSeg { display: flex; gap: 6px; flex-wrap: wrap; }
.ezCalSeg button { flex: 1 1 0; min-width: 90px; border: 1px solid #dfe5ee; background: #fff; border-radius: 10px; padding: 8px 10px; font: inherit; font-size: 13.5px; font-weight: 600; color: #5c6a7d; cursor: pointer; }
.ezCalSeg button:hover { background: #f7f8fa; }
.ezCalSeg button.active { background: #1b1f24; border-color: #1b1f24; color: #fff; }
.ezCalSeg button.ezCalSeg--done.active { background: #12813d; border-color: #12813d; }
.ezCalSeg button.ezCalSeg--miss.active { background: #c84040; border-color: #c84040; }
.ezCalSeg--small button { flex: 0 1 auto; min-width: 0; padding: 6px 12px; font-size: 13px; }
.ezCalPay { display: grid; gap: 8px; padding: 10px 12px; border: 1px solid #eef1f5; border-radius: 12px; background: #fafbfc; }
.ezCalCheck { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #232a35; cursor: pointer; }
.ezCalCheck input { width: 18px; height: 18px; accent-color: #12813d; margin: 0; }
.ezCalSearch { position: relative; }
.ezCalDrop { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 5; background: #fff; border: 1px solid #e6ebf3; border-radius: 12px; box-shadow: 0 12px 32px rgba(15, 23, 42, .14); overflow: hidden; max-height: 290px; overflow-y: auto; }
.ezCalDrop button { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 12px; border: 0; background: none; font: inherit; font-size: 14px; color: #232a35; cursor: pointer; text-align: left; }
.ezCalDrop button:hover { background: #f3f5f8; }
.ezCalDrop small { color: #8a93a3; white-space: nowrap; font-size: 12.5px; }
.ezCalDrop .ezCalDropNew { color: #12813d; font-weight: 600; border-top: 1px solid #eef1f5; }
.ezCalDropEmpty { margin: 0; padding: 10px 12px 4px; font-size: 13px; color: #8a93a3; }
.ezCalClientCard { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 1px solid #e6ebf2; border-radius: 12px; background: #fafbfc; }
.ezCalAvatar { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 50%; background: #e8f5ec; color: #12813d; display: grid; place-items: center; font-weight: 700; font-size: 15px; }
.ezCalClientText { flex: 1; display: grid; min-width: 0; }
.ezCalClientText b { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ezCalClientText small { font-size: 12.5px; color: #5c6a7d; }
.ezCalLink { border: 0; background: none; color: #12813d; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; padding: 4px 2px; justify-self: start; }
.ezCalLink:hover { text-decoration: underline; }
.ezCalIconBtn { border: 0; background: none; color: #8a93a3; font-size: 20px; line-height: 1; cursor: pointer; padding: 2px 6px; border-radius: 8px; }
.ezCalIconBtn:hover { color: #1b1f24; background: #eef1f5; }
.ezCalNewClient { display: grid; gap: 10px; padding: 10px 12px; border: 1px dashed #cfd7e3; border-radius: 12px; }
.ezCalDanger { border: 0; background: none; color: #b42318; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; padding: 6px 4px; border-radius: 8px; }
.ezCalDanger:hover { background: #fdeceb; }
@media (max-width: 1180px) {
.ezCalDayLayout { grid-template-columns: 1fr; }
.ezCalAgendaList { max-height: none; }
}
@media (max-width: 760px) {
.ezCalCard.ezCalCard { padding: 12px 10px 10px; gap: 10px; }
.ezCalTop { gap: 10px; }
.ezCalTitle h2 { font-size: 17px; }
.ezCalControls { width: 100%; }
.ezCalActions { width: 100%; }
.ezCalActions .actionButton { flex: 1; justify-content: center; }
.ezCalGridWrap.week { overflow-x: auto; }
.ezCalGridWrap.week .ezCalGridHead, .ezCalGridWrap.week .ezCalGrid { min-width: 720px; }
.ezCalGridWrap.week .ezCalScroll { min-width: 720px; }
.ezCalScroll { max-height: calc(100dvh - 300px); }
.ezCalCell { min-height: 58px; padding: 4px 3px; align-items: center; }
.ezCalChip, .ezCalMore { display: none; }
.ezCalDots { display: flex; }
.ezCalMonthHead span { padding: 6px 0; text-align: center; font-size: 11px; }
.ezCalLegend em { display: none; }
.ezCalLayer { padding: 0; align-items: stretch; }
.ezCalModal { max-width: none; border-radius: 0; max-height: none; min-height: 100dvh; }
.ezCalRow3 { grid-template-columns: 1fr 1fr; }
.ezCalRow3 > :first-child { grid-column: 1 / -1; }
.ezCalRow2 { grid-template-columns: 1fr; }
.ezCalField input, .ezCalField select, .ezCalField textarea, .ezCalSearch input { font-size: 16px; }
.ezCalModalFoot { position: sticky; bottom: 0; background: #fff; }
}
.sidebarCalendarDay.hasEvent { position: relative; }
.sidebarCalendarDay.hasEvent::after { content: ""; position: absolute; left: 50%; bottom: 2px; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: #12813d; }
.ezCfLayout.ezCfLayout { align-items: start; }
.ezCfGrid.ezCfGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 14px; align-content: start; }
.ezCf { display: grid; gap: 5px; min-width: 0; margin: 0; align-content: start; }
.ezCf > span { font-size: 12.5px; font-weight: 600; color: #5c6a7d; }
.ezCf input, .ezCf select, .ezCf textarea { width: 100%; box-sizing: border-box; border: 1px solid #dfe5ee; border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 14px; color: #232a35; background: #fff; min-height: 40px; }
.ezCf textarea { resize: vertical; font-family: inherit; min-height: 72px; }
.ezCf input:focus, .ezCf select:focus, .ezCf textarea:focus { outline: none; border-color: #12813d; box-shadow: 0 0 0 3px rgba(18, 129, 61, .14); }
.ezCf--wide { grid-column: 1 / -1; }
.ezCf--err input, .ezCf--err select { border-color: #d64545; background: #fffafa; }
.ezCfErr { font-size: 12px; color: #b42318; }
.ezCfPhone { display: flex; gap: 6px; }
.ezCfPhone input { flex: 1; min-width: 0; }
.ezCfMini { flex: 0 0 40px; border: 1px solid #dfe5ee; border-radius: 10px; background: #fff; font-size: 18px; color: #5c6a7d; cursor: pointer; }
.ezCfMini:hover { background: #f3f5f8; color: #1b1f24; }
.ezCfSuffix { position: relative; }
.ezCfSuffix input { padding-right: 30px; }
.ezCfSuffix span { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: #8a93a3; font-size: 14px; pointer-events: none; }
.ezCfReadonly.ezCfReadonly { background: #f7f8fa; color: #5c6a7d; }
.ezCfDate { display: grid; grid-template-columns: minmax(78px, .9fr) minmax(110px, 1.5fr) minmax(84px, 1fr); gap: 6px; }
.clientModalFooter .ezCfDelete { margin-right: auto; }
.ezHistWrap { gap: 12px; }
.ezHistHead { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ezHistHead > div { display: grid; gap: 2px; }
.ezHistHead b { font-size: 16px; color: #1b1f24; }
.ezHistHead small { font-size: 13px; color: #5c6a7d; }
.ezHistList { list-style: none; margin: 0; padding: 0; display: grid; }
.ezHist { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 2px; border-bottom: 1px solid #f1f4f8; }
.ezHist:last-child { border-bottom: 0; }
.ezHistWhen { display: grid; font-size: 13px; font-weight: 600; color: #232a35; }
.ezHistWhen small { font-size: 12px; font-weight: 500; color: #8a93a3; }
.ezHistText { display: grid; min-width: 0; }
.ezHistText b { font-size: 14px; font-weight: 600; color: #232a35; }
.ezHistText small { font-size: 12.5px; color: #8a93a3; overflow: hidden; text-overflow: ellipsis; }
.ezHistBadge { font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; white-space: nowrap; background: #f1f4f8; color: #5c6a7d; }
.ezHistBadge--done { background: #e8f5ec; color: #12813d; }
.ezHistBadge--miss { background: #fbeeee; color: #a33333; }
.ezHistBadge--plan, .ezHistBadge--wait { background: #eef3fb; color: #2d4f94; }
.ezHistBadge--sale { background: #f4f1fb; color: #5b3fa3; }
.ezStatGrid.ezStatGrid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ezConfirmLayer { position: fixed; inset: 0; z-index: 1300; background: rgba(15, 20, 28, .45); display: grid; place-items: center; padding: 16px; }
.ezConfirmBox { width: 100%; max-width: 420px; background: #fff; border-radius: 16px; padding: 20px 22px 18px; box-shadow: 0 24px 60px -20px rgba(13, 15, 18, .35); }
.ezConfirmBox h3 { margin: 0 0 8px; font-size: 18px; color: #1b1f24; }
.ezConfirmBox p { margin: 0 0 18px; font-size: 14px; line-height: 1.5; color: #4a5560; }
.ezConfirmActions { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
@media (max-width: 900px) {
.ezStatGrid.ezStatGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
.ezCfGrid.ezCfGrid { grid-template-columns: 1fr; }
.ezCf input, .ezCf select, .ezCf textarea { font-size: 16px; }
.ezHist { grid-template-columns: 74px minmax(0, 1fr); }
.ezHistBadge { grid-column: 2; justify-self: start; }
.clientModalNav { display: flex; overflow-x: auto; gap: 4px; -webkit-overflow-scrolling: touch; }
.clientModalNav .clientModalNavItem { flex: 0 0 auto; white-space: nowrap; }
.clientModalFooter { flex-wrap: wrap; }
}
.ezCalConfirm .actionButton.danger, .ezConfirmActions .actionButton.danger { background: #c8372d; border-color: #c8372d; color: #fff; }
.ezCalConfirm .actionButton.danger:hover, .ezConfirmActions .actionButton.danger:hover { background: #a92c24; border-color: #a92c24; }
.ezCalField.ezCalField select, .ezCf.ezCf select { -webkit-appearance: none; appearance: none; background: #fff url("data:image/svg+xml;utf8,") no-repeat right 11px center; padding-right: 30px; box-shadow: none; }
@media (max-width: 720px) {
.clientModalFooter.clientModalFooter { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; align-items: center; }
.clientModalFooter .clientModalFooterButton { flex: 1 1 0; width: auto; }
.clientModalFooter .ezCfDelete.ezCfDelete { flex: 0 0 100%; order: 3; background: none; border: 0; box-shadow: none; color: #b42318; min-height: 36px; font-weight: 600; }
}
button.inviteCard { border: 0; font: inherit; text-align: left; cursor: pointer; width: auto; display: grid; gap: 2px; }
.ezRefPanel.ezRefPanel { display: grid; gap: 14px; }
.ezRefHero.ezRefHero { display: grid; gap: 16px; padding: 22px 22px 20px; animation: none; }
.ezRefIntro h2 { margin: 0 0 6px; font-size: 20px; font-weight: 700; color: #1b1f24; letter-spacing: -.01em; }
.ezRefIntro p { margin: 0; font-size: 14.5px; line-height: 1.55; color: #4a5560; max-width: 760px; }
.ezRefLinkRow { display: flex; gap: 10px; max-width: 640px; }
.ezRefLink { flex: 1; min-width: 0; border: 1px solid #dfe5ee; border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 15px; color: #1b1f24; background: #f7f9f8; }
.ezRefLink:focus { outline: none; border-color: #12813d; box-shadow: 0 0 0 3px rgba(18, 129, 61, .14); }
.ezRefLinkRow .actionButton { white-space: nowrap; }
.ezRefShare { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: #5c6a7d; }
.ezRefShareBtn { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border: 1px solid #dfe5ee; border-radius: 10px; background: #fff; color: #232a35; font-size: 13.5px; font-weight: 600; text-decoration: none; }
.ezRefShareBtn:hover { background: #f5f7fa; }
.ezRefShareBtn svg { width: 17px; height: 17px; }
.ezRefShareBtn--telegram svg { color: #229ed9; }
.ezRefShareBtn--whatsapp svg { color: #25d366; }
.ezRefShareBtn--vk svg { color: #0077ff; }
.ezRefShareBtn--mail svg { color: #5c6a7d; }
.ezRefStats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ezRefStats .detailCard { display: grid; gap: 2px; padding: 16px 18px; animation: none; }
.ezRefStats span { font-size: 13px; color: #5c6a7d; }
.ezRefStats b { font-size: 26px; color: #1b1f24; font-variant-numeric: tabular-nums; line-height: 1.2; }
.ezRefStats small { font-size: 12.5px; color: #8a93a3; }
.ezRefList.ezRefList, .ezRefSteps.ezRefSteps { display: grid; gap: 10px; padding: 18px 20px; animation: none; }
.ezRefList h3, .ezRefSteps h3 { margin: 0; font-size: 16px; color: #1b1f24; }
.ezRefEmpty { margin: 0; font-size: 14px; color: #5c6a7d; line-height: 1.5; }
.ezRefBadge { display: inline-block; font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: #eef3fb; color: #2d4f94; white-space: nowrap; }
.ezRefBadge--ok { background: #e8f5ec; color: #12813d; }
.ezRefSteps ol { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: 14px; line-height: 1.5; color: #4a5560; }
.ezRefSteps b { color: #1b1f24; }
@media (max-width: 720px) {
.ezRefHero.ezRefHero { padding: 16px 14px; }
.ezRefLinkRow { flex-direction: column; }
.ezRefStats { grid-template-columns: 1fr; gap: 10px; }
.ezRefShareBtn span { display: none; }
.ezRefShareBtn { padding: 9px 11px; }
}
:root {
--ezg: #12813d;
--ezg-deep: #0e6b32;
--ezg-soft: #eaf5ee;
--ezg-line: #cfe6d7;
--ez-ink0: #1b1f24;
--ez-tx0: #232a35;
--ez-mu0: #5c6a7d;
--ez-mu1: #8a93a3;
--ez-ln0: #e4e9f0;
--ez-ln1: #d5dde7;
--ez-bg0: #f4f6f8;
--ez-card-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}
.panelShell .sidebar, .panelShell .sidebarGroup, .panelShell .detailCard, .panelShell .panelTopBar,
.panelShell .workspacePanel, .panelShell .workspacePanel > *, .panelShell .inviteCard, .panelShell .clientRow {
animation: none !important;
}
.panelShell .detailCard:hover { transform: none; box-shadow: var(--ez-card-shadow); border-color: var(--ez-ln0); }
.miniButton:hover:not(:disabled), .actionButton:hover:not(:disabled) { transform: none; }
html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb, *::-webkit-scrollbar-thumb { background: #cfd6df !important; }
.panelShell, .panelShell .panelMain { background: var(--ez-bg0) !important; }
.panelShell .workspacePanel.whListPanel { background: transparent !important; }
.panelShell .sidebar {
background: #fff !important;
border-right: 1px solid var(--ez-ln0) !important;
padding: 16px 12px 14px;
gap: 10px;
}
.panelShell .sidebarBrand { padding: 2px 10px 8px; }
.panelShell .sidebarBrandMark { font-size: 18px; font-weight: 700; letter-spacing: -.01em; color: var(--ez-ink0); }
.panelShell .sidebarCalendar { display: none !important; }
.panelShell .sidebarNav { gap: 2px; width: 100%; justify-content: stretch; }
.panelShell .sidebarGroup { border-radius: 10px; }
.panelShell .sidebarGroupHead {
min-height: 40px;
border-radius: 10px !important;
color: #3a4452;
font-weight: 600;
background: transparent;
box-shadow: none !important;
}
.panelShell .sidebarGroupHead:hover { background: #f3f5f8; }
.panelShell .sidebarGroup.active .sidebarGroupHead {
background: var(--ezg-soft) !important;
color: var(--ezg-deep) !important;
box-shadow: none !important;
}
.panelShell .sidebarGroup.active .sidebarGroupIcon { color: var(--ezg); }
.panelShell .sidebarGroup.open .sidebarGroupBody { padding: 2px 4px 6px 30px; }
.panelShell .sidebarGroupBody button {
display: block;
width: 100%;
text-align: left;
border: 0 !important;
outline: 0;
box-shadow: none !important;
background: transparent !important;
border-radius: 8px;
padding: 6px 10px !important;
margin: 1px 0;
color: var(--ez-mu0);
font-size: 14px;
font-weight: 500;
position: relative;
}
.panelShell .sidebarGroupBody button:hover { background: #f3f5f8 !important; color: var(--ez-tx0); }
.panelShell .sidebarGroupBody button.activeItem {
color: var(--ez-ink0) !important;
font-weight: 650 !important;
background: #f1f4f7 !important;
}
.panelShell .sidebarGroupBody button.activeItem::before {
content: "";
position: absolute;
left: -9px;
top: 8px;
bottom: 8px;
width: 3px;
border-radius: 3px;
background: var(--ezg);
}
.panelShell .sidebarGroupBody button:focus-visible { outline: 2px solid var(--ezg); outline-offset: 1px; }
.panelShell .inviteCard {
margin-top: auto !important;
border-radius: 12px;
border: 1px solid var(--ezg-line) !important;
background: var(--ezg-soft) !important;
box-shadow: none !important;
padding: 11px 12px 12px;
}
.panelShell .inviteCard span { color: var(--ezg-deep) !important; font-size: 13px; }
.panelShell .inviteCard strong { color: var(--ez-ink0); font-size: 14.5px; }
.panelShell .inviteCard:hover { background: #e2f1e7 !important; }
.panelShell .panelTopBar {
background: #fff;
border-bottom: 1px solid var(--ez-ln0);
padding: 10px 24px;
flex-shrink: 0;
justify-content: flex-start;
box-shadow: none;
}
.panelShell .panelTopRight { margin-left: auto; gap: 18px; }
.panelShell .knowledgeLink { color: var(--ez-mu0); font-weight: 600; font-size: 14px; }
.panelShell .knowledgeLink:hover { color: var(--ezg); }
.ezPageTitle { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.ezPageTitle span { font-size: 14px; color: var(--ez-mu1); font-weight: 500; white-space: nowrap; }
.ezPageTitle span::after { content: "/"; margin-left: 8px; color: #c3cad4; }
.ezPageTitle b { font-size: 18px; font-weight: 700; color: var(--ez-ink0); letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ezPageTitle--single span::after { display: none; }
.ezPageTitle--single span { font-size: 18px; font-weight: 700; color: var(--ez-ink0); }
.panelShell .detailCard,
.panelShell .whTopCard,
.panelShell .whTableCard,
.panelShell .workspaceToolbar,
.panelShell .finOpsKpiCard,
.panelShell .metricCard,
.panelShell .clientPanelCard,
.panelShell .profilePanel,
.panelShell .adminCard,
.panelShell .financeCard,
.panelShell .subscriptionPlanCard {
background: #fff !important;
background-image: none !important;
border: 1px solid var(--ez-ln0) !important;
box-shadow: var(--ez-card-shadow) !important;
border-radius: 14px !important;
}
.panelShell .metricCard::before, .panelShell .metricCard::after, .panelShell .apiHeroCard::before,
.panelShell .loyaltyMaintenanceCard::after, .panelShell .analyticsKpiItem--sessions::after { display: none !important; }
.panelShell .analyticsBoard { background: transparent !important; }
.actionButton, .miniButton, .pagerButton {
border-radius: 10px;
font-weight: 600;
box-shadow: none !important;
transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.actionButton.primary,
.pagerButton.primary,
.certificateTypeFooter .actionButton.primary {
background: var(--ezg) !important;
background-image: none !important;
color: #fff !important;
border: 1px solid var(--ezg) !important;
}
.actionButton.primary:hover:not(:disabled), .pagerButton.primary:hover:not(:disabled) {
background: var(--ezg-deep) !important;
border-color: var(--ezg-deep) !important;
}
.actionButton.primary:disabled { opacity: .5; }
.actionButton.secondary,
.actionButton:not(.primary):not(.danger):not(.finOps--income):not(.finOps--expense):not(.finOps--transfer),
.pagerButton:not(.primary) {
background: #fff !important;
background-image: none !important;
color: var(--ez-tx0) !important;
border: 1px solid var(--ez-ln1) !important;
}
.actionButton.secondary:hover:not(:disabled),
.actionButton:not(.primary):not(.danger):not(.finOps--income):not(.finOps--expense):not(.finOps--transfer):hover:not(:disabled),
.pagerButton:not(.primary):hover:not(:disabled) {
background: #f5f7fa !important;
border-color: #c3ccd8 !important;
}
.actionButton.danger {
background: #fff !important;
color: #b42318 !important;
border: 1px solid #f1c5c0 !important;
}
.actionButton.danger:hover:not(:disabled) { background: #fdf1f0 !important; border-color: #e8a59d !important; }
.ezCalConfirm .actionButton.danger, .ezConfirmActions .actionButton.danger { background: #c8372d !important; border-color: #c8372d !important; color: #fff !important; }
.finOpsActionBtns .actionButton.finOps--income { background: var(--ezg) !important; }
.finOpsActionBtns .actionButton.finOps--expense { background: #fff !important; color: #b42318 !important; border: 1px solid #f1c5c0 !important; }
.miniButton {
background: #fff !important;
background-image: none !important;
color: var(--ez-tx0) !important;
border: 1px solid var(--ez-ln1) !important;
}
.miniButton:hover:not(:disabled) { background: #f5f7fa !important; }
.miniButton.active,
.panelShell .analyticsRangeTabs .miniButton.active,
.panelShell .salePointsTabs .miniButton.active,
.panelShell .finOpsFilterBtn.active,
.panelShell .ezSalesTabs > button.active {
background: var(--ez-ink0) !important;
background-image: none !important;
border-color: var(--ez-ink0) !important;
color: #fff !important;
}
.miniButton.miniButtonDanger { color: #b42318 !important; border-color: #f1c5c0 !important; background: #fff !important; }
.panelShell .whWarehouseTab--active {
background: var(--ezg-soft) !important;
background-image: none !important;
border-color: var(--ezg-line) !important;
color: var(--ezg-deep) !important;
}
.panelShell .whGroupBtn--active { background: var(--ezg-soft) !important; color: var(--ezg-deep) !important; }
.panelShell .statusChip.on, .panelShell .noticePill--accent {
background: var(--ezg-soft) !important;
background-image: none !important;
color: var(--ezg-deep) !important;
box-shadow: none !important;
}
.panelShell .metricTrend.positive { background: var(--ezg-soft) !important; color: var(--ezg-deep) !important; }
.panelShell .miniAppStartButton { background: var(--ezg) !important; color: #fff !important; }
.panelShell .ezCrmLinkBadge { background: var(--ezg-soft); color: var(--ezg-deep); }
.panelShell .cgMsg.out { background: var(--ezg-soft) !important; }
.panelShell .barFill { background: var(--ezg) !important; }
.panelShell .tone-sessions .metricSpark i { background: var(--ezg) !important; }
.panelShell .loyaltyCertificateEmptyButton {
background: var(--ezg) !important;
background-image: none !important;
color: #fff !important;
border: 1px solid var(--ezg) !important;
}
.panelShell .loyaltyCertificateEmptyIcon { background: var(--ezg-soft) !important; color: var(--ezg) !important; }
.panelShell .profileDataButton {
background: #fff !important;
background-image: none !important;
color: var(--ez-tx0) !important;
border: 1px solid var(--ez-ln1) !important;
box-shadow: none !important;
font-weight: 600;
text-align: left;
justify-content: flex-start;
}
.panelShell .profileDataButton:hover { background: #f5f7fa !important; }
.panelShell .profileDataButton--primary { background: var(--ezg) !important; color: #fff !important; border-color: var(--ezg) !important; justify-content: center; text-align: center; }
.panelShell .profileDataButton--primary:hover { background: var(--ezg-deep) !important; }
.panelShell .profileDataButton--info { color: var(--ez-mu0) !important; font-weight: 500; }
.panelShell .profileDataButton--danger { color: #b42318 !important; border-color: #f1c5c0 !important; justify-content: center; text-align: center; }
.panelShell .profileDataButton--danger:hover { background: #fdf1f0 !important; }
.panelShell .profileAvatar { background: var(--ezg-soft) !important; color: var(--ezg-deep) !important; }
.panelShell .subscriptionPlanCard { border-radius: 16px !important; }
.panelShell .subscriptionPlanCard.active { border: 2px solid var(--ezg) !important; }
.panelShell input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):focus,
.panelShell select:focus, .panelShell textarea:focus,
.clientModal input:focus, .clientModal select:focus, .clientModal textarea:focus {
outline: none;
border-color: var(--ezg) !important;
box-shadow: 0 0 0 3px rgba(18, 129, 61, .14) !important;
}
.panelShell input[type=checkbox], .clientModal input[type=checkbox] { accent-color: var(--ezg); }
.panelShell textarea, .panelShell input, .panelShell select, .panelShell button { font-family: inherit; }
.panelShell table th, .panelShell .whListTable th, .panelShell .ezSalesTable th {
font-size: 12px;
font-weight: 600;
color: var(--ez-mu1);
text-transform: none;
letter-spacing: 0;
}
.panelShell .userChipAvatar { box-shadow: none; }
.clientModalNavItem.active { background: var(--ezg-soft) !important; color: var(--ezg-deep) !important; box-shadow: inset 3px 0 0 var(--ezg) !important; }
.clientModalNavItem { border-radius: 10px; }
.clientModal .clientModalTop { background: #fff; }
.clientAvatarCard .clientAvatar { background: var(--ezg-soft); color: var(--ezg); }
.clientAvatarButton { background: rgba(27, 31, 36, .72) !important; }
@media (max-width: 1080px) {
.panelShell .panelTopBar { padding: 8px 14px; }
.ezPageTitle span { display: none; }
.ezPageTitle b { font-size: 16px; }
}
.panelShell .workspaceToolbar {
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
padding: 0 !important;
min-height: 0;
}
.panelShell .clientWorkspaceSpacer { display: none; }
.panelShell .workspaceInput { border-radius: 10px; border: 1px solid var(--ez-ln1); background: #fff; }
.panelShell .clientTableWrap {
border: 1px solid var(--ez-ln0) !important;
border-radius: 14px !important;
box-shadow: var(--ez-card-shadow) !important;
background: #fff !important;
}
.panelShell .clientHeaderRow .clientCell { font-size: 12.5px; font-weight: 600; color: var(--ez-mu1); }
.panelShell .clientRow { transition: background-color .12s ease; }
.panelShell .clientRow:hover { background: #f7f9fb !important; box-shadow: none !important; }
.panelShell .clientRow.active { background: #f3f7f4 !important; box-shadow: inset 3px 0 0 var(--ezg) !important; }
.panelShell .clientRow.selected { background: #eef7f1 !important; }
.pagerButton.primary:disabled, .actionButton.primary:disabled {
background: #d9dfe6 !important;
border-color: #d9dfe6 !important;
color: #fff !important;
opacity: 1;
}
.panelShell .whListTable {
border: 1px solid var(--ez-ln0) !important;
border-radius: 14px !important;
box-shadow: var(--ez-card-shadow) !important;
border-collapse: separate !important;
border-spacing: 0;
overflow: hidden;
background: #fff;
}
.panelShell .whListTable th { padding: 11px 14px !important; background: #fafbfc; border-bottom: 1px solid var(--ez-ln0); font-size: 12px; font-weight: 600; color: var(--ez-mu1); }
.panelShell .whListTable td { padding: 12px 14px !important; font-size: 14px; border-bottom: 1px solid #f1f4f7; }
.panelShell .whListTable tr:last-child td { border-bottom: 0; }
.panelShell .whListTable tbody tr:hover td { background: #f9fbfa; }
.panelShell .whListToolbar { gap: 12px; margin-bottom: 12px; align-items: center; }
.panelShell .whListCount { color: var(--ez-mu0); font-size: 13.5px; }
.panelShell .statsCard, .panelShell .analyticsKpiItem, .panelShell .analyticsChartCard {
background: #fff !important;
background-image: none !important;
border: 1px solid var(--ez-ln0) !important;
box-shadow: var(--ez-card-shadow) !important;
border-radius: 14px !important;
}
.panelShell .profileDataButton--export { justify-content: center; text-align: center; }
.panelShell .profileDataButton--info {
justify-content: space-between;
color: var(--ez-tx0) !important;
font-weight: 600 !important;
}
.panelShell .profileDataButton--info::after { content: "↗"; color: var(--ez-mu1); font-weight: 500; margin-left: 12px; }
.panelShell .profilePanel .profileDataButton--primary { background: var(--ezg) !important; color: #fff !important; }
.panelShell .profileDataButton--info { display: flex !important; align-items: center; }
.panelShell .clientHeaderRow .clientCell { white-space: nowrap; }
@media (max-width: 720px) {
.panelShell .panelTopBar { flex-direction: row !important; align-items: center !important; gap: 10px; padding: 8px 12px; }
.panelShell .panelSidebarToggle {
flex: 0 0 40px; width: 40px; min-width: 40px; height: 40px; padding: 0;
justify-content: center; align-items: center;
border: 1px solid var(--ez-ln1); border-radius: 10px; background: #fff; box-shadow: none;
}
.panelShell .panelSidebarToggleLabel { display: none; }
.ezPageTitle { flex: 1 1 auto; min-width: 0; }
.ezPageTitle b, .ezPageTitle--single span { font-size: 16px !important; overflow: hidden; text-overflow: ellipsis; }
.panelShell .panelTopRight { margin-left: 0; gap: 8px; flex: 0 0 auto; justify-content: flex-end !important; }
.panelShell .knowledgeLink { display: none; }
.panelShell .userChip > div { display: none; }
.panelShell .userChip { min-height: 40px; }
}
@media (max-width: 720px) {
.panelShell .clientTableWrap { overflow-x: hidden; }
.panelShell .clientRow, .panelShell .clientHeaderRow {
grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.35fr) !important;
min-width: 0 !important;
width: 100% !important;
}
.panelShell .clientRow .cellId, .panelShell .clientHeaderRow .cellId,
.panelShell .clientRow .cellSmall:not(.cellPhone), .panelShell .clientHeaderRow .cellSmall:not(.cellPhone),
.panelShell .clientRow .cellCode, .panelShell .clientHeaderRow .cellCode,
.panelShell .clientRow .cellDate, .panelShell .clientHeaderRow .cellDate,
.panelShell .clientRow .clientRowActionSpacer, .panelShell .clientHeaderRow .clientHeaderCell--action { display: none !important; }
.panelShell .clientRow .clientCell, .panelShell .clientHeaderRow .clientCell { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.panelShell .clientPager { flex-wrap: wrap; gap: 8px; }
.panelShell .loyaltyCardsTableHead { display: none !important; }
.panelShell .loyaltyCardsTableRow {
grid-template-columns: 1fr 1fr !important;
gap: 4px 12px !important;
padding: 12px 4px !important;
border-bottom: 1px solid #eef1f5;
}
.panelShell .loyaltyCardsTableRow > span { display: grid !important; gap: 1px; font-size: 14px; min-width: 0; overflow-wrap: anywhere; }
.panelShell .loyaltyCardsTableRow > span::before { font-size: 11.5px; font-weight: 600; color: var(--ez-mu1); }
.panelShell .loyaltyCardsTableRow > span:nth-child(1) { display: none !important; }
.panelShell .loyaltyCardsTableRow > span:nth-child(2)::before { content: "Номер карты"; }
.panelShell .loyaltyCardsTableRow > span:nth-child(3)::before { content: "Тип"; }
.panelShell .loyaltyCardsTableRow > span:nth-child(4)::before { content: "Телефон"; }
.panelShell .loyaltyCardsTableRow > span:nth-child(5)::before { content: "Баланс"; }
.panelShell .loyaltyCardsTableRow > span:nth-child(6)::before { content: "Создана"; }
.panelShell .loyaltyTransactionsTableHead, .panelShell [class*="loyaltyTransactions"][class*="Head"] { display: none !important; }
}
.clientModal .ezCfDate { grid-template-columns: minmax(88px, .9fr) minmax(120px, 1.5fr) minmax(92px, 1fr); }
.clientModalFooter .actionButton.danger { min-width: 110px; }
.ezCfGrid .ezCf:has(.ezCfDate) { grid-column: 1 / -1; }
.ezCfGrid .ezCfDate { max-width: 440px; }
.actionButton.success { color: #fff !important; }
.panelShell .subscriptionPlanBadge--trial { color: var(--ezg-deep) !important; }
.panelShell .sidebar { overflow-y: auto; }
.ezWidgets { display: grid; gap: 6px; margin: 0 0 6px; }
.ezWidgetsHead { display: flex; align-items: center; justify-content: space-between; padding: 0 4px 0 10px; }
.ezWidgetsHead > span { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ez-mu1); }
.ezWidgetsGear { width: 28px; height: 28px; display: grid; place-items: center; border: 0; background: none; border-radius: 8px; color: var(--ez-mu1); cursor: pointer; }
.ezWidgetsGear svg { width: 17px; height: 17px; }
.ezWidgetsGear:hover { background: #f1f4f7; color: var(--ez-ink0); }
.ezWg { display: grid; gap: 2px; padding: 9px 11px; border: 1px solid var(--ez-ln0); border-radius: 12px; background: #fff; text-align: left; min-width: 0; }
.ezWg--link { cursor: pointer; }
.ezWg--link:hover { border-color: #c9d2dd; background: #fafbfc; }
.ezWg--link:focus-visible { outline: 2px solid var(--ezg); outline-offset: 1px; }
.ezWgTitle { font-size: 12px; font-weight: 600; color: var(--ez-mu1); }
.ezWgValue { font-size: 17px; font-weight: 700; color: var(--ez-ink0); line-height: 1.25; font-variant-numeric: tabular-nums; }
.ezWgValue--small { font-size: 15px; }
.ezWgLine { font-size: 12.5px; color: var(--ez-mu0); line-height: 1.35; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ezWgAction { justify-self: start; margin-top: 4px; font-size: 12.5px; font-weight: 700; color: #fff; background: var(--ezg); border-radius: 8px; padding: 3px 10px; }
.ezWg--hot { border-color: var(--ezg-line); background: #f7fbf8; }
.ezWg--warn { border-color: #f1dfb0; background: #fffcf3; }
.ezWg--bad { border-color: #f1c5c0; background: #fffafa; }
.ezWg--bad .ezWgAction { background: #c8372d; }
.ezWgList { list-style: none; margin: 2px 0 0; padding: 0; display: grid; gap: 1px; }
.ezWgList li { min-width: 0; }
.ezWgList button, .ezWgList--plain li { width: 100%; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; border: 0; background: none; padding: 3px 0; font: inherit; font-size: 13px; color: var(--ez-tx0); text-align: left; cursor: pointer; }
.ezWgList--plain li { cursor: default; }
.ezWgList button:hover span { color: var(--ezg); text-decoration: underline; }
.ezWgList span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ezWgList small { flex: 0 0 auto; font-size: 12px; color: var(--ez-mu1); }
.ezWgList small.ezWgHot { color: var(--ezg); font-weight: 700; }
.ezWgMore { font-size: 12px; color: var(--ez-mu1); padding-top: 2px; }
.ezWg--month { padding: 8px 8px 9px; }
.ezWgMonthHead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.ezWgMonthHead span { font-size: 13px; font-weight: 700; color: var(--ez-ink0); white-space: nowrap; }
.ezWgMonthHead button { width: 24px; height: 24px; border: 0; background: none; border-radius: 6px; font-size: 16px; color: var(--ez-mu0); cursor: pointer; }
.ezWgMonthHead button:hover { background: #f1f4f7; }
.ezWgMonthGrid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; text-align: center; }
.ezWgMonthGrid i { font-style: normal; font-size: 10.5px; color: var(--ez-mu1); padding: 2px 0; }
.ezWgMonthGrid button { position: relative; height: 24px; border: 0; background: none; border-radius: 6px; font: inherit; font-size: 12px; color: var(--ez-tx0); cursor: pointer; padding: 0; }
.ezWgMonthGrid button:hover { background: #f1f4f7; }
.ezWgMonthGrid button.out { color: #b7bfca; }
.ezWgMonthGrid button.today { background: var(--ezg); color: #fff; font-weight: 700; }
.ezWgMonthGrid button.has::after { content: ""; position: absolute; left: 50%; bottom: 2px; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: var(--ezg); }
.ezWgMonthGrid button.today.has::after { background: #fff; }
.ezWgEmpty { border: 1px dashed var(--ez-ln1); background: #fafbfc; border-radius: 12px; padding: 10px 11px; font: inherit; font-size: 12.5px; color: var(--ez-mu0); text-align: left; cursor: pointer; }
.ezWgEditor.ezWgEditor { max-width: 480px; }
.ezWgEditList { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 6px; max-height: 56vh; overflow-y: auto; }
.ezWgEditList li { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 1px solid var(--ez-ln0); border-radius: 12px; }
.ezWgEditList li.on { border-color: var(--ezg-line); background: #f7fbf8; }
.ezWgEditList label { flex: 1; display: flex; align-items: flex-start; gap: 10px; cursor: pointer; min-width: 0; }
.ezWgEditList input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--ezg); flex: 0 0 auto; }
.ezWgEditList label span { display: grid; gap: 1px; }
.ezWgEditList b { font-size: 14px; color: var(--ez-ink0); }
.ezWgEditList small { font-size: 12.5px; color: var(--ez-mu0); line-height: 1.35; }
.ezWgMove { display: inline-flex; gap: 4px; flex: 0 0 auto; }
.ezWgMove button { width: 30px; height: 30px; border: 1px solid var(--ez-ln1); border-radius: 8px; background: #fff; cursor: pointer; font-size: 14px; color: var(--ez-tx0); }
.ezWgMove button:disabled { opacity: .35; cursor: default; }
.ezWgReset { margin-right: auto; }
.ezWgProfileText { margin: 0 0 12px; font-size: 13.5px; line-height: 1.5; color: var(--ez-mu0); }
.clientModal textarea, .clientModal input, .clientModal select, .clientModal button,
.ezCalModal textarea, .ezCalModal input, .ezCalModal select, .ezCalModal button,
.modalLayer textarea, .modalLayer input, .modalLayer select, .modalLayer button,
.ezConfirmBox button, .ezConfirmBox input { font-family: inherit; }
.actionButton { min-height: 40px; padding: 0 16px; border-radius: 10px !important; font-size: 14px; }
.panelShell .miniButton, .panelShell .whRowBtn { min-height: 32px; padding: 0 12px; font-size: 13px; border-radius: 8px !important; }
.panelShell .workspacePanel input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),
.panelShell .workspacePanel select,
.clientModal input:not([type=checkbox]):not([type=radio]):not([type=file]), .clientModal select,
.modalLayer input:not([type=checkbox]):not([type=radio]):not([type=file]), .modalLayer select {
min-height: 40px;
border: 1px solid var(--ez-ln1);
border-radius: 10px;
background-color: #fff;
box-shadow: none;
font-size: 14px;
}
.panelShell .workspacePanel select, .clientModal select, .modalLayer select {
-webkit-appearance: none; appearance: none;
background-image: url("data:image/svg+xml;utf8,") !important;
background-repeat: no-repeat !important;
background-position: right 12px center !important;
background-size: 12px 12px !important;
padding-right: 32px !important;
}
.panelShell input[type=month], .panelShell input[type=date] { background: #fff !important; }
.panelShell .ezSalesQty input, .panelShell .whTableRow input, .panelShell table input { min-height: 0; }
.panelShell .detailCardHeader, .panelShell .financeEyebrow, .panelShell .kpiLabel, .panelShell .analyticsSideLabel,
.panelShell .whTableHead, .panelShell .loyaltyTypesTableHead, .panelShell .loyaltyCardsTableHead,
.panelShell .loyaltyTransactionsTableHead, .panelShell .finOpsHeaderRow, .panelShell .finOpsChartCard h3,
.panelShell .financeDashboardWidget h3, .panelShell .whListTable th { text-transform: none !important; letter-spacing: 0 !important; }
.panelShell .whTableHead, .panelShell .loyaltyTypesTableHead, .panelShell .loyaltyCardsTableHead,
.panelShell .loyaltyTransactionsTableHead, .panelShell .finOpsHeaderRow { font-size: 12px; font-weight: 600; color: var(--ez-mu1); }
.panelShell .detailCardHeader { font-size: 16px; font-weight: 600; color: var(--ez-ink0); }
.panelShell .kpiLabel, .panelShell .analyticsSideLabel { font-size: 13px; font-weight: 500; color: var(--ez-mu0); }
.panelShell .finOpsChartCard h3 a, .panelShell .finOpsChartCard h3 { text-decoration: none !important; }
.panelShell .workspacePanel.financeWorkspace { padding-top: 18px !important; }
.panelShell .sidebarGroupHead { font-size: 14.5px; min-height: 38px; }
.panelShell .sidebarGroup.active .sidebarGroupHead { background: transparent !important; color: var(--ezg-deep) !important; }
.panelShell .sidebarGroup.active .sidebarGroupHead:hover { background: #f3f5f8 !important; }
.panelShell .sidebarGroup.open .sidebarGroupBody { padding-left: 24px; }
.panelShell .sidebarGroupBody button { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.panelShell .sidebarGroupBody button.activeItem { background: var(--ezg-soft) !important; color: var(--ezg-deep) !important; font-weight: 600 !important; }
.panelShell .sidebarGroupBody button.activeItem::before { display: none; }
.clientModalNavItem:hover { background: #f3f5f8 !important; color: var(--ez-tx0) !important; transform: none !important; }
.clientModalNavItem.active:hover { background: var(--ezg-soft) !important; color: var(--ezg-deep) !important; }
.panelShell .loyaltyTypesName { color: var(--ezg-deep) !important; }
.panelShell .loyaltyCardsCell--phone { color: var(--ez-tx0) !important; }
.panelShell .certificateEmptyResults { display: none !important; }
.panelShell .loyaltyHelpIcon { background: var(--ezg-soft) !important; color: var(--ezg) !important; }
.panelShell .kpiBarFill { background: var(--ezg) !important; }
.panelShell .whStatCard--primary { background: #fff !important; }
.panelShell .emptyState, .clientModal .emptyState { background: #f7f8fa; border-color: var(--ez-ln0); }
.ezHistBadge--sale { background: #f1f4f7; color: var(--ez-mu0); }
.panelShell .statsCardHead span:empty { display: none; }
.panelShell .userChipAvatar::before { padding: 1px !important; }
.panelShell .miniButton.active,
.panelShell .analyticsRangeTabs .miniButton.active,
.panelShell .salePointsTabs .miniButton.active,
.panelShell .finOpsFilterBtn.active,
.panelShell .ezSalesTabs > button.active {
background: var(--ezg-soft) !important;
border-color: var(--ezg-line) !important;
color: var(--ezg-deep) !important;
}
.ezCalViews, .ezCalKind { gap: 2px; padding: 3px; background: #f1f4f7 !important; border: 1px solid var(--ez-ln0) !important; border-radius: 10px !important; }
.ezCalViews button, .ezCalKind button { border: 0 !important; border-radius: 8px !important; background: transparent !important; color: var(--ez-mu0) !important; height: 32px; padding: 0 12px !important; }
.ezCalViews button + button, .ezCalKind button + button { border-left: 0 !important; }
.ezCalViews button.active, .ezCalKind button.active { background: #fff !important; color: var(--ez-ink0) !important; box-shadow: 0 1px 2px rgba(16, 24, 40, .08) !important; }
.ezCalSeg button.ezCalSeg--wait.active { background: #fff; color: var(--ez-ink0); border-color: var(--ez-ink0); }
.ezCalNav button, .ezCalStaff { height: 36px; }
.ezCalLegend span::before { width: 10px; height: 10px; border-radius: 50%; border: 0 !important; }
.ezCalLegend--wait::before { background: #4a74c9 !important; }
.ezCalLegend--done::before { background: #12813d !important; }
.ezCalLegend--miss::before { background: #c84040 !important; }
.panelShell .certificateShowButton { justify-self: start; width: auto !important; min-width: 140px; }
.actionButton.primary:disabled, .pagerButton.primary:disabled {
background: #eef1f4 !important;
border-color: #e4e9f0 !important;
color: #8a93a3 !important;
}
.ezPlanCta { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 10px; background: var(--ezg); color: #fff; font-size: 14px; font-weight: 600; }
.subscriptionPlanCard:hover .ezPlanCta { background: var(--ezg-deep); }
.ezPlanUntil { margin-top: auto; font-size: 13.5px; font-weight: 600; color: var(--ezg-deep); background: var(--ezg-soft); border-radius: 10px; padding: 10px 12px; }
.panelShell .subscriptionPlanCard { display: flex !important; flex-direction: column; }
.panelShell .subscriptionPlanState--current { background: var(--ezg-soft) !important; color: var(--ezg-deep) !important; box-shadow: none !important; }
.panelShell .clientRow .cellSmall:not(.cellPhone), .panelShell .clientHeaderRow .cellSmall:not(.cellPhone) { text-align: right; font-variant-numeric: tabular-nums; }
.panelShell .clientRow.active { box-shadow: none !important; background: transparent !important; }
.panelShell .clientRow.active:hover { background: #f7f9fb !important; }
@media (max-width: 720px) {
.panelShell .sidebar:not(.sidebar--drawerOpen) { box-shadow: none !important; }
.panelShell .sidebarDrawerClose { width: 40px; height: 40px; }
.clientModalLayer { padding: 0 !important; }
.clientModal { inset: 0; width: 100% !important; max-width: none !important; height: 100dvh !important; max-height: none !important; border-radius: 0 !important; }
.clientModalNav .clientModalNavItem { width: auto !important; min-height: 36px; padding: 8px 12px !important; }
.clientModalNav { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); scrollbar-width: none; }
.clientModalNav::-webkit-scrollbar { display: none; }
.panelShell .whTableHead { display: none !important; }
.panelShell .whTableRow { grid-template-columns: 1fr auto !important; gap: 6px 12px; padding: 12px 4px !important; }
.panelShell .whTableRow > :nth-child(1) { grid-column: 1 / -1; font-size: 15px; font-weight: 600; }
.panelShell .whTableRow > :nth-child(2), .panelShell .whTableRow > :nth-child(3), .panelShell .whTableRow > :nth-child(5) { display: none !important; }
.panelShell .whTableRow > :nth-child(4) { display: block !important; font-size: 14px; }
.panelShell .whTableRow > :nth-child(6) { justify-self: end; }
.panelShell .whTableRow > :nth-child(7) { grid-column: 1 / -1; justify-self: end; display: flex; gap: 6px; }
.panelShell .whStats { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
.panelShell .whStepBtn { width: 34px !important; height: 34px !important; }
.panelShell .whListEmpty p, .panelShell .whListEmpty span { text-align: center; }
.ezCalNav button { min-width: 40px; }
}
.ezCfNote { margin: 8px 0 0; font-size: 13px; line-height: 1.45; color: var(--ez-mu0); background: #f7f8fa; border: 1px solid var(--ez-ln0); border-radius: 10px; padding: 9px 11px; }
@media (max-width: 900px) {
.panelShell .ezSalesGrid { grid-template-columns: minmax(0, 1fr) !important; }
.panelShell .ezSalesGrid > *, .panelShell .ezSalesCart, .panelShell .ezSalesSide { min-width: 0; max-width: 100%; }
}
@media (max-width: 720px) {
.panelShell .ezSalesCart .ezSalesTable thead { display: none; }
.panelShell .ezSalesCart .ezSalesTable, .panelShell .ezSalesCart .ezSalesTable tbody { display: block; width: 100%; }
.panelShell .ezSalesCart .ezSalesTable tr { display: grid; grid-template-columns: 1fr auto auto; gap: 6px 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid #eef1f5; }
.panelShell .ezSalesCart .ezSalesTable td { padding: 0 !important; border: 0 !important; }
.panelShell .ezSalesCart .ezSalesTable td:first-child { grid-column: 1 / -1; }
.panelShell .ezSalesPay { flex-wrap: wrap; }
.panelShell .ezSalesPay button { flex: 1 1 30%; }
.panelShell .ezSalesRow { grid-template-columns: 1fr 1fr !important; }
}
.clientModalNavItem { grid-template-columns: minmax(0, 1fr) !important; }
@media (max-width: 720px) {
.clientModalNav { display: flex !important; flex-wrap: nowrap; padding: 8px 10px !important; min-height: 0; }
.clientModalNav .clientModalNavItem { display: inline-flex !important; align-items: center; height: 36px; min-height: 36px !important; box-shadow: none !important; }
.clientModalNavItem.active { box-shadow: none !important; }
}
@media (max-width: 720px) {
.clientModal .clientModalBody { grid-template-rows: auto minmax(0, 1fr) !important; align-content: start !important; }
.clientModal .clientModalNav { align-self: start; }
}
.panelShell .bankCardBanner { display: none !important; }
.panelShell .bankCard, .panelShell .bankGrid > * { background: #fff !important; border: 1px solid var(--ez-ln0) !important; box-shadow: var(--ez-card-shadow) !important; border-radius: 14px !important; }
.panelShell .bankCardTop { padding-top: 16px; }
/* MAX-бот */
.ezMaxPanel { display: flex; flex-direction: column; gap: 14px; }
.ezMaxPanel .detailCard { padding: 20px 22px; }
.ezMaxPanel h2 { margin: 0 0 8px; font-size: 20px; font-weight: 700; color: var(--ez-ink0); letter-spacing: -.01em; }
.ezMaxPanel h3 { margin: 0 0 10px; font-size: 16px; font-weight: 650; color: var(--ez-ink0); }
.ezMaxPanel p { margin: 0; color: var(--ez-mu0); font-size: 14px; line-height: 1.55; }
.ezMaxPanel a { color: var(--ezg); font-weight: 600; }
.ezMaxMuted { color: var(--ez-mu0); font-size: 13px; }
.ezMaxH3 { margin-bottom: 12px !important; }
.ezMaxHero p { max-width: 720px; }
.ezMaxFeatures { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.ezMaxFeatures div { border: 1px solid var(--ez-ln0); border-radius: 12px; padding: 12px 14px; background: #fafbfc; }
.ezMaxFeatures b { display: block; font-size: 14px; color: var(--ez-ink0); margin-bottom: 4px; }
.ezMaxFeatures span { font-size: 13px; color: var(--ez-mu0); line-height: 1.45; }
.ezMaxSteps ol { margin: 6px 0 0; padding: 0; list-style: none; counter-reset: ezmax; display: flex; flex-direction: column; gap: 14px; }
.ezMaxSteps li { counter-increment: ezmax; position: relative; padding-left: 40px; font-size: 14px; color: var(--ez-tx0); line-height: 1.55; }
.ezMaxSteps li::before {
content: counter(ezmax);
position: absolute; left: 0; top: -1px;
width: 26px; height: 26px; border-radius: 50%;
background: var(--ezg-soft); color: var(--ezg-deep);
font-weight: 700; font-size: 13px;
display: grid; place-items: center;
}
.ezMaxSteps li b { color: var(--ez-ink0); }
.ezMaxTokenForm { display: flex; gap: 8px; margin-top: 10px; max-width: 620px; }
.ezMaxTokenForm input { flex: 1; min-width: 0; height: 40px; border: 1px solid var(--ez-ln1); border-radius: 10px; padding: 0 12px; font: inherit; font-size: 14px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.ezMaxTokenForm input:focus { outline: none; border-color: var(--ezg); box-shadow: 0 0 0 3px var(--ezg-soft); }
.ezMaxError { color: #b42318; background: #fef3f2; border: 1px solid #fecdca; border-radius: 10px; padding: 8px 12px; font-size: 13px; margin-top: 10px; }
.ezMaxSave .ezMaxError { margin-top: 0; }
.ezMaxTabs { display: flex; gap: 4px; border-bottom: 1px solid var(--ez-ln0); overflow-x: auto; scrollbar-width: none; }
.ezMaxTabs::-webkit-scrollbar { display: none; }
.ezMaxTabs button {
border: 0; background: none; padding: 10px 14px; font: inherit; font-size: 14px; font-weight: 600;
color: var(--ez-mu0); border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; cursor: pointer;
}
.ezMaxTabs button:hover { color: var(--ez-ink0); }
.ezMaxTabs button.is-on { color: var(--ezg-deep); border-bottom-color: var(--ezg); }
.ezMaxBotHead { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 14px; align-items: center; }
.ezMaxAvatar { width: 48px; height: 48px; border-radius: 14px; color: #fff; font-weight: 700; font-size: 20px; display: grid; place-items: center; }
.ezMaxBotName { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ezMaxBotName b { font-size: 16px; color: var(--ez-ink0); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ezMaxBotName a { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ezMaxBotName small { font-size: 12px; color: var(--ez-mu1); }
.ezMaxBotActions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.ezMaxConfirm { display: inline-flex; gap: 8px; flex-wrap: wrap; }
.panelShell .ezMaxPanel .actionButton.danger { background: #b42318 !important; border-color: #b42318 !important; color: #fff !important; }
.panelShell .ezMaxPanel .ezMaxDanger:hover { color: #b42318 !important; border-color: #fecdca !important; }
.ezMaxBadge { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #f1f4f8; color: var(--ez-mu0); white-space: nowrap; }
.ezMaxBadge--ok { background: var(--ezg-soft); color: var(--ezg-deep); }
.ezMaxBadge--err { background: #fef3f2; color: #b42318; }
.ezMaxBadge--off { background: #f4f5f7; color: var(--ez-mu1); }
.ezMaxStats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.ezMaxStats .detailCard { padding: 16px 18px !important; display: flex; flex-direction: column; gap: 2px; }
.ezMaxStats span { font-size: 13px; color: var(--ez-mu0); }
.ezMaxStats b { font-size: 26px; font-weight: 700; color: var(--ez-ink0); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.ezMaxStats small { font-size: 12px; color: var(--ez-mu1); }
.ezMaxCopy { display: flex; gap: 8px; margin-top: 8px; max-width: 620px; }
.ezMaxCopy input { flex: 1; min-width: 0; height: 40px; border: 1px solid var(--ez-ln1); border-radius: 10px; padding: 0 12px; font: inherit; font-size: 14px; background: #fafbfc; color: var(--ez-ink0); }
.ezMaxNext { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.ezMaxNext button { text-align: left; cursor: pointer; display: flex; flex-direction: column; gap: 4px; padding: 16px 18px !important; font: inherit; }
.ezMaxNext button:hover { border-color: var(--ezg-line) !important; }
.ezMaxNext b { font-size: 14px; color: var(--ez-ink0); }
.ezMaxNext span { font-size: 13px; color: var(--ez-mu0); line-height: 1.45; }
.ezMaxForm { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; align-content: start; }
.ezMaxForm > h3 { grid-column: 1 / -1; margin: 6px 0 -4px !important; }
.ezMaxForm > h3:first-child { margin-top: 0 !important; }
.ezMaxField { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ezMaxField--wide { grid-column: 1 / -1; }
.ezMaxField > span { font-size: 13px; font-weight: 600; color: var(--ez-tx0); }
.ezMaxField > small { font-size: 12px; color: var(--ez-mu1); line-height: 1.4; }
.ezMaxField input, .ezMaxField textarea, .ezMaxPrize input {
width: 100%; border: 1px solid var(--ez-ln1); border-radius: 10px; padding: 9px 12px;
font: inherit; font-size: 14px; color: var(--ez-ink0); background: #fff;
}
.ezMaxField input, .ezMaxPrize input { height: 40px; }
.ezMaxField textarea { resize: vertical; min-height: 84px; line-height: 1.5; }
.ezMaxField input:focus, .ezMaxField textarea:focus, .ezMaxPrize input:focus { outline: none; border-color: var(--ezg); box-shadow: 0 0 0 3px var(--ezg-soft); }
.ezMaxColors { display: flex; gap: 10px; flex-wrap: wrap; }
.ezMaxColor { width: 34px; height: 34px; border-radius: 50%; border: 0; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); position: relative; }
.ezMaxColor.is-on { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--ez-ink0); }
.ezMaxSave { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 12px; border-top: 1px solid var(--ez-ln0); margin-top: 4px; flex-wrap: wrap; }
.ezMaxDesign, .ezMaxMail { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 14px; align-items: start; }
.ezMaxHistory { grid-column: 1 / -1; }
.ezMaxPreviewWrap { position: sticky; top: 16px; display: flex; flex-direction: column; gap: 8px; }
.ezMaxPhone { background: #eef1f4; border: 1px solid var(--ez-ln0); border-radius: 22px; padding: 16px 14px; display: flex; flex-direction: column; gap: 8px; }
.ezMaxCard { border-radius: 16px; padding: 14px 14px 12px; color: #fff; min-height: 150px; display: flex; flex-direction: column; }
.ezMaxCardTop { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; }
.ezMaxCardTop b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ezMaxCardTop span { opacity: .8; white-space: nowrap; }
.ezMaxCardSum { margin-top: auto; padding-top: 14px; }
.ezMaxCardSum strong { display: block; font-size: 30px; line-height: 1; font-weight: 700; }
.ezMaxCardSum span { font-size: 12px; opacity: .85; }
.ezMaxCardBottom { display: flex; justify-content: space-between; font-size: 11px; opacity: .9; margin-top: 10px; }
.ezMaxBubble { background: #fff; border-radius: 14px 14px 14px 4px; padding: 10px 12px; font-size: 13px; line-height: 1.45; color: var(--ez-ink0); white-space: pre-wrap; overflow-wrap: anywhere; max-height: 260px; overflow: auto; }
.ezMaxBubbleBtn { background: #fff; border-radius: 10px; padding: 8px 12px; text-align: center; font-size: 13px; font-weight: 600; color: var(--ezg-deep); }
.ezMaxBonus { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 14px; align-items: start; }
.ezMaxBonus .ezMaxForm { grid-template-columns: minmax(0, 1fr); }
.ezMaxSaveBar { grid-column: 1 / -1; padding: 14px 22px !important; }
.ezMaxSaveBar .ezMaxSave { border-top: 0; padding-top: 0; margin-top: 0; }
.ezMaxInline { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 14px; color: var(--ez-tx0); font-weight: 600; }
.ezMaxInline input { width: 72px; height: 40px; border: 1px solid var(--ez-ln1); border-radius: 10px; padding: 0 12px; font: inherit; font-weight: 400; text-align: center; }
.ezMaxInline input:focus { outline: none; border-color: var(--ezg); box-shadow: 0 0 0 3px var(--ezg-soft); }
.ezMaxInline span:last-child { font-weight: 400; color: var(--ez-mu0); }
.ezMaxToggleRow { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 0 2px; border-top: 1px solid var(--ez-ln0); }
.ezMaxToggleRow--head { border-top: 0; padding-top: 0; }
.ezMaxToggleRow--head h3 { margin: 0 0 2px !important; }
.ezMaxToggleRow b { display: block; font-size: 14px; color: var(--ez-ink0); }
.ezMaxToggleRow small { display: block; font-size: 12.5px; color: var(--ez-mu0); line-height: 1.45; margin-top: 2px; }
.ezMaxNote { font-size: 12.5px; color: #7a5b0c; background: #fffaeb; border: 1px solid #fde8b0; border-radius: 10px; padding: 9px 12px; line-height: 1.45; }
.ezMaxSwitch { position: relative; width: 42px; height: 24px; flex: none; border-radius: 999px; border: 0; background: #d5dbe3; cursor: pointer; transition: background .15s; padding: 0; }
.ezMaxSwitch span { position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: transform .15s; }
.ezMaxSwitch.is-on { background: var(--ezg); }
.ezMaxSwitch.is-on span { transform: translateX(18px); }
.ezMaxSwitch:focus-visible { outline: 2px solid var(--ezg); outline-offset: 2px; }
.ezMaxPrizes { display: flex; flex-direction: column; gap: 8px; }
.ezMaxPrizeHead, .ezMaxPrize { display: grid; grid-template-columns: minmax(0, 1fr) 90px 70px 56px 32px; gap: 8px; align-items: center; }
.ezMaxPrizeHead span { font-size: 12px; font-weight: 600; color: var(--ez-mu1); }
.ezMaxChance { font-size: 13px; color: var(--ez-mu0); font-variant-numeric: tabular-nums; text-align: right; }
.ezMaxIconBtn { width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--ez-ln0); background: #fff; color: var(--ez-mu0); font-size: 18px; line-height: 1; cursor: pointer; }
.ezMaxIconBtn:hover:not(:disabled) { color: #b42318; border-color: #fecdca; }
.ezMaxIconBtn:disabled { opacity: .4; cursor: default; }
.ezMaxAdd { align-self: flex-start; }
.ezMaxTable tr.is-off td { color: var(--ez-mu1); }
.ezMaxTable td { vertical-align: middle; }
.ezMaxMailText { max-width: 360px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1100px) {
.ezMaxFeatures, .ezMaxNext { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ezMaxStats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ezMaxBonus { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
.ezMaxDesign, .ezMaxMail { grid-template-columns: minmax(0, 1fr); }
.ezMaxPreviewWrap { position: static; max-width: 360px; }
}
@media (max-width: 640px) {
.ezMaxPanel .detailCard { padding: 16px !important; }
.ezMaxForm { grid-template-columns: minmax(0, 1fr); }
.ezMaxFeatures, .ezMaxNext { grid-template-columns: minmax(0, 1fr); }
.ezMaxBotHead { grid-template-columns: 44px minmax(0, 1fr); }
.ezMaxBotActions { grid-column: 1 / -1; justify-content: flex-start; }
.ezMaxTokenForm, .ezMaxCopy { flex-direction: column; }
.ezMaxPrizeHead, .ezMaxPrize { grid-template-columns: minmax(0, 1fr) 70px 56px 30px; }
.ezMaxPrizeHead span:nth-child(4), .ezMaxChance { display: none; }
.ezMaxMailText { max-width: 180px; }
}