/* Бизнис Систем - тема „Меко и модерно“. верзија 2
   Се вчитува ПОСЛЕ kc.css и planning.css и само ги препокрива.
   Враќање на стариот изглед: избриши го овој фајл. */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root{--nar:#2f6bff;--nar-t:#2152d6;--crn:#1b2336;--siv:#6d7890;--lin:#e5eaf2;--pod:#eef2f8;
  --crv:#d12d3d;--zol:#b56a00;--zel:#157a4a;--sen:0 6px 24px #1b2a5010;--r:18px}
body{font-family:'Plus Jakarta Sans',Inter,system-ui,sans-serif;color:var(--crn);background:var(--pod)}
a{color:var(--nar)}

/* ---------- странично мени ---------- */
.top{background:#fff!important;box-shadow:none;border-right:1px solid var(--lin);color:#44506a}
.top .brend{color:var(--crn);font-size:22px;letter-spacing:-.5px;font-weight:800;line-height:1.15;padding:4px 12px 26px}
.brend span{color:var(--nar);font-size:10px;letter-spacing:2px;font-weight:700;margin-top:6px}
.top nav{gap:3px}
.top nav a{color:#44506a;font-size:14.5px;font-weight:500;padding:10px 12px;border-radius:12px;gap:12px}
.top nav a:hover{background:#f1f5fb;color:var(--crn);text-decoration:none}
.top nav a.akt{background:#eaf0ff;color:var(--nar);box-shadow:none;font-weight:700}
/* Иконата се задава на самата врска (--ik), а :before само ја црта.
   Ако --ik се стави на :before, ја препокрива вредноста од врската и сите иконки стануваат исти. */
.top nav a:before{content:'';width:20px;height:20px;flex:none;background:currentColor;opacity:.75;
  -webkit-mask:var(--ik) center/contain no-repeat;mask:var(--ik) center/contain no-repeat}
.top nav a{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3C/svg%3E")}
.top nav a.akt:before{opacity:1}
.top nav a[href*='pocetna']{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7v9a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E")}
.top nav a[href*='klienti']{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V8l8-4 8 4v12M9 20v-5h6v5M8 11h.01M16 11h.01'/%3E%3C/svg%3E")}
.top nav a[href*='uredi']{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='6' width='16' height='11' rx='2'/%3E%3Cpath d='M8 17v3M16 17v3M8 11h3'/%3E%3C/svg%3E")}
.top nav a[href*='ponudi']{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l4 4v14H6zM14 3v5h5M9 13h7M9 17h5'/%3E%3C/svg%3E")}
.top nav a[href*='nalozi']{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4h6v3H9zM6 6h12v15H6zM9 12h6M9 16h4'/%3E%3C/svg%3E")}
.top nav a[href*='za_servis']{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0 4.9 4.9L13 17.8a2.5 2.5 0 0 1-3.5-3.5z'/%3E%3Cpath d='M5 19l3-3'/%3E%3C/svg%3E")}
.top nav a[href*='za_poseta']{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='15' rx='2'/%3E%3Cpath d='M4 10h16M8 3v4M16 3v4'/%3E%3C/svg%3E")}
.top nav a[href*='korisnici']{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 20c0-3 2.7-5 6-5s6 2 6 5M17 11a2.5 2.5 0 1 0 0-5M21 19c0-2.4-1.6-4-4-4.5'/%3E%3C/svg%3E")}
.top .jas{border-top:1px solid var(--lin);padding:16px 8px 0}
.top .jas span{color:var(--crn);font-size:14px;font-weight:600}
.top .jas em{color:var(--siv);font-size:12px;font-weight:500}
.top .odjava{color:#44506a;border:1px solid var(--lin);border-radius:10px;background:#fff}
.top .odjava:hover{background:#f1f5fb;text-decoration:none}

/* ---------- заглавје на страница ---------- */
.workspace-bar{border-bottom:0;height:64px;color:var(--siv);font-size:12px;letter-spacing:1px;margin-bottom:8px}
.workspace-bar b{color:var(--crn);font-weight:600}
h1{font-weight:800;letter-spacing:-.6px;color:var(--crn)}
h2{color:var(--crn);font-weight:700}
.eyebrow{color:var(--nar);font-weight:700}

/* ---------- картички ---------- */
.kartichka,.plocka,.metric,.offer-panel,.comm-workspace,.plan-card,.plan-metrics a,.plan-empty{
  border:0!important;border-radius:var(--r);box-shadow:var(--sen);background:#fff}
.plocka b{font-size:34px;font-weight:800;letter-spacing:-1px;color:var(--crn)}
.plocka span{font-size:13.5px;color:var(--siv)}
.plocka.crv{background:linear-gradient(135deg,#ff5a6a,#d12d3d)!important;color:#fff}
.plocka.crv b,.plocka.crv span{color:#fff}
.plocka.zol{background:#fff4e2!important}.plocka.zol b{color:var(--zol)}
.metric.featured,.plan-metrics a:first-child{background:linear-gradient(135deg,#3b78ff,#2152d6)!important;color:#fff}
.metric.featured>span,.metric.featured small{color:#dbe6ff}

/* ---------- табели ---------- */
.t{border:0;border-radius:var(--r);box-shadow:var(--sen);background:#fff}
.t th{background:#f5f8fc;color:var(--siv);font-weight:700;font-size:11.5px;letter-spacing:.7px;border:0;padding:12px 12px}
.t td{border-top:1px solid #eef2f7;padding:12px}
.t tr:hover td{background:#f8faff}
.t td>a:only-child{white-space:nowrap}
.t tr.docna td{background:#fff5f6}
.t tr.docna td b{color:var(--crv)}
.offer-table th{background:#f5f8fc}

/* ---------- значки со значење: црвено застој, жолто итно, зелено готово ---------- */
.zn{border:0!important;font-weight:700;border-radius:20px}
.zn.crv{background:#ffe8ea;color:#c0283a}
.zn.zol{background:#fff1dc;color:#a65f00}
.zn.zel{background:#e2f6ec;color:#157a4a}
.zn.siv{background:#edf1f7;color:#4d5a73}
.broj{background:#eaf0ff;color:var(--nar);font-weight:700}

/* ---------- копчиња и полиња ---------- */
.gl{background:var(--nar)!important;border:0;border-radius:14px;box-shadow:0 8px 20px #2f6bff40;font-weight:700}
.gl:hover{background:var(--nar-t)!important}
button,.mal{border-radius:12px;border-color:var(--lin)}
input,select,textarea{border:1px solid #dfe6f1;border-radius:12px;background:#fff}
input:focus,select:focus,textarea:focus{outline:3px solid #2f6bff33;outline-offset:0;border-color:var(--nar)}
.flash{border-radius:14px;border:0;background:#e2f6ec;color:#115c38}
.flash.gr{background:#ffe8ea;color:#9b1c2c}
.zbir{background:#f5f8fc;border:0;border-radius:16px}
.zbir .vk{color:var(--nar);border-top-color:#dfe6f1}

/* ---------- најава ---------- */
body.gol{background:radial-gradient(1200px 600px at 20% 0%,#dfe8ff 0%,transparent 60%),var(--pod)!important}
.najava{background:#fff;border:0!important;border-radius:24px;box-shadow:0 20px 60px #1b2a5018;padding:34px}
.najava h1{font-size:26px;font-weight:800}
.najava .pod{color:var(--nar);font-weight:700;letter-spacing:1.5px;text-transform:uppercase;font-size:12px}
.najava button{border-radius:14px;padding:13px}

/* ---------- телефон ---------- */
@media(max-width:760px){
  .top{border-right:0;border-bottom:1px solid var(--lin)}
  .top .brend{font-size:20px;padding:0 0 12px}
  .brend span{margin-left:10px}
  .top nav a{padding:9px 11px;font-size:13.5px}
  .top nav a:before{width:17px;height:17px}
}

/* pocetna-v1: поздрав, контекст на плочките, календар */
.pozdrav{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin:6px 0 22px}
.pozdrav small{font-size:13px;color:var(--siv);font-weight:600}.pozdrav h1{margin:4px 0 6px;font-size:30px}
.pozdrav p{margin:0;color:var(--siv);font-size:15px}.pozdrav p b{color:var(--crv)}
.pozdrav .akcii{display:flex;gap:10px;align-items:center;margin:0}.pozdrav .akcii input{width:280px;margin:0;height:44px}
.pozdrav .akcii .gl{white-space:nowrap}
.plocka small{display:block;font-size:12.5px;margin-top:6px;color:var(--siv)}.plocka.crv small{color:#ffe3e6}
.plocka i{display:block;height:6px;border-radius:9px;background:#edf1f7;margin-top:10px;overflow:hidden}.plocka i em{display:block;height:100%;background:var(--nar)}
.dve{display:grid;grid-template-columns:1.2fr 1fr;gap:18px;margin-top:22px;align-items:start}.dve.edna{grid-template-columns:1fr}.dve .kartichka h2{margin:0 0 12px}
.kal{list-style:none;margin:0;padding:0}.kal li{display:flex;align-items:center;gap:14px;padding:10px 0;border-top:1px solid #eef2f7}.kal li:first-child{border:0}
.kal .d{width:50px;flex:none;text-align:center;background:#f5f8fc;border-radius:12px;padding:6px 0}.kal .d b{display:block;font-size:18px;line-height:1.1}.kal .d span{font-size:10.5px;text-transform:uppercase;color:var(--siv);font-weight:700}
.kal li.docni .d{background:#ffe8ea;color:#c0283a}.kal li.docni .d span{color:#c0283a}
.kal strong{display:block;font-size:14.5px}.kal small{color:var(--siv);font-size:12.5px}.kal .zn{margin-left:auto}.kal .iznos{margin-left:auto;font-weight:800;white-space:nowrap}
.opomena{margin:-4px 0 6px;color:var(--siv);font-size:13.5px}
@media(max-width:900px){.dve{grid-template-columns:1fr}.pozdrav .akcii{width:100%}.pozdrav .akcii input{width:auto;flex:1;min-width:0}}

/* korisnici-v1: табелата со корисници */
.t:has(input[value=prekluci]) td{vertical-align:middle;padding-top:14px;padding-bottom:14px}
.t:has(input[value=prekluci]) td:nth-child(1){font-weight:700;white-space:nowrap}
.t:has(input[value=prekluci]) td:nth-child(2){max-width:none;white-space:nowrap;font-size:13.5px;color:var(--siv)}
.t:has(input[value=prekluci]) td:nth-child(3){white-space:nowrap}
.t:has(input[value=prekluci]) td:nth-child(4){white-space:nowrap;font-size:13.5px}
.t:has(input[value=prekluci]) td:nth-child(4):empty::before{content:"никогаш";color:var(--siv)}
.t:has(input[value=prekluci]) td:nth-child(5){min-width:150px}
.t:has(input[value=prekluci]) td .pod{display:block;margin-top:5px;font-size:12px;color:var(--siv);white-space:nowrap}
.t:has(input[value=prekluci]) td>span.pod:only-child{display:inline-block;margin:0;padding:4px 12px;border-radius:20px;background:#eaf0ff;color:var(--nar);font-weight:700}
.t:has(input[value=prekluci]) .vgr{flex-wrap:nowrap;gap:8px}
.t:has(input[value=prekluci]) .vgr button{height:38px;padding:0 16px;margin:0;white-space:nowrap}
.t:has(input[value=prekluci]) .vgr input[type=password]{height:38px;min-width:150px;width:170px}

/* meni-v2: активната ставка е со градиент. Понуди е како сите други. */
.top nav a.akt{background:linear-gradient(135deg,#2f6bff,#6a5cff);color:#fff;font-weight:800;box-shadow:0 8px 20px #2f6bff45}
.top nav a.akt:hover{background:linear-gradient(135deg,#255ee8,#5b4cf0);color:#fff}

/* izvestai-v1: иконка за Извештаи во менито */
.top nav a[href$="s=izvestai"]{--ik:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h16M7 16v-5M12 16V7M17 16v-8'/%3E%3C/svg%3E")}