/*
 * Лазерно рязане и гравиране, приложението на laserfactory: стилът на страницата и на водача (вълна izrabotka, 14.10.2026), върху общия вид
 * efv4.css и по езика на printirane-app.css (правоъгълни бутони с малък ъгъл, цели за пръст поне 44 px, видим фокус, без хапчета).
 * Първо за телефон (390 px): основните правила са без медия, по-широкото идва с min-width. Всичко е под .efv4.lz3 (единственото извън него е
 * нулирането на полето на body). Класовете на водача, който се рисува в #eflz-app от assets/js/lazer-app.js, са с представка .eflz-:
 *   .eflz-vhod (избор на вход: рязане, гравиране, без файл; бутони в .eflz-vhod-red), .eflz-panel (панел на входа),
 *   .eflz-drop (зона за качване), .eflz-merki (таблица с мерките), .eflz-prisada-ok|vnimanie|ne|pregled (оценка на една проверка),
 *   .eflz-predmet (преглед на контура с svg), .eflz-btn (бутон), .eflz-forma (запитването), .eflz-pole (поле), .eflz-greshka, .eflz-gotovo.
 * Цветът не е единственото различие: всяка оценка носи и знак пред текста (рамка, не емоджи) и текста си от приложението.
 */
html,body{margin:0;background:#ECEEF1}
.efv4.lz3 *,.efv4.lz3 *::before,.efv4.lz3 *::after{box-sizing:border-box}
.efv4.lz3 [hidden]{display:none !important}
.efv4.lz3 :where(b,strong){font-weight:600}
.efv4.lz3 img{max-width:100%;height:auto}
.efv4.lz3 section{scroll-margin-top:24px}
.efv4.lz3 :is(p,li,td,small,dd) a:not(.eflz-btn){color:var(--te2);text-decoration:underline;text-underline-offset:3px}
.efv4.lz3 :is(p,li,td,small,dd) a:not(.eflz-btn):hover{color:var(--sv-silen)}

/* ---------- страницата: глава ---------- */
.efv4.lz3 header.top img{display:block;width:154px;height:auto}
.efv4.lz3 .ezik{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:44px;padding:0 12px;border:1px solid var(--ln2);border-radius:6px;color:var(--tx);font-weight:600;text-decoration:none}
.efv4.lz3 .ezik:hover{border-color:var(--te2)}
/* CADslice (cadslice.com): логото А2 е със собствена пропорция (503,5 на 188,85), затова се задава височината, а не ширината от 154 px; max-width:none, защото общото правило (max-width:100%) стеснява картинката с отрицателното поле.
   Височината и полето са като на живата страница на CADslice (prototip.css): при 32 px надписът „инкубатор на бъдещето“ не се чете, 56 px (на телефон 46 px) е 149 px широчина.
   Файлът носи чисто поле (37,25 от 188,85 единици): отрицателното поле връща буквата C на ръба на съдържанието */
.efv4.lz3.cadslice header.top img{height:56px;width:auto;max-width:none;margin-left:-11px}
@media (max-width:639px){
  .efv4.lz3.cadslice header.top img{height:46px;margin-left:-9px}
}
/* „CADslice е част от EduFacturing“: свой малък ред под адреса и връзките, приглушен като тях */
.efv4.lz3 .chast-ot{flex:0 0 100%;margin:0;font-size:14px}

/* ---------- първи екран: водачът е самото съдържание ---------- */
.efv4.lz3 .hero{min-height:0;align-items:flex-start;padding:20px 0 36px}
.efv4.lz3 .hero .w{display:flex;flex-direction:column;gap:20px}
.efv4.lz3 .hero h1{font-size:clamp(26px,6.6vw,42px);line-height:1.14}
.efv4.lz3 .card{padding:16px;background:var(--sv-karta);border:1px solid var(--ln);border-radius:8px;-webkit-backdrop-filter:none;backdrop-filter:none;min-width:0}
.efv4.lz3 #eflz-app{min-width:0}
/* Само на тесен екран: картата #vodach расте от 54 px до целия екран, когато JS напълни #eflz-app, и избутва h1 и въведението (CLS ~0.8). Резервираме височината предварително. */
@media (max-width:639px){
  .efv4.lz3 #vodach{min-height:100vh;min-height:100svh}
  /* efv4.css: h1 е order:1, а картата без order излизаше преди него (заглавието на 1790 px); intro е display:contents */
  .efv4.lz3 .hero .sv-kak{order:2;align-self:flex-start;margin-bottom:12px}
  .efv4.lz3 .hero .card{order:3}
}

/* ---------- разделите под водача ---------- */
.efv4.lz3 footer.end{padding:32px 0 40px;color:var(--mu);font-size:15px}
.efv4.lz3 footer.end .w{display:flex;flex-direction:column;gap:6px}

/* ---------- бутони ---------- */
.efv4.lz3 .eflz-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border:1px solid transparent;border-radius:6px;background:var(--or);color:#1a0f05;font:600 16px/1.2 Nunito,system-ui,sans-serif;text-align:center;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s}
.efv4.lz3 .eflz-btn:hover{background:#FF8A47}
.efv4.lz3 .eflz-btn:active{transform:translateY(1px)}
.efv4.lz3 .eflz-btn--ghost{background:var(--s2);color:var(--tx);border-color:var(--ln2)}
.efv4.lz3 .eflz-btn--ghost:hover{background:var(--s2);border-color:var(--te2);color:var(--tx)}
.efv4.lz3 .eflz-btn[disabled],.efv4.lz3 .eflz-btn[aria-disabled="true"]{background:#E4E7EB;color:var(--mu);border-color:var(--ln2);cursor:not-allowed}
.efv4.lz3 .eflz-btn:focus-visible,.efv4.lz3 .eflz-vhod button:focus-visible,.efv4.lz3 .eflz-drop:focus-visible,.efv4.lz3 .eflz-drop:focus-within{outline:2px solid var(--te2);outline-offset:3px}
.efv4.lz3 .eflz-akcii{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.efv4.lz3 .eflz-akcii .eflz-btn{width:100%}

/* ---------- избор на вход ---------- */
.efv4.lz3 .eflz-vhod{margin:0 0 4px}
.efv4.lz3 .eflz-vhod-red{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;margin:0;padding:0;list-style:none}
.efv4.lz3 .eflz-vhod button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;min-height:56px;padding:9px 12px;border:1px solid var(--ln2);border-bottom-width:3px;border-radius:6px 6px 0 0;background:var(--s2);color:var(--sv-tekst);font:600 15px/1.25 Nunito,system-ui,sans-serif;text-align:left;cursor:pointer}
.efv4.lz3 .eflz-vhod button small{color:var(--mu);font-size:13px;font-weight:400;line-height:1.35}
.efv4.lz3 .eflz-vhod button:hover{border-color:var(--te2)}
.efv4.lz3 .eflz-vhod button[aria-selected="true"]{border-color:var(--ln2);border-bottom-color:var(--or);background:var(--sv-izbran);color:var(--tx)}
.efv4.lz3 .eflz-panel{margin-top:6px;padding-top:18px;border-top:1px solid var(--ln)}
.efv4.lz3 .eflz-panel > :first-child{margin-top:0}
.efv4.lz3 .eflz-panel h2,.efv4.lz3 .eflz-panel h3{margin:0 0 12px;font-size:20px;line-height:1.25}
.efv4.lz3 .eflz-bel{margin:8px 0 0;color:var(--mu);font-size:14px;line-height:1.5}

/* ---------- качване ---------- */
.efv4.lz3 .eflz-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:140px;padding:18px 14px;border:2px dashed var(--te2);border-radius:6px;background:rgba(11,111,134,.05);text-align:center;cursor:pointer;transition:background .15s,border-color .15s}
.efv4.lz3 .eflz-drop:hover,.efv4.lz3 .eflz-drop.eflz-nad{border-style:solid;border-color:var(--tx);background:rgba(11,111,134,.1)}
.efv4.lz3 .eflz-drop b{color:var(--tx);font-size:18px;line-height:1.35}
.efv4.lz3 .eflz-drop small{color:var(--mu);font-size:14px;line-height:1.45}
.efv4.lz3 .eflz-drop-ime{max-width:100%;overflow-wrap:anywhere}
.efv4.lz3 .eflz-lenta{height:8px;margin-top:12px;border-radius:3px;background:var(--ln2);overflow:hidden}
.efv4.lz3 .eflz-lenta i{display:block;height:100%;width:0;background:var(--te2);transition:width .2s}

/* ---------- мерките и проверките ---------- */
.efv4.lz3 .eflz-merki-obvivka{max-width:100%;margin-top:12px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.efv4.lz3 .eflz-merki{width:100%;min-width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:15px}
.efv4.lz3 .eflz-merki th,.efv4.lz3 .eflz-merki td{padding:8px 10px;border-bottom:1px solid var(--ln);text-align:left;vertical-align:middle}
.efv4.lz3 .eflz-merki thead th{color:var(--mu);font-size:14px;font-weight:600;border-bottom-color:var(--ln2)}
.efv4.lz3 .eflz-merki tbody th{color:var(--tx);font-weight:600}
.efv4.lz3 .eflz-merki td.n{text-align:right;white-space:nowrap}
.efv4.lz3 .eflz-merki-obvivka:focus-visible{outline:2px solid var(--te2);outline-offset:3px}
.efv4.lz3 .eflz-prisada-ok,.efv4.lz3 .eflz-prisada-vnimanie,.efv4.lz3 .eflz-prisada-ne,.efv4.lz3 .eflz-prisada-pregled{position:relative;margin:10px 0 0;padding:8px 12px 8px 34px;border:1px solid var(--ln2);border-left-width:3px;border-radius:0 6px 6px 0;color:var(--sv-tekst);font-size:15px;line-height:1.5}
.efv4.lz3 .eflz-prisada-ok::before,.efv4.lz3 .eflz-prisada-vnimanie::before,.efv4.lz3 .eflz-prisada-ne::before,.efv4.lz3 .eflz-prisada-pregled::before{content:"";position:absolute;left:11px;top:13px;width:12px;height:12px;border:2px solid currentColor}
.efv4.lz3 .eflz-prisada-ok{border-left-color:var(--te2);background:rgba(11,111,134,.07);color:var(--sv-tekst2)}
.efv4.lz3 .eflz-prisada-ok::before{border-radius:50%}
.efv4.lz3 .eflz-prisada-vnimanie{border-left-color:var(--or);background:rgba(242,106,27,.08);color:var(--sv-tekst2)}
.efv4.lz3 .eflz-prisada-vnimanie::before{border-radius:0;transform:rotate(45deg) scale(.9)}
.efv4.lz3 .eflz-prisada-ne{border-left-color:var(--sv-greshka,#C2311A);background:rgba(194,49,26,.07);color:var(--sv-greshka-t)}
.efv4.lz3 .eflz-prisada-ne::before{border-radius:0;background:currentColor}
.efv4.lz3 .eflz-prisada-pregled{border-left-color:var(--mu);background:var(--s2);color:var(--sv-tekst)}
.efv4.lz3 .eflz-prisada-pregled::before{border-radius:50%;border-style:dotted}

/* ---------- преглед на контура ---------- */
.efv4.lz3 .eflz-predmet{margin:12px 0 0;border:1px solid var(--ln);border-radius:6px;background:var(--s1);overflow:hidden}
.efv4.lz3 .eflz-predmet svg{display:block;width:100%;height:auto;max-height:320px}
.efv4.lz3 .eflz-predmet figcaption,.efv4.lz3 .eflz-predmet .eflz-bel{margin:0;padding:8px 12px;border-top:1px solid var(--ln)}
.efv4.lz3 .eflz-predmet img{display:block;width:100%;height:auto;max-height:320px;object-fit:contain}

/* ---------- запитването ---------- */
.efv4.lz3 .eflz-forma{margin:18px 0 0}
.efv4.lz3 .eflz-pole{margin:14px 0 0;min-width:0}
.efv4.lz3 .eflz-pole label,.efv4.lz3 .eflz-pole legend{display:block;margin:0 0 6px;padding:0;color:var(--tx);font-size:15px;font-weight:600}
.efv4.lz3 .eflz-pole input:not([type="checkbox"]),.efv4.lz3 .eflz-pole select,.efv4.lz3 .eflz-pole textarea{display:block;width:100%;min-height:48px;padding:0 12px;border:1px solid var(--ln2);border-radius:6px;background:var(--s1);color:var(--tx);font:400 16px/1.4 Nunito,system-ui,sans-serif}
.efv4.lz3 .eflz-pole textarea{min-height:96px;padding:10px 12px;resize:vertical}
.efv4.lz3 .eflz-pole input:hover,.efv4.lz3 .eflz-pole select:hover,.efv4.lz3 .eflz-pole textarea:hover{border-color:var(--te2)}
.efv4.lz3 .eflz-pole [aria-invalid="true"]{border-color:var(--sv-greshka,#C2311A)}
.efv4.lz3 .eflz-pole input::placeholder,.efv4.lz3 .eflz-pole textarea::placeholder{color:var(--mu)}
.efv4.lz3 .eflz-pole small{display:block;margin-top:4px;color:var(--mu);font-size:13px;line-height:1.4}
.efv4.lz3 .eflz-pole--saglasie{display:flex;align-items:flex-start;gap:12px;min-height:44px;color:var(--sv-tekst);font-size:15px;line-height:1.5}
.efv4.lz3 .eflz-pole--saglasie input{flex:none;width:24px;height:24px;margin:10px 0 0;accent-color:var(--or)}
.efv4.lz3 .eflz-pole--saglasie label{flex:1 1 auto;margin:0;padding:10px 0;font-weight:400}
.efv4.lz3 .eflz-greshka{margin:12px 0 0;padding:10px 14px;border-left:3px solid var(--sv-greshka,#C2311A);background:rgba(194,49,26,.07);color:var(--sv-greshka-t);font-size:15px;line-height:1.5}
.efv4.lz3 .eflz-greshka p{margin:0}
.efv4.lz3 .eflz-greshka p + p{margin-top:6px}
.efv4.lz3 .eflz-gotovo{margin:12px 0 0;padding:12px 14px;border-left:3px solid var(--te2);background:rgba(11,111,134,.07);color:var(--sv-tekst);font-size:16px;line-height:1.5}
.efv4.lz3 .eflz-gotovo h2,.efv4.lz3 .eflz-gotovo h3{margin:0 0 6px;font-size:19px}
.efv4.lz3 .eflz-gotovo p{margin:0}
.efv4.lz3 .eflz-gotovo p + p{margin-top:6px}

@media (min-width:640px){
  .efv4.lz3 .hero{padding:clamp(24px,3vw,48px) 0 clamp(36px,4vw,60px)}
  .efv4.lz3 .card{padding:clamp(16px,2vw,26px)}
  .efv4.lz3 .eflz-vhod-red{grid-template-columns:repeat(3,minmax(0,1fr))}
  .efv4.lz3 .eflz-akcii{flex-direction:row;flex-wrap:wrap}
  .efv4.lz3 .eflz-akcii .eflz-btn{width:auto;min-width:11em}
  .efv4.lz3 footer.end .w{flex-direction:row;justify-content:space-between;flex-wrap:wrap}
}
@media (min-width:1100px){
  .efv4.lz3 .hero .w{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);align-items:start;gap:clamp(28px,4vw,72px)}
  .efv4.lz3 .hero h1{font-size:clamp(28px,3vw,42px)}
  .efv4.lz3 .eflz-forma .eflz-pole--dve{display:inline-block;width:calc(50% - 8px)}
}
@media (prefers-reduced-motion:reduce){
  .efv4.lz3 *,.efv4.lz3 *::before,.efv4.lz3 *::after{transition:none !important;animation:none !important}
}

/* ---------- по DOM-а, който lazer-app.js наистина строи (14.10.2026) ---------- */
/* табове: .eflz-vhod е самият tablist, бутоните са му деца с role=tab, избраният има aria-selected=true и клас is-active */
.efv4.lz3 .eflz-vhod[role="tablist"]{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}
.efv4.lz3 .eflz-vhod[role="tablist"] > button{display:flex;align-items:center;width:100%;min-height:48px;padding:9px 12px;border:1px solid var(--ln2);border-bottom-width:3px;border-radius:6px 6px 0 0;background:var(--s2);color:var(--sv-tekst);font:600 15px/1.25 Nunito,system-ui,sans-serif;text-align:left;cursor:pointer}
.efv4.lz3 .eflz-vhod[role="tablist"] > button:hover{border-color:var(--te2)}
.efv4.lz3 .eflz-vhod[role="tablist"] > button.is-active,.efv4.lz3 .eflz-vhod[role="tablist"] > button[aria-selected="true"]{border-color:var(--ln2);border-bottom-color:var(--or);background:var(--sv-izbran);color:var(--tx)}
.efv4.lz3 .eflz-panel[hidden],.efv4.lz3 .eflz-forma[hidden],.efv4.lz3 .eflz-gotovo[hidden],.efv4.lz3 .eflz-greshka[hidden],.efv4.lz3 [data-skrii-pri][hidden]{display:none !important}
/* полета: label, поле, подсказка, грешка; number, select, textarea (файлът е в зоната .eflz-drop) */
/* системният вход на файл е визуално скрит, но остава във фокуса (Tab); показва се зоната .eflz-drop. Селекторът е със същата тежест като общото правило за полетата по-горе и идва след него, иначе то го разтяга на 100 % и 48 px */
.efv4.lz3 .eflz-vh,.efv4.lz3 .eflz-pole input.eflz-vh{position:absolute;width:1px;height:1px;min-height:0;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.efv4.lz3 .eflz-pole input[type="checkbox"]{width:24px;height:24px;margin:0 10px 0 0;vertical-align:middle;accent-color:var(--or)}
.efv4.lz3 .eflz-pole label:has(> input[type="checkbox"]){font-weight:400;line-height:1.5;color:var(--sv-tekst);padding:8px 0;min-height:44px}
.efv4.lz3 .eflz-pole select{padding-right:12px}
.efv4.lz3 .eflz-opisanie-pole{min-width:0}
.efv4.lz3 .eflz-hint{margin:6px 0 0;color:var(--mu);font-size:14px;line-height:1.45}
.efv4.lz3 small.eflz-hint{display:inline;margin:0}
.efv4.lz3 .eflz-pole > .eflz-greshka{margin-top:6px}
/* редове от полета: на телефон едно под друго */
.efv4.lz3 .eflz-redove{display:grid;grid-template-columns:minmax(0,1fr);gap:0 16px;align-items:start;margin-top:0}
.efv4.lz3 .eflz-redove > .eflz-btn{margin-top:14px;width:100%}
.efv4.lz3 .eflz-redove > label{display:flex;align-items:center;gap:8px;min-height:48px;margin-top:14px;color:var(--sv-tekst);font-size:15px}
.efv4.lz3 .eflz-redove input[type="checkbox"]{flex:none;width:24px;height:24px;accent-color:var(--or)}
/* резултат и проверки */
.efv4.lz3 .eflz-rezultat{min-width:0;margin-top:14px}
.efv4.lz3 .eflz-rezultat:empty{display:none}
.efv4.lz3 .eflz-rezultat > .eflz-merki{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.efv4.lz3 .eflz-merki{margin-top:12px}
.efv4.lz3 .eflz-merki tbody,.efv4.lz3 .eflz-merki thead,.efv4.lz3 .eflz-merki tr{max-width:100%}
.efv4.lz3 .eflz-merki th,.efv4.lz3 .eflz-merki td{overflow-wrap:anywhere}
.efv4.lz3 .eflz-proverki{margin:12px 0 0;padding:0;list-style:none}
.efv4.lz3 .eflz-proverki > li{margin:10px 0 0}
.efv4.lz3 .eflz-proverki > li:first-child{margin-top:0}
.efv4.lz3 .eflz-proverki .eflz-hint{color:inherit;opacity:.8}
/* контурът е самият svg с клас eflz-predmet; линията е currentColor */
.efv4.lz3 svg.eflz-predmet{display:block;width:100%;height:auto;max-height:320px;margin:12px 0 0;padding:8px;border:1px solid var(--ln);border-radius:6px;background:var(--s1);color:var(--te2)}
/* формата и готовото */
.efv4.lz3 .eflz-forma-obvivka{min-width:0;margin-top:20px;padding-top:4px;border-top:1px solid var(--ln)}
.efv4.lz3 .eflz-forma-obvivka .eflz-forma{margin-top:12px}
.efv4.lz3 .eflz-forma h2{margin:0 0 4px;font-size:20px;line-height:1.25}
.efv4.lz3 .eflz-forma > .eflz-btn{width:100%;margin-top:16px}
.efv4.lz3 .eflz-forma > .eflz-hint{margin-top:12px}
.efv4.lz3 #eflz-app > .eflz-hint,.efv4.lz3 #eflz-app > .eflz-greshka{margin-top:0}
.efv4.lz3 #eflz-app :is(p,h2,label,td,th,li,small){overflow-wrap:anywhere}
.efv4.lz3 #eflz-app :is(input,select,textarea,button){max-width:100%}
.efv4.lz3 #eflz-app input[disabled],.efv4.lz3 #eflz-app select[disabled]{opacity:.6;cursor:not-allowed}
@media (min-width:640px){
  .efv4.lz3 .eflz-vhod[role="tablist"]{grid-template-columns:repeat(3,minmax(0,1fr))}
  .efv4.lz3 .eflz-redove{grid-template-columns:repeat(auto-fit,minmax(11em,1fr))}
  .efv4.lz3 .eflz-redove > .eflz-btn{width:auto;justify-self:start}
  .efv4.lz3 .eflz-forma > .eflz-btn{width:auto;min-width:12em}
}

.efv4.lz3 .eflz-merki td{white-space:nowrap;overflow-wrap:normal}
.efv4.lz3 .eflz-merki th{width:100%}
.efv4.lz3 .eflz-pravilo-id{display:block;margin-top:2px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px;color:var(--mu);overflow-wrap:anywhere;word-break:break-all}
