:root{--bg:#f5f7fb;--card:#fff;--text:#0f172a;--muted:#64748b;--primary:#2563eb;--primary2:#0f172a;--border:#e2e8f0;--ok:#dcfce7;--err:#fee2e2;--shadow:0 18px 50px rgba(15,23,42,.09)}*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at top left,#dbeafe 0,#f8fafc 32%,#f5f7fb 100%);color:var(--text)}a{color:inherit}.page{min-height:100vh}.nav{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:14px clamp(16px,4vw,52px)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:900;font-size:22px}.logo{display:grid;place-items:center;background:linear-gradient(135deg,#2563eb,#0f172a);color:white;border-radius:14px;width:42px;height:42px;font-size:16px}.navlinks{display:flex;align-items:center;gap:18px}.navlinks a{text-decoration:none;font-weight:650}.hamb{display:none;background:white;border:1px solid var(--border);border-radius:12px;padding:10px}.userpill{background:#e0f2fe;color:#075985;border-radius:999px;padding:7px 12px;font-weight:700}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:white;text-decoration:none;border-radius:14px;padding:12px 18px;font-weight:800;cursor:pointer;box-shadow:0 10px 24px rgba(37,99,235,.23)}.btn.small{padding:9px 13px;border-radius:11px;font-size:14px}.btn.big{padding:15px 22px;font-size:16px}.btn.full{width:100%}.btn.ghost{background:#fff;color:#1e293b;border:1px solid var(--border);box-shadow:none}main{max-width:1240px;margin:auto;padding:26px clamp(14px,4vw,52px)}.hero{display:grid;grid-template-columns:1.5fr .8fr;gap:26px;align-items:stretch;margin-top:20px}.heroText,.heroCard,.subHero,.tableCard,.loginBox,.sidePanel,.ticketMain,.proForm{background:rgba(255,255,255,.9);border:1px solid rgba(226,232,240,.9);border-radius:30px;box-shadow:var(--shadow)}.heroText{padding:54px}.eyebrow{display:inline-flex;color:#1d4ed8;background:#dbeafe;font-weight:900;border-radius:999px;padding:8px 13px;margin-bottom:16px;font-size:13px;text-transform:uppercase;letter-spacing:.06em}.hero h1,.subHero h1,.formWrap h1,.loginInfo h1,.dashboardHead h1,.ticketMain h1{font-size:clamp(32px,5vw,58px);line-height:1.04;margin:0 0 16px}.hero p,.subHero p{font-size:18px;color:var(--muted);line-height:1.65}.searchBox{margin-top:26px;display:flex;gap:12px;align-items:center}.searchBox select,.searchBox input,.proForm input,.proForm select,.proForm textarea,.loginBox input,.tableSearch{width:100%;border:1px solid var(--border);border-radius:14px;background:white;padding:14px 15px;font:inherit;outline:none}.searchBox select{max-width:390px}.heroCard{padding:34px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(135deg,#0f172a,#1e3a8a);color:white}.bigNumber{font-size:70px;font-weight:950}.heroCard p{color:#dbeafe}.miniStats,.tags,.meta{display:flex;flex-wrap:wrap;gap:9px}.miniStats span,.tags span,.meta span{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:8px 11px}.steps,.cards,.statGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:24px 0}.steps article,.providerCard,.statGrid article{background:white;border:1px solid var(--border);border-radius:24px;padding:24px;box-shadow:var(--shadow)}.steps b{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#dbeafe;color:#1d4ed8}.section{margin-top:34px}.sectionHead{display:flex;justify-content:space-between;align-items:center;gap:18px}.sectionHead h2{font-size:30px;margin:0}.sectionHead p,.muted{color:var(--muted)}.providerCard{display:flex;flex-direction:column;gap:10px}.providerIcon{width:54px;height:54px;display:grid;place-items:center;border-radius:18px;background:#eff6ff;font-size:26px}.providerCard h3{font-size:21px;margin:0}.providerCard p{color:var(--muted);line-height:1.55}.providerCard.wide{min-height:300px}.row{display:flex;align-items:center;gap:14px}.subHero{padding:36px;margin-bottom:22px}.subHero h1{font-size:42px}.searchBox.slim{max-width:640px}.empty{background:white;border:1px dashed #94a3b8;border-radius:22px;padding:30px;color:var(--muted);text-align:center}.formWrap{display:grid;grid-template-columns:.75fr 1.25fr;gap:24px;align-items:start}.proForm{padding:26px;display:grid;gap:16px}.formGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.proForm label,.loginBox label{display:grid;gap:8px;font-weight:800}.invalid{border-color:#ef4444!important;background:#fff1f2!important}.loginPage{display:grid;grid-template-columns:1fr 430px;gap:28px;align-items:center;min-height:70vh}.loginInfo{padding:20px}.loginInfo h1{max-width:720px}.demo{background:#0f172a;color:#e2e8f0;border-radius:18px;padding:18px;line-height:1.8}.loginBox{padding:30px;display:grid;gap:16px}.dashboardHead{display:flex;justify-content:space-between;align-items:end;margin-bottom:20px}.dashboardHead h1{font-size:42px}.statGrid{grid-template-columns:repeat(4,1fr)}.statGrid b{font-size:38px;display:block}.statGrid span{color:var(--muted);font-weight:750}.tableCard{padding:24px;margin:22px 0;overflow:auto}table{width:100%;border-collapse:collapse;min-width:780px}th,td{border-bottom:1px solid var(--border);padding:14px;text-align:left}th{color:#475569;font-size:13px;text-transform:uppercase;letter-spacing:.04em}.badge{display:inline-flex;border-radius:999px;padding:7px 10px;background:#eef2ff;color:#3730a3;font-weight:800;font-size:12px}.status-new{background:#dbeafe;color:#1d4ed8}.status-in_progress{background:#fef3c7;color:#92400e}.status-solved,.status-approved{background:#dcfce7;color:#166534}.status-closed{background:#f1f5f9;color:#334155}.status-rejected,.status-blocked{background:#fee2e2;color:#991b1b}.prio-critical{background:#fee2e2;color:#991b1b}.prio-high{background:#ffedd5;color:#9a3412}.inline{display:flex;gap:8px}.ticketLayout{display:grid;grid-template-columns:1fr 360px;gap:22px}.ticketMain,.sidePanel{padding:28px}.desc{background:#f8fafc;border:1px solid var(--border);border-radius:18px;padding:18px;margin:22px 0;line-height:1.7}.message{background:#f8fafc;border-left:5px solid #2563eb;border-radius:16px;padding:16px;margin:12px 0}.message span{display:block;color:var(--muted);font-size:13px;margin-top:4px}.compact{box-shadow:none;border-radius:20px}.toast{max-width:1240px;margin:8px auto 20px;padding:15px 18px;border-radius:16px;font-weight:750}.toast.ok{background:var(--ok);color:#166534}.toast.error{background:var(--err);color:#991b1b}.footer{text-align:center;color:var(--muted);padding:34px}@media(max-width:860px){.hamb{display:block}.navlinks{display:none;position:absolute;top:72px;left:14px;right:14px;background:white;border:1px solid var(--border);border-radius:18px;padding:16px;flex-direction:column;align-items:flex-start;box-shadow:var(--shadow)}.navlinks.open{display:flex}.hero,.formWrap,.loginPage,.ticketLayout{grid-template-columns:1fr}.heroText{padding:30px}.searchBox{flex-direction:column;align-items:stretch}.searchBox select{max-width:none}.steps,.cards,.statGrid{grid-template-columns:1fr}.formGrid{grid-template-columns:1fr}.sectionHead{align-items:flex-start;flex-direction:column}.bigNumber{font-size:50px}}
.cityGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px;max-height:min(68vh,760px);overflow:auto;padding:4px;border-radius:22px}.cityCheck{display:flex!important;align-items:center;gap:10px;background:#f8fafc;border:1px solid var(--border);border-radius:16px;padding:12px 14px;font-weight:800}.cityCheck input{width:auto!important}.cityCheck small{display:block;color:var(--muted);font-weight:600}.checkline{display:flex!important;align-items:center;gap:10px;background:#f8fafc;border:1px solid var(--border);border-radius:16px;padding:12px 14px}.checkline input{width:auto!important}@media(max-width:860px){.cityGrid{grid-template-columns:1fr;max-height:58vh;padding:6px}}
/* Public ticket tracking page */
.grid.two{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:start}.between{justify-content:space-between}.statusBadge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:9px 13px;font-weight:900;font-size:13px;white-space:nowrap}.ticketText{background:#f8fafc;border:1px solid var(--border);border-radius:18px;padding:18px;line-height:1.7;color:#334155}.timeline{display:grid;gap:14px;margin-top:14px}.timelineItem{display:grid;grid-template-columns:18px 1fr;gap:12px;align-items:start}.timelineDot{width:14px;height:14px;margin-top:8px;border-radius:999px;background:#2563eb;box-shadow:0 0 0 5px #dbeafe}.timelineBody{background:#f8fafc;border:1px solid var(--border);border-radius:18px;padding:15px}.timelineBody p{margin-bottom:0;color:#334155}.timelineBody small{color:var(--muted)}@media(max-width:860px){.grid.two{grid-template-columns:1fr}.between{align-items:flex-start;flex-direction:column}.statusBadge{align-self:flex-start}}

/* Home page ticket tracking UI */
.trackingBox{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:center;margin:26px 0;background:rgba(255,255,255,.94);border:1px solid var(--border);border-radius:30px;box-shadow:var(--shadow);padding:28px}
.trackingInfo h2{font-size:32px;line-height:1.15;margin:0 0 10px}.trackingInfo p{color:var(--muted);line-height:1.65;margin:0}.trackingForm{background:linear-gradient(135deg,#f8fafc,#eff6ff);border:1px solid #dbeafe;border-radius:24px;padding:22px;display:grid;gap:10px}.trackingForm label{font-weight:900}.trackInputRow{display:flex;gap:10px}.trackInputRow input{width:100%;border:1px solid var(--border);border-radius:14px;background:white;padding:14px 15px;font:inherit;text-transform:uppercase;outline:none}.trackInputRow button{border:0;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:white;border-radius:14px;padding:0 18px;font-weight:900;cursor:pointer;white-space:nowrap}.trackingForm small{color:var(--muted);line-height:1.45}@media(max-width:860px){.trackingBox{grid-template-columns:1fr;padding:20px}.trackInputRow{flex-direction:column}.trackInputRow button{padding:14px 18px}}

/* Customer company profile + two-way chat update */
.compactGrid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.miniData{display:grid;gap:8px;margin:14px 0;color:#64748b;font-size:14px;line-height:1.35;}
.detailList{display:grid;gap:10px;margin:16px 0 22px;padding:16px;border:1px solid #e5e7eb;border-radius:18px;background:#f8fafc;}
.chatForm{margin-top:24px;border-top:1px solid #e5e7eb;padding-top:20px;}
.message.mine{border-left-color:#16a34a;background:#f0fdf4;}
.smallText{font-size:13px;margin-top:8px;}
.sidePanel .full{width:100%;justify-content:center;margin-top:12px;}

/* Dashboard statistics update */
.proStats{margin-top:18px;margin-bottom:18px;}
.proStats article{position:relative;overflow:hidden;}
.proStats article:after{content:"";position:absolute;right:-26px;top:-26px;width:88px;height:88px;border-radius:999px;background:linear-gradient(135deg,#dbeafe,rgba(37,99,235,.08));}
.proStats small{display:block;color:#64748b;font-weight:900;text-transform:uppercase;letter-spacing:.06em;font-size:11px;margin-bottom:8px;}
.secondaryStats article{box-shadow:none;background:rgba(255,255,255,.72);}
.dashboardGrid{align-items:stretch;}
.dashboardGrid .tableCard{margin:0;}
.dashboardGrid table{min-width:620px;}
@media(max-width:1100px){.dashboardGrid{grid-template-columns:1fr!important;}}


/* v0.5 Admin UI + statistics polish */
.proHero{background:linear-gradient(135deg,rgba(239,246,255,.85),rgba(255,255,255,.95));border:1px solid var(--border);border-radius:30px;box-shadow:var(--shadow);padding:28px;margin-bottom:22px;}
.wrapActions{flex-wrap:wrap;justify-content:flex-end}.kpiGrid article:first-child{background:linear-gradient(135deg,#0f172a,#1d4ed8);color:#fff}.kpiGrid article:first-child small,.kpiGrid article:first-child span{color:#dbeafe}.chartCard{min-height:360px}.barChart{height:260px;display:flex;align-items:end;gap:18px;padding:18px 8px 4px}.barItem{flex:1;display:grid;grid-template-rows:24px 1fr 24px;gap:8px;text-align:center;min-width:54px}.barValue{font-weight:950;color:#1d4ed8}.barTrack{height:190px;border-radius:999px;background:#eff6ff;border:1px solid #dbeafe;display:flex;align-items:end;overflow:hidden}.barTrack span{display:block;width:100%;border-radius:999px 999px 0 0;background:linear-gradient(180deg,#60a5fa,#2563eb);min-height:8px}.barItem small{font-weight:800;color:#64748b}.progressList{display:grid;gap:14px;margin-top:18px}.progressRow{display:grid;grid-template-columns:150px 1fr 54px;gap:14px;align-items:center}.progressRow div:first-child{display:grid;gap:2px}.progressRow span{color:#64748b;font-size:13px}.progressRow em{font-style:normal;font-weight:900;text-align:right;color:#334155}.progress,.miniProgress{height:12px;background:#eff6ff;border:1px solid #dbeafe;border-radius:999px;overflow:hidden}.progress span,.miniProgress span{display:block;height:100%;background:linear-gradient(90deg,#2563eb,#60a5fa);border-radius:999px}.planTiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-top:18px}.planTiles article{border:1px solid var(--border);background:#f8fafc;border-radius:20px;padding:18px}.planTiles small{display:block;color:#64748b;font-weight:900;text-transform:uppercase;font-size:11px}.planTiles b{display:block;font-size:20px;margin:8px 0}.planTiles span{color:#475569;font-weight:800}.usageCell{display:grid;gap:8px;min-width:120px}.miniProgress{height:9px}.plan-free{background:#f1f5f9;color:#334155}.plan-basic{background:#dbeafe;color:#1d4ed8}.plan-pro{background:#ede9fe;color:#6d28d9}.plan-enterprise{background:#0f172a;color:#fff}.sub-trial{background:#fef3c7;color:#92400e}.sub-active{background:#dcfce7;color:#166534}.sub-past_due{background:#ffedd5;color:#9a3412}.sub-cancelled,.sub-expired{background:#fee2e2;color:#991b1b}.adminToolbar{margin-top:0}.toolbarGrid{display:grid;grid-template-columns:1fr 220px;gap:18px;align-items:end}.toolbarGrid label{font-weight:900;display:grid;gap:8px}.miniHint{border:1px solid #dbeafe;background:#eff6ff;border-radius:18px;padding:14px 18px;display:grid}.miniHint b{font-size:28px}.miniHint span{color:#64748b;font-weight:800}.compactEmpty{box-shadow:none!important;margin:0!important}@media(max-width:860px){.proHero{align-items:flex-start;flex-direction:column}.toolbarGrid{grid-template-columns:1fr}.progressRow{grid-template-columns:1fr}.progressRow em{text-align:left}.barChart{overflow-x:auto}.barItem{min-width:64px}}


/* v0.6 Beautiful chart dashboard */
.chartGrid{display:grid;grid-template-columns:1.25fr .9fr .9fr;gap:22px;margin:22px 0;align-items:stretch}.lowerCharts{grid-template-columns:.9fr 1.55fr}.chartPanel{background:rgba(255,255,255,.92);border:1px solid var(--border);border-radius:28px;box-shadow:var(--shadow);padding:22px;position:relative;overflow:hidden}.chartPanel:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 88% 8%,rgba(37,99,235,.12),transparent 30%);pointer-events:none}.chartPanel>*{position:relative}.chartPanelWide{min-width:0}.compactHead{margin-bottom:8px}.compactHead h2{font-size:22px;margin-bottom:4px}.compactHead p{margin:0;color:var(--muted)}.chartBadge{display:inline-flex;align-items:center;border-radius:999px;padding:8px 12px;background:#eff6ff;color:#1d4ed8;font-weight:950;font-size:12px}.itkChart{width:100%;display:block;margin-top:12px}.chartPanel canvas{background:linear-gradient(180deg,rgba(248,250,252,.58),rgba(255,255,255,.1));border-radius:20px}.kpiGrid article{transition:transform .18s ease, box-shadow .18s ease}.kpiGrid article:hover,.chartPanel:hover{transform:translateY(-2px);box-shadow:0 22px 60px rgba(15,23,42,.12)}@media(max-width:1180px){.chartGrid,.lowerCharts{grid-template-columns:1fr 1fr}.chartPanelWide{grid-column:1/-1}}@media(max-width:760px){.chartGrid,.lowerCharts{grid-template-columns:1fr}.chartPanelWide{grid-column:auto}.chartPanel{padding:18px;border-radius:22px}.compactHead{align-items:flex-start;flex-direction:column}.dashboardHead h1{font-size:32px}}

/* v0.8 Billing / Pricing */
.billingHero{background:linear-gradient(135deg, rgba(16,24,40,.96), rgba(32,58,92,.92));}
.warnCard{border-left:5px solid #f59e0b;background:linear-gradient(135deg,#fff7ed,#ffffff)}
.warnCard code{background:#111827;color:#fff;padding:.16rem .38rem;border-radius:.38rem}
.pricingGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.1rem;margin:1.2rem 0 2rem}
.priceCard{background:#fff;border:1px solid rgba(15,23,42,.10);border-radius:24px;padding:1.2rem;box-shadow:0 14px 38px rgba(15,23,42,.08);display:flex;flex-direction:column;gap:1rem;position:relative;overflow:hidden}
.priceCard.featuredPrice{border-color:rgba(37,99,235,.35);box-shadow:0 20px 48px rgba(37,99,235,.18);transform:translateY(-4px)}
.priceTop{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.priceCard h2{font-size:1.45rem;margin:.2rem 0;color:#0f172a}
.featureList{list-style:none;padding:0;margin:0;display:grid;gap:.55rem;color:#475569}
.featureList li{padding:.55rem .7rem;background:#f8fafc;border-radius:14px;border:1px solid #e2e8f0}
.btn.full{width:100%;justify-content:center;text-align:center}
button[disabled],.btn[disabled]{opacity:.48;cursor:not-allowed;filter:grayscale(.2)}
@media(max-width:1100px){.pricingGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.pricingGrid{grid-template-columns:1fr}.priceCard.featuredPrice{transform:none}}

/* v26 company registration */
.legalPage { max-width: 980px; margin: 0 auto; padding: 34px 0; }
.legalHero { background: rgba(255,255,255,.92); border: 1px solid #dbeafe; border-radius: 28px; padding: 32px; box-shadow: 0 24px 70px rgba(15,23,42,.08); margin-bottom: 22px; }
.legalHero h1 { margin: 12px 0 8px; font-size: clamp(30px, 4vw, 48px); letter-spacing: -.04em; }
.legalCard { background: #fff; border: 1px solid #dbeafe; border-radius: 24px; padding: 26px; box-shadow: 0 18px 50px rgba(15,23,42,.06); margin-bottom: 18px; }
.legalConsentBox { border: 1px solid #dbeafe; background: #f8fafc; border-radius: 18px; padding: 16px; margin: 14px 0; }
.checkRow { display: flex !important; flex-direction: row !important; align-items: flex-start; gap: 10px; margin: 8px 0; line-height: 1.45; }
.checkRow input[type="checkbox"] { width: 18px; height: 18px; margin-top: 2px; flex: 0 0 auto; }


/* v25 – Legal & GDPR Compliance Pack */
.legalPage {
    max-width: 980px;
    margin: 0 auto;
    padding: 34px 0;
}

/* ITKapocs v40.7.3 - role-based message colors */
.message {
    border-left-color: #64748b;
    background: #f8fafc;
}

.message.messageRoleCustomer {
    border-left-color: #16a34a;
    background: #f0fdf4;
}

.message.messageRoleProvider {
    border-left-color: #2563eb;
    background: #eff6ff;
}

.message.messageRoleTechnician {
    border-left-color: #0891b2;
    background: #ecfeff;
}

.message.messageRoleAdmin {
    border-left-color: #7c3aed;
    background: #f5f3ff;
}

.message.messageRoleSystem {
    border-left-color: #94a3b8;
    background: #f8fafc;
}

.message.mine {
    box-shadow: 0 14px 38px rgba(15, 23, 42, .07);
}

.timelineBody {
    border-left: 5px solid #64748b;
}

.timelineItem.messageRoleCustomer .timelineDot {
    background: #16a34a;
    box-shadow: 0 0 0 5px #dcfce7;
}

.timelineItem.messageRoleCustomer .timelineBody {
    border-left-color: #16a34a;
    background: #f0fdf4;
}

.timelineItem.messageRoleProvider .timelineDot {
    background: #2563eb;
    box-shadow: 0 0 0 5px #dbeafe;
}

.timelineItem.messageRoleProvider .timelineBody {
    border-left-color: #2563eb;
    background: #eff6ff;
}

.timelineItem.messageRoleTechnician .timelineDot {
    background: #0891b2;
    box-shadow: 0 0 0 5px #cffafe;
}

.timelineItem.messageRoleTechnician .timelineBody {
    border-left-color: #0891b2;
    background: #ecfeff;
}

.timelineItem.messageRoleAdmin .timelineDot {
    background: #7c3aed;
    box-shadow: 0 0 0 5px #ede9fe;
}

.timelineItem.messageRoleAdmin .timelineBody {
    border-left-color: #7c3aed;
    background: #f5f3ff;
}

.timelineItem.messageRoleSystem .timelineDot {
    background: #94a3b8;
    box-shadow: 0 0 0 5px #e2e8f0;
}

.timelineItem.messageRoleSystem .timelineBody {
    border-left-color: #94a3b8;
    background: #f8fafc;
}
.legalHero {
    background: rgba(255,255,255,.92);
    border: 1px solid #dbeafe;
    border-radius: 28px;
    padding: 32px;
    box-shadow: 0 24px 70px rgba(15,23,42,.08);
    margin-bottom: 22px;
}
.legalHero h1 {
    margin: 12px 0 8px;
    font-size: clamp(30px, 4vw, 48px);
    letter-spacing: -.04em;
}
.legalCard {
    background: #fff;
    border: 1px solid #dbeafe;
    border-radius: 24px;
    padding: 26px;
    box-shadow: 0 18px 50px rgba(15,23,42,.06);
    margin-bottom: 18px;
}
.legalCard h2 {
    margin-top: 0;
}
.legalCard h3 {
    margin-top: 22px;
}
.legalCard p,
.legalCard li {
    color: #334155;
    line-height: 1.65;
}
.operatorLegalBlock {
    border-color: #bfdbfe;
    background: linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
}
.legalDataGrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 18px 0;
}
.legalDataGrid div {
    display: grid;
    gap: 6px;
    padding: 15px 16px;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    background: #f8fafc;
}
.legalDataGrid span {
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.legalDataGrid strong {
    color: #0f172a;
    overflow-wrap: anywhere;
}
.legalMuted {
    margin-bottom: 0;
    color: #64748b;
    font-size: 14px;
}
.legalMeta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
    margin-top: 16px;
}
.legalMeta div {
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 14px;
    background: #f8fafc;
}
.legalConsentBox {
    border: 1px solid #dbeafe;
    background: #f8fafc;
    border-radius: 18px;
    padding: 16px;
    margin: 14px 0;
}
.lockedPlanCard {
    min-height: 100%;
    display: grid;
    gap: 7px;
    align-content: center;
    border: 1px solid #bfdbfe;
    border-radius: 18px;
    padding: 15px 16px;
    background: linear-gradient(135deg, #eff6ff 0%, #ffffff 58%, #ecfeff 100%);
    box-shadow: 0 14px 34px rgba(37, 99, 235, .08);
}
.lockedPlanCard span {
    color: #2563eb;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.lockedPlanCard strong {
    color: #0f172a;
    font-size: 20px;
    line-height: 1.1;
}
.lockedPlanCard small {
    color: #64748b;
    font-weight: 700;
    line-height: 1.45;
}
.checkRow {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start;
    gap: 10px;
    margin: 8px 0;
    line-height: 1.45;
}
.checkRow input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    flex: 0 0 auto;
}
.smallText {
    font-size: 13px;
}
.footerLinks {
    display: inline-flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-left: 10px;
}
.footerLinks a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 700;
}
@media (max-width: 720px) {
    .legalDataGrid {
        grid-template-columns: 1fr;
    }
    .legalMeta {
        grid-template-columns: 1fr;
    }
    .footerLinks {
        display: flex;
        justify-content: center;
        margin: 10px 0 0 0;
    }
}

@media (max-width: 720px) {
    .tableCard table.ticketCardTable {
        min-width: 0;
    }

    .tableCard table.ticketCardTable thead {
        display: none;
    }

    .tableCard table.ticketCardTable,
    .tableCard table.ticketCardTable tbody,
    .tableCard table.ticketCardTable tr,
    .tableCard table.ticketCardTable td {
        display: block;
        width: 100%;
    }

    .tableCard table.ticketCardTable tbody {
        display: grid;
        gap: 14px;
    }

    .tableCard table.ticketCardTable tr {
        padding: 16px;
        border: 1px solid #dbe5f1;
        border-radius: 20px;
        background: linear-gradient(180deg, #fff, #f8fbff);
        box-shadow: 0 16px 42px rgba(15, 23, 42, .08);
    }

    .tableCard table.ticketCardTable td {
        display: grid;
        grid-template-columns: minmax(110px, .42fr) minmax(0, 1fr);
        gap: 12px;
        align-items: start;
        border: none;
        border-bottom: 1px solid #eef2f7;
        padding: 11px 0;
    }

    .tableCard table.ticketCardTable td::before {
        content: attr(data-label);
        color: #64748b;
        font-size: 12px;
        font-weight: 900;
        line-height: 1.3;
        text-transform: uppercase;
    }

    .tableCard table.ticketCardTable td:last-child {
        border-bottom: 0;
        padding-bottom: 0;
    }

    .tableCard table.ticketCardTable td:last-child .btn {
        width: 100%;
        min-height: 44px;
    }
}

/* ITKapocs v40.7.5 - searchable settlement picker */
.cityCombo {
    position: relative;
    width: 100%;
}

.cityComboInput {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
    color: #0f172a;
    font: inherit;
    font-size: 16px;
    font-weight: 850;
    line-height: 1.35;
    outline: none;
    min-height: 58px;
    padding: 15px 46px 15px 16px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .04);
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.cityCombo::after {
    content: "";
    position: absolute;
    right: 18px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-right: 2px solid #64748b;
    border-bottom: 2px solid #64748b;
    transform: translateY(-65%) rotate(45deg);
    pointer-events: none;
}

.cityComboInput:focus {
    border-color: #93c5fd;
    box-shadow: 0 0 0 4px rgba(147, 197, 253, .28);
}

.cityComboList {
    position: absolute;
    z-index: 30;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    display: grid;
    gap: 4px;
    max-height: 276px;
    overflow: auto;
    padding: 10px;
    border: 1px solid #dbeafe;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .16);
}

.cityComboList[hidden] {
    display: none !important;
}

.cityComboOption,
.cityComboEmpty {
    width: 100%;
    border: 0;
    border-radius: 12px;
    padding: 12px 14px;
    background: #fff;
    color: #0f172a;
    font-family: inherit;
    font-size: 15px;
    font-weight: 850;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    transition: background .14s ease, color .14s ease, transform .14s ease;
}

.cityComboOption:hover,
.cityComboOption:focus {
    background: #eff6ff;
    color: #1d4ed8;
    transform: translateX(2px);
}

.cityComboEmpty {
    color: #64748b;
    cursor: default;
}

.cityNativeSelect {
    position: fixed !important;
    width: 1px !important;
    height: 1px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    margin: 0 !important;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
}

.countyPicker {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 14px 0 18px;
}

.citySearchField {
    display: grid !important;
    gap: 9px;
    margin: 16px 0 10px;
    color: #334155;
    font-weight: 900;
}

.citySearchField span {
    color: #64748b;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.citySearchField input {
    min-height: 54px;
    border: 1px solid #dbeafe;
    border-radius: 18px;
    background: #fff;
    padding: 0 18px;
    color: #0f172a;
    font: inherit;
    font-weight: 850;
    outline: none;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .06);
}

.citySearchField input:focus {
    border-color: #60a5fa;
    box-shadow: 0 0 0 5px rgba(96, 165, 250, .18), 0 18px 42px rgba(15, 23, 42, .08);
}

.countyPill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #dbeafe;
    border-radius: 999px;
    background: #fff;
    color: #0f172a;
    padding: 9px 12px;
    font: inherit;
    font-size: 13px;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .05);
    transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}

.countyPill small {
    color: #64748b;
    font-size: 11px;
    font-weight: 850;
}

.countyPill:hover,
.countyPill.isPartial {
    border-color: #93c5fd;
    background: #eff6ff;
    color: #1d4ed8;
    transform: translateY(-1px);
}

.countyPill.isChecked {
    border-color: #2563eb;
    background: #2563eb;
    color: #fff;
}

.countyPill.isChecked small {
    color: #dbeafe;
}

.cityBulkActions {
    flex-wrap: wrap;
    margin: 8px 0 16px;
}

.cityHidden {
    display: none !important;
}

.cityCheck:has(input:checked) {
    border-color: #2563eb;
    background: #eff6ff;
}

.itkCityCard small,
.cityCheck small {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 11px;
    font-weight: 800;
}

.cityCounter {
    border: 1px solid #dbeafe;
    border-radius: 16px;
    background: #f8fbff;
    padding: 11px 13px;
    font-weight: 850;
}

.searchBox .cityCombo {
    flex: 1 1 420px;
    min-width: min(100%, 280px);
}

@media (max-width: 860px) {
    .searchBox .cityCombo {
        flex: 0 0 auto;
        width: 100%;
        min-width: 0;
    }

    .searchBox > button,
    .searchBox > .btn {
        width: 100%;
        justify-content: center;
    }
}

.searchBox > button,
.searchBox > .btn {
    min-height: 58px;
    border: 0;
    border-radius: 16px;
    padding: 0 24px;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: #fff;
    font: inherit;
    font-size: 15px;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 16px 36px rgba(37, 99, 235, .24);
    white-space: nowrap;
}

@media (max-width: 720px) {
    .countyPicker {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding: 2px 2px 10px;
        scroll-snap-type: x proximity;
    }

    .countyPill {
        flex: 0 0 auto;
        scroll-snap-align: start;
        border-radius: 16px;
        padding: 11px 13px;
    }

    .countyPill span,
    .countyPill small {
        white-space: nowrap;
    }

    .citySearchField {
        margin-top: 14px;
    }

    .citySearchField input {
        min-height: 58px;
        border-radius: 19px;
        font-size: 16px;
    }

    .cityCheck {
        border-radius: 20px;
        padding: 15px;
        box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
    }
}

.searchBox > button:hover,
.searchBox > .btn:hover {
    filter: brightness(1.03);
}

@media (max-width: 720px) {
    .searchBox {
        gap: 14px;
    }

    .searchBox .cityCombo {
        flex: 0 0 auto;
        min-width: 0;
        width: 100%;
    }

    .cityComboInput,
    .searchBox > button,
    .searchBox > .btn {
        min-height: 54px;
    }

    .cityComboInput {
        border-radius: 18px;
        padding: 14px 44px 14px 16px;
        box-shadow: 0 14px 34px rgba(15, 23, 42, .07);
    }

    .cityCombo::after {
        right: 18px;
    }

    .cityComboList {
        top: calc(100% + 10px);
        max-height: min(320px, 48vh);
        padding: 8px;
        border-radius: 22px;
        box-shadow: 0 24px 58px rgba(15, 23, 42, .18);
    }

    .cityComboOption,
    .cityComboEmpty {
        padding: 13px 14px;
        border-radius: 15px;
        font-size: 15px;
        line-height: 1.25;
    }
}

/* ITKapocs v40.7.7 - smart technician recommendation */
.recommendationPanel,
.technicianAssignPanel {
    margin-top: 22px;
    border: 1px solid #dbeafe;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .08);
    padding: 24px;
}

.recommendationPanel {
    position: relative;
    overflow: hidden;
}

.recommendationPanel::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 92% 0%, rgba(37, 99, 235, .13), transparent 32%);
    pointer-events: none;
}

.recommendationPanel > *,
.technicianAssignPanel > * {
    position: relative;
}

.recommendationHeader {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.recommendationEyebrow {
    display: inline-flex;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    padding: 7px 12px;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.recommendationHeader h2,
.technicianAssignPanel h2 {
    margin: 10px 0 6px;
    color: #0f172a;
    font-size: clamp(26px, 3vw, 34px);
    line-height: 1.1;
    letter-spacing: -.03em;
}

.recommendationHeader p,
.technicianAssignPanel p {
    margin: 0;
    color: #64748b;
    line-height: 1.55;
}

.recommendationScore {
    min-width: 130px;
    min-height: 130px;
    border-radius: 32px;
    display: grid;
    place-items: center;
    text-align: center;
    color: #fff;
    background: linear-gradient(135deg, #172554, #2563eb);
    box-shadow: 0 20px 48px rgba(37, 99, 235, .22);
}

.recommendationScore strong {
    display: block;
    font-size: 42px;
    line-height: 1;
    letter-spacing: -.04em;
}

.recommendationScore span {
    display: block;
    margin-top: 6px;
    color: #dbeafe;
    font-weight: 900;
    font-size: 13px;
}

.recommendationBest {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    border: 1px solid #bfdbfe;
    border-radius: 24px;
    background: linear-gradient(180deg, #f8fbff, #fff);
    padding: 18px;
}

.recommendationBest.load-warning {
    border-color: #fde68a;
    background: linear-gradient(180deg, #fffbeb, #fff);
}

.recommendationBest.load-danger {
    border-color: #fecaca;
    background: linear-gradient(180deg, #fef2f2, #fff);
}

.recommendationAvatar {
    width: 62px;
    height: 62px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 28px;
    font-weight: 950;
}

.recommendationContent h3 {
    margin: 0;
    color: #0f172a;
    font-size: 23px;
    letter-spacing: -.02em;
}

.recommendationContent p {
    margin: 6px 0 0;
    color: #64748b;
}

.recommendationMeta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0;
}

.recommendationMeta span {
    border: 1px solid #dbeafe;
    border-radius: 999px;
    background: #fff;
    color: #334155;
    padding: 7px 10px;
    font-size: 13px;
    font-weight: 900;
}

.recommendationContent ul {
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 7px;
}

.recommendationContent li {
    position: relative;
    padding-left: 20px;
    color: #475569;
    line-height: 1.4;
}

.recommendationContent li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .58em;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #22c55e;
}

.recommendationAssignForm {
    display: flex;
    justify-content: flex-end;
}

.recommendationBtn {
    min-height: 48px;
    white-space: nowrap;
}

.recommendationRankList {
    margin-top: 20px;
    display: grid;
    gap: 10px;
}

.recommendationRankList h3 {
    margin: 0 0 4px;
    color: #0f172a;
    font-size: 18px;
}

.recommendationRankItem {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 96px minmax(180px, 1.2fr);
    align-items: center;
    gap: 12px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #fff;
    padding: 13px 14px;
}

.recommendationRankItem.load-warning {
    background: #fffbeb;
}

.recommendationRankItem.load-danger {
    background: #fef2f2;
}

.recommendationRankItem strong {
    color: #0f172a;
}

.recommendationRankItem span {
    justify-self: start;
    border-radius: 999px;
    background: #eff6ff;
    color: #1d4ed8;
    padding: 7px 10px;
    font-weight: 950;
}

.recommendationRankItem small {
    color: #64748b;
    font-weight: 800;
}

.technicianAssignPanel {
    background: linear-gradient(180deg, #fff, #f8fbff);
}

.technicianAssignForm {
    display: grid;
    gap: 14px;
    max-width: 640px;
    margin-top: 18px;
}

.technicianAssignForm label {
    display: grid;
    gap: 7px;
    color: #334155;
    font-weight: 900;
}

.technicianAssignForm select,
.technicianAssignForm input {
    width: 100%;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    background: #fff;
    color: #0f172a;
    padding: 13px 14px;
    font: inherit;
    outline: none;
}

.technicianAssignForm select:focus,
.technicianAssignForm input:focus {
    border-color: #93c5fd;
    box-shadow: 0 0 0 4px rgba(147, 197, 253, .28);
}

@media (max-width: 900px) {
    .recommendationHeader,
    .recommendationBest {
        grid-template-columns: 1fr;
    }

    .recommendationHeader {
        flex-direction: column;
    }

    .recommendationScore {
        width: 100%;
        min-height: 104px;
    }

    .recommendationAssignForm,
    .recommendationBtn {
        width: 100%;
        justify-content: center;
    }

    .recommendationRankItem {
        grid-template-columns: 1fr;
    }
}

/* ITKapocs v40.7.10 - global priority colors */
.badge.priority-low,
.badge.prio-low,
.prio-low {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.badge.priority-normal,
.badge.prio-normal,
.prio-normal {
    background: #dbeafe;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
}

.badge.priority-high,
.badge.prio-high,
.prio-high {
    background: #ffedd5;
    color: #c2410c;
    border: 1px solid #fed7aa;
}

.badge.priority-urgent,
.badge.prio-urgent,
.prio-urgent {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

.badge.priority-critical,
.badge.prio-critical,
.prio-critical {
    background: linear-gradient(135deg, #7f1d1d, #dc2626);
    color: #fff;
    border: 1px solid #991b1b;
    box-shadow: 0 10px 24px rgba(220, 38, 38, .22);
}

/* ITKapocs v40.7.12 - global ticket status colors */
.badge.status-new,
.statusBadge.status-new {
    background: #dbeafe;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
}

.badge.status-in_progress,
.statusBadge.status-in_progress {
    background: #ede9fe;
    color: #7c3aed;
    border: 1px solid #ddd6fe;
}

.badge.status-waiting_customer,
.badge.status-open,
.statusBadge.status-waiting_customer,
.statusBadge.status-open {
    background: #fef3c7;
    color: #b45309;
    border: 1px solid #fde68a;
}

.badge.status-solved,
.badge.status-resolved,
.badge.status-approved,
.statusBadge.status-solved,
.statusBadge.status-resolved,
.statusBadge.status-approved {
    background: #dcfce7;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.badge.status-closed,
.statusBadge.status-closed,
.badge.status-other,
.statusBadge.status-other {
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
}

.badge.status-rejected,
.badge.status-blocked,
.statusBadge.status-rejected,
.statusBadge.status-blocked {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

.companySwitcher {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #eef7ff;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    padding: 5px 6px 5px 12px;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .08);
}

.companySwitcher label {
    color: #075985;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.companySwitcher select {
    max-width: 260px;
    border: 0;
    background: #fff;
    color: #0f172a;
    border-radius: 999px;
    padding: 9px 34px 9px 13px;
    font: inherit;
    font-weight: 850;
    outline: none;
    box-shadow: inset 0 0 0 1px #dbeafe;
}

.companySwitcher select:focus {
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .16), inset 0 0 0 1px #60a5fa;
}

.companySwitcher select:disabled {
    opacity: 1;
    color: #075985;
    cursor: default;
    background: #fff;
}

@media (max-width: 860px) {
    .companySwitcher {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
        border-radius: 18px;
        padding: 10px;
    }

    .companySwitcher label {
        padding-left: 4px;
    }

    .companySwitcher select {
        width: 100%;
        max-width: none;
        border-radius: 14px;
    }
}
