.lb-panel-root, .lb-login-wrap, .lb-panel-modal-overlay {
--lb-rose: #E8537A;
--lb-rose-10: #FBEAF0;
--lb-rose-dark: #C13860;
--lb-ink: #1a1a2e;
--lb-ink-60: #6b7280;
--lb-ink-20: #d1d5db;
--lb-ink-10: #e5e7eb;
--lb-bg: #f7f7fa;
--lb-surface: #ffffff;
--lb-radius: 12px;
--lb-radius-sm: 8px;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
box-sizing: border-box;
color: var(--lb-ink);
}
.lb-panel-root *, .lb-login-wrap *, .lb-panel-modal-overlay * { box-sizing: border-box; } .lb-login-wrap {
min-height: 70vh;
display: flex;
align-items: center;
justify-content: center;
padding: 40px 20px;
background: var(--lb-bg);
}
.lb-login-card {
background: var(--lb-surface);
border-radius: var(--lb-radius);
box-shadow: 0 10px 40px rgba(0,0,0,.08);
padding: 36px 32px;
width: 100%;
max-width: 380px;
}
.lb-login-logo {
font-size: 24px;
font-weight: 700;
text-align: center;
color: var(--lb-ink);
}
.lb-login-logo span { color: var(--lb-rose); }
.lb-login-sub {
text-align: center;
color: var(--lb-ink-60);
font-size: 14px;
margin: 4px 0 24px;
}
.lb-login-error {
background: #fef2f2;
color: #b91c1c;
padding: 10px 14px;
border-radius: var(--lb-radius-sm);
font-size: 13px;
margin-bottom: 16px;
}
.lb-login-field { margin-bottom: 16px; }
.lb-login-field label {
display: block;
font-size: 13px;
font-weight: 500;
margin-bottom: 6px;
color: var(--lb-ink);
}
.lb-login-field input {
width: 100%;
padding: 11px 14px;
border: 1.5px solid var(--lb-ink-20);
border-radius: var(--lb-radius-sm);
font-size: 14px;
transition: border-color .15s;
}
.lb-login-field input:focus {
outline: none;
border-color: var(--lb-rose);
}
.lb-login-btn {
width: 100%;
padding: 12px;
background: var(--lb-rose);
color: #fff;
border: none;
border-radius: var(--lb-radius-sm);
font-size: 15px;
font-weight: 600;
cursor: pointer;
transition: background .15s;
}
.lb-login-btn:hover { background: var(--lb-rose-dark); }
.lb-login-foot {
text-align: center;
margin-top: 16px;
}
.lb-login-foot a {
color: var(--lb-ink-60);
font-size: 13px;
text-decoration: none;
}
.lb-login-foot a:hover { color: var(--lb-rose); } .lb-panel-root {
background: var(--lb-bg);
min-height: 80vh;
border-radius: var(--lb-radius);
overflow: hidden;
}
.lb-panel-loading {
display: flex;
align-items: center;
justify-content: center;
min-height: 400px;
}
.lb-panel-spinner {
width: 36px; height: 36px;
border: 3px solid var(--lb-ink-10);
border-top-color: var(--lb-rose);
border-radius: 50%;
animation: lb-spin .8s linear infinite;
}
@keyframes lb-spin { to { transform: rotate(360deg); } }
.lb-panel-shell { display: flex; min-height: 80vh; } .lb-panel-sidebar {
width: 220px;
flex-shrink: 0;
background: var(--lb-surface);
border-right: 1px solid var(--lb-ink-10);
display: flex;
flex-direction: column;
padding: 20px 0;
}
.lb-panel-logo {
padding: 0 20px 16px;
border-bottom: 1px solid var(--lb-ink-10);
margin-bottom: 10px;
}
.lb-panel-logo-name { font-size: 15px; font-weight: 700; }
.lb-panel-logo-name span { color: var(--lb-rose); }
.lb-panel-logo-sub { font-size: 11px; color: var(--lb-ink-60); margin-top: 2px; }
.lb-panel-nav-section {
padding: 10px 20px 4px;
font-size: 10px; font-weight: 600;
text-transform: uppercase; letter-spacing: .06em;
color: var(--lb-ink-60);
}
.lb-panel-nav-item {
display: flex; align-items: center; gap: 10px;
padding: 10px 20px;
font-size: 14px;
color: var(--lb-ink-60);
cursor: pointer;
border-left: 3px solid transparent;
transition: all .12s;
text-decoration: none;
}
.lb-panel-nav-item:hover { background: var(--lb-bg); color: var(--lb-ink); }
.lb-panel-nav-item.active {
color: var(--lb-rose);
border-left-color: var(--lb-rose);
background: var(--lb-rose-10);
font-weight: 500;
}
.lb-panel-nav-item .lb-ico { font-size: 18px; width: 20px; text-align: center; }
.lb-panel-sidebar-foot {
margin-top: auto;
padding: 14px 20px;
border-top: 1px solid var(--lb-ink-10);
}
.lb-panel-user {
display: flex; align-items: center; gap: 10px;
}
.lb-panel-user-av {
width: 32px; height: 32px; border-radius: 50%;
background: var(--lb-rose-10); color: var(--lb-rose);
display: flex; align-items: center; justify-content: center;
font-size: 12px; font-weight: 600;
}
.lb-panel-user-name { font-size: 13px; font-weight: 500; }
.lb-panel-user-role { font-size: 11px; color: var(--lb-ink-60); }
.lb-panel-logout {
display: block; margin-top: 10px;
font-size: 12px; color: var(--lb-ink-60);
text-decoration: none;
}
.lb-panel-logout:hover { color: var(--lb-rose); } .lb-panel-main { flex: 1; padding: 24px; overflow: auto; }
.lb-panel-header {
display: flex; justify-content: space-between; align-items: center;
margin-bottom: 20px;
}
.lb-panel-title {
font-size: 18px; font-weight: 600;
display: flex; align-items: center; gap: 8px;
}
.lb-panel-title .lb-ico { color: var(--lb-rose); } .lb-panel-stats {
display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
margin-bottom: 20px;
}
.lb-panel-stat {
background: var(--lb-surface);
border: 1px solid var(--lb-ink-10);
border-radius: var(--lb-radius-sm);
padding: 14px 16px;
}
.lb-panel-stat-label { font-size: 12px; color: var(--lb-ink-60); margin-bottom: 4px; }
.lb-panel-stat-num { font-size: 22px; font-weight: 600; }
.lb-panel-stat-sub { font-size: 11px; color: var(--lb-ink-60); margin-top: 2px; }
.lb-panel-card {
background: var(--lb-surface);
border: 1px solid var(--lb-ink-10);
border-radius: var(--lb-radius);
overflow: hidden;
margin-bottom: 16px;
}
.lb-panel-card-header {
padding: 14px 16px;
border-bottom: 1px solid var(--lb-ink-10);
font-size: 14px; font-weight: 600;
display: flex; justify-content: space-between; align-items: center;
}
.lb-panel-card-body { padding: 0; } .lb-panel-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.lb-panel-table thead th {
padding: 10px 16px; text-align: left;
color: var(--lb-ink-60); font-weight: 500;
font-size: 11px; text-transform: uppercase; letter-spacing: .04em;
border-bottom: 1px solid var(--lb-ink-10);
}
.lb-panel-table tbody tr { border-bottom: 1px solid var(--lb-ink-10); }
.lb-panel-table tbody tr:last-child { border: none; }
.lb-panel-table tbody td { padding: 11px 16px; } .lb-panel-btn {
padding: 8px 16px; border-radius: var(--lb-radius-sm);
font-size: 13px; cursor: pointer; border: 1px solid var(--lb-ink-20);
background: var(--lb-surface); color: var(--lb-ink);
display: inline-flex; align-items: center; gap: 6px;
transition: all .12s;
}
.lb-panel-btn:hover { background: var(--lb-bg); }
.lb-panel-btn-primary {
background: var(--lb-rose); color: #fff; border-color: var(--lb-rose);
}
.lb-panel-btn-primary:hover { background: var(--lb-rose-dark); }
.lb-panel-btn-sm { padding: 4px 10px; font-size: 12px; }
.lb-panel-btn-danger { color: #b91c1c; border-color: #fca5a5; }
.lb-panel-btn-danger:hover { background: #fef2f2; } .lb-panel-badge {
padding: 2px 8px; border-radius: 20px; font-size: 11px; font-weight: 500;
}
.lb-badge-pending { background: #fef3c7; color: #92400e; }
.lb-badge-confirmed { background: #d1fae5; color: #065f46; }
.lb-badge-cancelled { background: #fee2e2; color: #991b1b; }
.lb-badge-active { background: #d1fae5; color: #065f46; } .lb-panel-empty {
text-align: center; padding: 40px 20px; color: var(--lb-ink-60);
}
.lb-panel-empty .lb-ico { font-size: 36px; opacity: .4; display: block; margin-bottom: 10px; }
.lb-panel-error {
max-width: 400px; margin: 60px auto; text-align: center;
background: #fff; padding: 32px; border-radius: var(--lb-radius);
box-shadow: 0 4px 20px rgba(0,0,0,.06);
}
.lb-panel-error a { color: var(--lb-rose); } .lb-panel-toast {
position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); background: var(--lb-ink, #1a1a2e); color: #fff; padding: 12px 24px;
border-radius: 10px; font-size: 14px; z-index: 99999; max-width: 90vw;
box-shadow: 0 8px 30px rgba(0,0,0,.2);
}
.lb-panel-toast.error { background: #b91c1c; } @media (max-width: 768px) {
.lb-panel-shell { flex-direction: column; }
.lb-panel-sidebar { width: 100%; flex-direction: row; flex-wrap: wrap; overflow-x: auto; }
.lb-panel-stats { grid-template-columns: repeat(2, 1fr); }
} .lb-panel-modal-overlay {
position: fixed; inset: 0; background: rgba(0,0,0,.5);
display: flex; align-items: center; justify-content: center;
z-index: 99998; padding: 20px;
}
.lb-panel-modal {
background: var(--lb-surface); border-radius: var(--lb-radius);
width: 100%; max-width: 480px; max-height: 90vh; overflow-y: auto;
box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.lb-panel-modal-header {
padding: 16px 20px; border-bottom: 1px solid var(--lb-ink-10);
display: flex; justify-content: space-between; align-items: center;
}
.lb-panel-modal-title { font-size: 16px; font-weight: 600; }
.lb-panel-modal-close {
background: none; border: none; font-size: 20px; cursor: pointer;
color: var(--lb-ink-60); line-height: 1; padding: 0;
}
.lb-panel-modal-body { padding: 20px; }
.lb-panel-modal-footer {
padding: 14px 20px; border-top: 1px solid var(--lb-ink-10);
display: flex; justify-content: flex-end; gap: 10px;
}
.lb-panel-field { margin-bottom: 14px; }
.lb-panel-field label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 6px; }
.lb-panel-field input, .lb-panel-field select, .lb-panel-field textarea {
width: 100%; padding: 10px 12px; border: 1.5px solid var(--lb-ink-20);
border-radius: var(--lb-radius-sm); font-size: 14px; font-family: inherit;
}
.lb-panel-field input:focus, .lb-panel-field select:focus, .lb-panel-field textarea:focus {
outline: none; border-color: var(--lb-rose);
}
.lb-panel-field-row { display: flex; gap: 12px; }
.lb-panel-field-row > div { flex: 1; }
.lb-panel-hint { font-size: 11px; color: var(--lb-ink-60); margin-top: 4px; } .lb-cal-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px;background:#fff;padding:12px 14px;border-radius:12px;border:1px solid var(--lb-ink-10)}
.lb-cal-nav{display:flex;align-items:center;gap:8px}
.lb-cal-label{font-size:14px;font-weight:600;min-width:160px;text-align:center}
.lb-cal-views{display:flex;border:1.5px solid var(--lb-ink-20);border-radius:8px;overflow:hidden}
.lb-cal-vtab{padding:6px 14px;font-size:12px;font-weight:500;cursor:pointer;color:var(--lb-ink-60);background:#fff;border:none}
.lb-cal-vtab.active{background:var(--lb-rose);color:#fff}
.lb-cal-vtab-list{border-color:var(--lb-rose)!important;color:var(--lb-rose)}
.lb-cal-vtab-list.active{background:var(--lb-rose);color:#fff}
.lb-cal-vtab-list i{font-size:14px;vertical-align:-2px}
.lb-cal-legend{display:flex;gap:16px;align-items:center;font-size:11px;color:var(--lb-ink-60);margin-top:12px;padding:10px 14px;background:#fff;border-radius:10px;border:1px solid var(--lb-ink-10);flex-wrap:wrap}
.lb-cal-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;display:inline-block} .lb-cal-month{background:#fff;border-radius:12px;border:1px solid var(--lb-ink-10);overflow:hidden}
.lb-cal-month-head{display:grid;grid-template-columns:repeat(7,1fr);background:#faf8fb;border-bottom:1px solid var(--lb-ink-10)}
.lb-cal-month-head>div{padding:8px;text-align:center;font-size:11px;font-weight:600;color:var(--lb-ink-60);text-transform:uppercase;letter-spacing:.04em}
.lb-cal-month-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.lb-cal-mcell{min-height:96px;border-right:1px solid var(--lb-ink-10);border-bottom:1px solid var(--lb-ink-10);padding:4px 5px;cursor:pointer;transition:background .1s}
.lb-cal-mcell:hover{background:#faf8fb}
.lb-cal-mcell.out{background:#fafafa;opacity:.5}
.lb-cal-mcell.today .lb-cal-mnum{background:var(--lb-rose);color:#fff;border-radius:50%;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center}
.lb-cal-mnum{font-size:12px;font-weight:600;margin-bottom:3px}
.lb-cal-mchip{font-size:10px;padding:2px 5px;border-radius:4px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.lb-cal-mmore{font-size:10px;color:var(--lb-ink-60);padding-left:3px} .lb-cal-dw-head{display:grid;background:#fff;border:1px solid var(--lb-ink-10);border-bottom:none;border-radius:12px 12px 0 0;position:sticky;top:0;z-index:4}
.lb-cal-dw-dh{padding:10px 4px;text-align:center;font-size:11px;font-weight:600;color:var(--lb-ink-60);text-transform:uppercase;border-left:1px solid var(--lb-ink-10)}
.lb-cal-dw-dh span{display:block;font-size:18px;font-weight:700;color:var(--lb-ink);margin-top:2px}
.lb-cal-dw-dh.today span{color:var(--lb-rose)}
.lb-cal-dw-grid{max-height:560px;overflow-y:auto;background:#fff;border:1px solid var(--lb-ink-10);border-radius:0 0 12px 12px}
.lb-cal-dw-body{display:grid;position:relative}
.lb-cal-dw-times{border-right:1px solid var(--lb-ink-10)}
.lb-cal-dw-time{font-size:10px;color:var(--lb-ink-60);text-align:right;padding:2px 6px 0 0;box-sizing:border-box}
.lb-cal-dw-col{position:relative;border-left:1px solid var(--lb-ink-10)}
.lb-cal-dw-hline{border-bottom:1px solid #f0eef2;box-sizing:border-box}
.lb-cal-appt{position:absolute;border-radius:6px;padding:2px 5px;font-size:11px;cursor:pointer;overflow:hidden;z-index:2;transition:box-shadow .1s;box-sizing:border-box;line-height:1.25}
.lb-cal-appt:hover{z-index:10;box-shadow:0 4px 12px rgba(0,0,0,.18)}
.lb-cal-appt.compact{padding:1px 5px;display:flex;align-items:center}
.lb-cal-appt-t{font-size:10px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-cal-appt-n{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-cal-appt-s{opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px} @media(max-width:640px){
.lb-cal-toolbar{gap:8px}
.lb-cal-label{min-width:110px;font-size:13px}
.lb-cal-mcell{min-height:64px}
.lb-cal-mchip{font-size:9px}
.lb-cal-dw-dh span{font-size:15px}
} .lb-sub-banner{background:linear-gradient(135deg,#fff,var(--lb-rose-10));border:1.5px solid var(--lb-rose-10);border-radius:14px;padding:18px 20px;margin-bottom:22px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.lb-sub-badge{background:var(--lb-rose);color:#fff;font-size:11px;font-weight:600;padding:4px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.04em}
.lb-sub-billing{display:inline-flex;background:#fff;border:1.5px solid var(--lb-ink-20);border-radius:10px;padding:3px;margin-bottom:20px;gap:2px}
.lb-sub-bopt{padding:7px 18px;font-size:13px;font-weight:600;border-radius:7px;cursor:pointer;color:var(--lb-ink-60);border:none;background:none}
.lb-sub-bopt.active{background:var(--lb-rose);color:#fff}
.lb-sub-bopt.active span{color:#fff !important}
.lb-sub-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.lb-sub-card{background:#fff;border:1.5px solid var(--lb-ink-10);border-radius:16px;padding:22px 20px;display:flex;flex-direction:column;position:relative;transition:.15s}
.lb-sub-card:hover{border-color:var(--lb-rose);box-shadow:0 8px 28px rgba(232,83,122,.1)}
.lb-sub-card.cur{border-color:var(--lb-teal);background:var(--lb-teal-10)}
.lb-sub-tag{position:absolute;top:-10px;left:50%;transform:translateX(-50%);color:#fff;font-size:10px;font-weight:700;padding:3px 12px;border-radius:20px;text-transform:uppercase;white-space:nowrap}
.lb-sub-tag.cur{background:var(--lb-teal)}
.lb-sub-name{font-size:17px;font-weight:700;margin-bottom:4px}
.lb-sub-model{font-size:11px;color:var(--lb-ink-60);text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px}
.lb-sub-price{font-size:30px;font-weight:800;line-height:1}
.lb-sub-price small{font-size:13px;font-weight:500;color:var(--lb-ink-60)}
.lb-sub-psub{font-size:12px;color:var(--lb-ink-60);margin-top:4px;min-height:16px}
.lb-sub-div{height:1px;background:var(--lb-ink-10);margin:16px 0}
.lb-sub-limits{font-size:11px;color:var(--lb-ink-60);background:var(--lb-bg,#f7f7fa);border-radius:8px;padding:8px 10px;margin-bottom:14px;line-height:1.7}
.lb-sub-feats{list-style:none;display:flex;flex-direction:column;gap:9px;flex:1;margin:0 0 18px;padding:0}
.lb-sub-feat{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--lb-green);font-weight:500}
.lb-sub-feat.off{color:var(--lb-ink-20)}
.lb-sub-cta{width:100%;justify-content:center}
.lb-sub-cta-cur{background:var(--lb-teal-10);color:var(--lb-teal);border-color:var(--lb-teal);cursor:default}
@media(max-width:640px){.lb-sub-price{font-size:26px}} .lb-panel-lang { padding: 0 16px; margin-bottom: 10px; }
.lb-panel-lang-select { width: 100%; border: 1px solid var(--lb-ink-20,#d1d5db); border-radius: 8px; padding: 7px 10px; font-size: 13px; color: var(--lb-ink,#1a1523); background: #fff; cursor: pointer; outline: none; }
.lb-panel-lang-select:focus { border-color: var(--lb-rose,#e8537a); }