@layer editor{
/* Edytor składnika (_component_edit_form.html) — wyniesione z inline <style> (CSP-safe, PR #257).
   Kompaktowy, kolorowy, responsywny (auto-fit), opisy pól pod „?" (czysto CSS: hover + focus). */


.ce-form{--ce-line:#dbe2ec;--ce-fl:#a4b6d4;--ce-field:#fff;--ce-ink:#1d2431;--ce-muted:#5f6a7a;--ce-faint:#93a0b2;--ce-accent:#2563eb;--ce-aink:#1d4ed8;--ce-a2:#0d9488;--ce-a2ink:#0f766e;--ce-soft:#e6eeff;--ce-danger:#dc2626;--ce-pA:linear-gradient(180deg,#f3f7ff,#fbfcff);--ce-pB:linear-gradient(180deg,#f1faf8,#fbfefd);font-size:12.5px;color:var(--ce-ink);}


@media (prefers-color-scheme:dark){.ce-form{--ce-line:#242d3c;--ce-fl:#404e69;--ce-field:#0b1220;--ce-ink:#e8ecf4;--ce-muted:#98a3b4;--ce-faint:#5f6a7c;--ce-accent:#5b8cff;--ce-aink:#8fb2ff;--ce-a2:#2dd4bf;--ce-a2ink:#5eead4;--ce-soft:#182338;--ce-danger:#f87171;--ce-pA:linear-gradient(180deg,#16243d,#141a26);--ce-pB:linear-gradient(180deg,#123030,#141f22);}}


.ce-form *{box-sizing:border-box;}


.ce-panel{border:1px solid var(--ce-line);border-left:3px solid var(--ce-edge);border-radius:9px;padding:11px 13px;margin-bottom:12px;background:var(--ce-pbg);}


.ce-panel.ce-a{--ce-edge:var(--ce-accent);--ce-pbg:var(--ce-pA);}


.ce-panel.ce-b{--ce-edge:var(--ce-a2);--ce-pbg:var(--ce-pB);}


.ce-grp{display:flex;align-items:center;gap:7px;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;margin:0 0 9px;}


.ce-panel.ce-a .ce-grp{color:var(--ce-aink);}

.ce-panel.ce-b .ce-grp{color:var(--ce-a2ink);}


.ce-grp::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ce-edge);}


.ce-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(152px,1fr));gap:9px 12px;align-items:end;}


.ce-s2{grid-column:span 2;}
.ce-sall{grid-column:1/-1;}


@media(max-width:430px){.ce-s2{grid-column:1/-1;}}


.ce-f{display:flex;flex-direction:column;gap:3px;min-width:0;}


.ce-f>span{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--ce-muted);}


.ce-rq{color:var(--ce-danger);font-weight:800;}


.ce-ctl{appearance:none;width:100%;background:var(--ce-field);color:var(--ce-ink);border:1.5px solid var(--ce-fl);border-radius:7px;padding:7px 9px;font:inherit;font-size:12.5px;transition:border-color .12s,box-shadow .12s;}


.ce-ctl::placeholder{color:var(--ce-faint);}


.ce-ctl:hover{border-color:color-mix(in srgb,var(--ce-accent) 45%,var(--ce-fl));}


.ce-ctl:focus{outline:none;border-color:var(--ce-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--ce-accent) 22%,transparent);}


.ce-ctl:disabled{opacity:.55;}


.ce-sfx{position:relative;}
.ce-sfx .ce-ctl{padding-right:28px;}
.ce-sfx em{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:11px;color:var(--ce-aink);font-style:normal;font-weight:700;}


.ce-chips{display:flex;flex-wrap:wrap;gap:6px;}


.ce-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border:1.5px solid var(--ce-fl);border-radius:999px;font-size:11.5px;cursor:pointer;background:var(--ce-field);color:var(--ce-muted);}


.ce-tog{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--ce-ink);}


.ce-togwrap{display:flex;align-items:center;height:35px;}


.ce-help{position:relative;display:inline-flex;}


.ce-hb{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--ce-fl);background:var(--ce-field);color:var(--ce-muted);font-size:9px;font-weight:800;line-height:1;display:grid;place-items:center;cursor:help;padding:0;flex:none;}


.ce-hb:hover, .ce-hb:focus-visible{border-color:var(--ce-accent);color:var(--ce-accent);outline:none;}


.ce-ht{position:absolute;z-index:40;left:0;top:calc(100% + 6px);width:232px;max-width:80vw;background:var(--ce-ink);color:var(--ce-field);font-size:11.5px;font-weight:400;line-height:1.42;padding:8px 10px;border-radius:8px;box-shadow:0 10px 26px rgba(0,0,0,.32);opacity:0;visibility:hidden;transition:opacity .12s;pointer-events:none;white-space:normal;text-transform:none;letter-spacing:0;}


.ce-ht b{color:#fff;}


.ce-help:hover .ce-ht, .ce-hb:focus-visible + .ce-ht{opacity:1;visibility:visible;pointer-events:auto;}


.ce-actions{display:flex;justify-content:flex-end;margin-top:2px;}



/* 2026-08-08 FIX: przebicie globalnego `.app-shell-unified-v211 label{display:block(dawniej: nadpisanie);
   margin(dawniej: nadpisanie); font-weight:900(dawniej: nadpisanie)}więc bez tego robią się wielkie bloki.
   Siła .ce-form label.ce-X (0,2,1) > .app-shell label (0,1,1) + (dawniej: nadpisanie). */


.ce-form label.ce-chip{align-items:center;}




.ce-form label.ce-tog{align-items:center;}














}

/* POZA @layer editor — bezwarstwowe reguły biją każdą warstwę (niezależnie od
   specyficzności). Globalny shell `.app-shell-unified-v211 input,select`
   (app.css warstwa z_top: min-height:42px; padding:10px 12px oraz
   app-unified-v607.css warstwa c07: min-height:42px) rozdymał kompaktowe pola
   edytora składnika. Tu przywracamy zamierzoną, niższą wysokość pól .ce-ctl. */
.ce-ctl{min-height:0;padding:7px 9px;}
textarea.ce-ctl{min-height:52px;}
