:root{
  --bg:#ffffff;
  --card:#ffffff;
  --ink:#0f172a;
  --muted:#667085;
  --ring:rgba(2,6,23,.10);
  --brand:#16a34a;
  --brand2:#22c55e;
  --blue:#2563eb;
  --danger:#dc2626;
  --radius:18px;
  --radius2:22px;
  --shadow:0 18px 50px rgba(2,6,23,.10), 0 2px 8px rgba(2,6,23,.06);
  --shadow2:0 30px 90px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{background:var(--bg);color:var(--ink);font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
body{margin:0}
a{color:inherit}
.small{font-size:.92rem;color:var(--muted);line-height:1.35}
.req{color:var(--danger);font-weight:900}
.wrap{max-width:1180px;margin:0 auto;padding:16px 16px 44px}

/* Topbar */
.topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.78);backdrop-filter:blur(10px);border-bottom:1px solid var(--ring)}
.nav{max-width:1180px;margin:0 auto;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brandDot{width:14px;height:14px;border-radius:999px;background:linear-gradient(135deg,var(--brand),var(--brand2));box-shadow:0 12px 26px rgba(34,197,94,.30)}
.brandText{font-weight:1000}
.brandAccent{color:var(--brand);font-weight:1000;margin-left:6px}
.navLinks{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.navItem{padding:8px 10px;border-radius:999px;text-decoration:none;font-weight:900;border:1px solid transparent;color:rgba(15,23,42,.84)}
.navItem:hover{border-color:var(--ring);background:rgba(2,6,23,.03)}
.navBtn{border:none;border-radius:999px;padding:10px 14px;font-weight:1000;cursor:pointer;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;box-shadow:0 14px 30px rgba(34,197,94,.28)}
.navBtn.ghost{background:#fff;color:var(--ink);border:1px solid var(--ring);box-shadow:none}

/* Cards */
.section{padding:14px 0}
.card{background:var(--card);border:1px solid var(--ring);border-radius:var(--radius2);box-shadow:var(--shadow);padding:18px}
.card.soft{background:linear-gradient(180deg,rgba(22,163,74,.06),rgba(255,255,255,1))}
.h2{font-size:1.35rem;font-weight:1100;margin:0 0 8px}

.heroGrid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px;align-items:stretch}
@media (max-width:900px){.heroGrid{grid-template-columns:1fr}}
.heroTitle{margin:0;font-size:2rem;font-weight:1100;line-height:1.05}
.heroTitle span{color:var(--brand)}
.heroSub{margin-top:8px;color:var(--muted);font-weight:800}
.badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.badge{padding:8px 10px;border-radius:999px;border:1px solid var(--ring);background:#fff;font-weight:1000}
.kpiBox{display:grid;grid-template-columns:1fr;gap:10px}
.kpi{border:1px solid var(--ring);border-radius:16px;background:#fff;padding:12px 14px}
.kpi strong{font-size:1.35rem}
.kpi span{display:block;color:var(--muted);font-weight:800;margin-top:2px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;padding:11px 14px;font-weight:1100;text-decoration:none;border:1px solid transparent;cursor:pointer}
.btnPrimary{background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;box-shadow:0 16px 32px rgba(34,197,94,.26)}
.btnGhost{background:#fff;color:var(--ink);border-color:var(--ring)}
.btnPrimary:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}

/* Toasts */
#toasts{position:fixed;top:18px;right:18px;z-index:99999;display:flex;flex-direction:column;gap:10px}
.toast{min-width:280px;max-width:460px;padding:14px 16px;border-radius:14px;color:#fff;font-weight:1000;box-shadow:0 20px 40px rgba(0,0,0,.18);animation:slideIn .25s ease, fadeOut .35s ease 4s forwards}
.toast.success{background:#16a34a}
.toast.error{background:#dc2626}
.toast.info{background:#2563eb}
@keyframes slideIn{from{transform:translateX(40px);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes fadeOut{to{opacity:0;transform:translateX(40px)}}

/* Jobs */
.job-card{border:1px solid var(--ring);border-radius:18px;background:#fff;padding:14px;margin-top:12px}
.job-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.job-title{font-weight:1100;font-size:1.1rem}
.job-badge{padding:6px 10px;border-radius:999px;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.30);color:#0f5132;font-weight:1000}
.job-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.job-chip{padding:8px 10px;border-radius:999px;border:1px solid var(--ring);background:rgba(2,6,23,.02);font-weight:900}
.job-desc{margin-top:10px;color:rgba(15,23,42,.88);line-height:1.5}
.job-foot{margin-top:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.job-pay{font-weight:1100}

/* Map */
#map{height:420px;border-radius:18px;border:1px solid var(--ring);overflow:hidden}
.tableSmall{width:100%;border-collapse:collapse;margin-top:12px}
.tableSmall th,.tableSmall td{border:1px solid var(--ring);padding:10px 10px;text-align:left}
.tableSmall th{background:rgba(2,6,23,.03);font-weight:1100}
.pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid var(--ring);background:#fff;font-weight:1000}

/* Cluster */
.marker-cluster-small,.marker-cluster-medium,.marker-cluster-large{background-color:rgba(15,23,42,.08)!important}
.marker-cluster div{background:#0f172a!important;color:#fff!important;font-weight:1100;border:3px solid #fff;box-shadow:0 10px 26px rgba(0,0,0,.25)}

/* Register */
.stepper{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.step{display:flex;align-items:center;gap:8px;font-weight:1100;color:#94a3b8}
.step .dot{width:28px;height:28px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:#e5e7eb;color:#64748b;font-size:13px;box-shadow:0 8px 18px rgba(0,0,0,.08)}
.step.active,.step.done{color:var(--brand)}
.step.active .dot,.step.done .dot{background:var(--brand);color:#fff}
.line{flex:1;min-width:36px;height:2px;background:#e5e7eb}
.line.done{background:var(--brand)}
@media (max-width:720px){.line{display:none}.stepper{gap:8px}}

.twoCols{display:grid;grid-template-columns:1fr .42fr;gap:14px;align-items:start}
@media (max-width:980px){.twoCols{grid-template-columns:1fr}}
.stickyCol{position:sticky;top:84px}
@media (max-width:980px){.stickyCol{position:static}}

.wizPanel{display:none}
.wizPanel.active{display:block}

.field{margin-top:12px}
label{display:block;font-weight:1000;margin-bottom:6px}
input[type="text"],input[type="email"],input[type="password"],input[type="date"],select{
  width:100%;padding:12px 14px;border:1px solid var(--ring);border-radius:14px;font-size:1rem;background:#fff;outline:none;
}
input:focus,select:focus{border-color:rgba(34,197,94,.55);box-shadow:0 0 0 .2rem rgba(34,197,94,.14)}
hr.sep{border:none;height:1px;background:rgba(2,6,23,.08);margin:14px 0}

/* Login modal (same rules) */
#loginModal{display:none;position:fixed;inset:0;z-index:99998;background:rgba(15,23,42,.55);backdrop-filter:blur(6px)}
#loginModal .modalCard{max-width:420px;margin:8vh auto;background:#fff;border-radius:22px;padding:22px;box-shadow:var(--shadow2);position:relative}
#loginModal .xClose{position:absolute;top:10px;right:10px;width:40px;height:40px;border-radius:12px;border:1px solid rgba(0,0,0,.10);background:#fff;cursor:pointer;font-weight:1100}

/* ==========================================
   PREMIUM APPLY MODAL (FULLSCREEN)
========================================== */
body.modal-open{overflow:hidden}

#applyModal{
  display:none;
  position:fixed;
  inset:0;
  z-index:99997;
  background:rgba(0,0,0,.70);
  backdrop-filter:blur(10px);
}
#applyModal[aria-hidden="false"]{display:flex;align-items:center;justify-content:center;padding:18px}

.applyCard{
  width:min(980px, 100%);
  max-height:92vh;
  background:#fff;
  border-radius:28px;
  box-shadow:var(--shadow2);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transform:translateY(12px) scale(.985);
  opacity:0;
  animation:modalIn .22s ease forwards;
}
@keyframes modalIn{to{transform:translateY(0) scale(1); opacity:1}}

.applyHeader{
  padding:16px 18px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid var(--ring);
  background:linear-gradient(180deg,rgba(22,163,74,.08),rgba(255,255,255,1));
}
.applyTitle{font-weight:1200;font-size:1.15rem;margin:0}
.applyMeta{margin-top:4px}
.applyMetaRow{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 10px;border-radius:999px;
  border:1px solid var(--ring);
  background:#fff;font-weight:1000;
}
.closeX{
  width:44px;height:44px;border-radius:14px;border:1px solid rgba(0,0,0,.10);
  background:#fff;cursor:pointer;font-weight:1200;
}
.closeX:hover{background:rgba(2,6,23,.03)}

.applyBody{
  display:grid;
  grid-template-columns:1fr .36fr;
  gap:14px;
  padding:16px 18px;
  overflow:auto;
}
@media(max-width:980px){.applyBody{grid-template-columns:1fr}}

.applyPanel{
  border:1px solid var(--ring);
  border-radius:22px;
  padding:14px;
  background:#fff;
}

.applyStepper{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:18px;
  background:rgba(2,6,23,.02);
  border:1px solid var(--ring);
}
.ast{display:flex;align-items:center;gap:8px;font-weight:1100;color:#94a3b8;}
.ast .sDot{
  width:28px;height:28px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  background:#e5e7eb;color:#64748b;font-size:13px;font-weight:1100;
}
.ast.active,.ast.done{color:var(--brand)}
.ast.active .sDot,.ast.done .sDot{background:var(--brand);color:#fff}
.sLine{flex:1;height:2px;background:#e5e7eb}
.sLine.done{background:var(--brand)}

.progressWrap{margin-top:12px}
.progressBar{height:10px;border-radius:999px;background:rgba(2,6,23,.08);overflow:hidden}
.progressBar i{
  display:block;height:100%;width:0%;
  background:linear-gradient(90deg,var(--brand),var(--brand2));
  transition:width .2s ease;
}

.applyStep{display:none}
.applyStep.active{display:block;animation:stepIn .18s ease}
@keyframes stepIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

.fileGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;}
@media(max-width:820px){.fileGrid{grid-template-columns:1fr}}

.filebox{
  border:1px solid var(--ring);
  border-radius:18px;
  padding:12px;
  background:linear-gradient(180deg,rgba(2,6,23,.01),rgba(255,255,255,1));
}
.filebox.drag{outline:2px dashed rgba(22,163,74,.55);outline-offset:8px}
.fileui{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:8px}
.filename{font-weight:900;color:var(--muted)}
.preview img,.preview video{max-width:100%;border-radius:14px;display:block;box-shadow:0 10px 24px rgba(0,0,0,.10);margin-top:10px}

.inlineError{
  display:none;margin-top:8px;padding:10px 12px;border-radius:14px;
  background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.25);
  color:#991b1b;font-weight:1000;
}
.applyActions{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:14px}

.sideCard{
  border:1px solid var(--ring);
  border-radius:22px;
  background:#fff;
  padding:14px;
  position:sticky;top:0;
  box-shadow:0 10px 30px rgba(2,6,23,.06);
}
@media(max-width:980px){.sideCard{position:relative}}
.sideTitle{font-weight:1200;font-size:1.05rem;margin:0}
.sideRow{display:flex;justify-content:space-between;margin-top:10px}
.badgeOk{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:999px;
  border:1px solid rgba(22,163,74,.25);
  background:rgba(22,163,74,.10);
  font-weight:1100;color:#0f5132
}
.badgeNo{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:999px;
  border:1px solid rgba(220,38,38,.25);
  background:rgba(220,38,38,.08);
  font-weight:1100;color:#991b1b
}

/* JOBS GRID (optional) */
.jobsGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:14px}
@media (max-width:1100px){.jobsGrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.jobsGrid{grid-template-columns:1fr}}

/* APPLY DOCUMENTS – RESPONSIVE */
.apply-docs-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}
@media (max-width:900px){.apply-docs-grid{grid-template-columns:1fr}}
@media (max-width:480px){
  .apply-docs-grid .card{padding:14px}
  .apply-docs-grid ul{margin-left:14px !important}
}
.userMenu{
  position:relative !important;
}

.userBtn{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:10px 14px !important;
  border-radius:999px !important;
  border:1px solid var(--ring) !important;
  background:#fff !important;
  font-weight:1000 !important;
  cursor:pointer !important;
  box-shadow:none !important;
}

.userBtn:hover{
  background:rgba(2,6,23,.03) !important;
}

.userDropdown{
  position:absolute !important;
  right:0 !important;
  top:110% !important;
  min-width:180px !important;
  background:#fff !important;
  border:1px solid var(--ring) !important;
  border-radius:14px !important;
  box-shadow:var(--shadow) !important;
  display:none !important;
  flex-direction:column !important;
  overflow:hidden !important;
  z-index:200 !important;
}

.userDropdown a{
  padding:12px 14px !important;
  text-decoration:none !important;
  font-weight:900 !important;
  color:var(--ink) !important;
}

.userDropdown a:hover{
  background:rgba(2,6,23,.05) !important;
}
/* ================= MOBILE NAV ================= */

.burger{
  display:none;
  border:1px solid var(--ring);
  background:#fff;
  border-radius:12px;
  padding:8px 12px;
  font-size:20px;
  cursor:pointer;
  font-weight:1000;
}

/* MOBILE */
@media (max-width: 900px){

  .burger{
    display:block;
  }

  .navLinks{
    position:absolute;
    top:64px;
    right:16px;
    left:16px;

    display:none;
    flex-direction:column;
    gap:8px;

    background:#fff;
    border:1px solid var(--ring);
    border-radius:18px;
    padding:14px;

    box-shadow:var(--shadow);
    z-index:999;
  }

  .navLinks.open{
    display:flex;
  }

  .navItem,
  .navBtn,
  .userMenu{
    width:100%;
    justify-content:center;
  }

  .userDropdown{
    position:relative !important;
    top:auto !important;
    right:auto !important;
    box-shadow:none !important;
    border:none !important;
  }
}

/* ================= MAP COUNT TABLE – PREMIUM ================= */

#countTable{
  width:100% !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  margin-top:14px;
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 12px 34px rgba(2,6,23,.08);
}

/* HEADER */
#countTable thead th{
  background:linear-gradient(180deg,rgba(2,6,23,.04),rgba(2,6,23,.01));
  font-weight:1100;
  padding:14px 16px;
  text-align:left;
  border-bottom:1px solid var(--ring);
  color:#0f172a;
}

/* BODY */
#countTable tbody td{
  padding:14px 16px;
  font-weight:900;
  border-bottom:1px solid rgba(2,6,23,.06);
}

/* ROW HOVER */
#countTable tbody tr{
  transition:background .18s ease, transform .12s ease;
}
#countTable tbody tr:hover{
  background:rgba(22,163,74,.05);
  transform:scale(1.005);
}

/* ZEBRA */
#countTable tbody tr:nth-child(even){
  background:rgba(2,6,23,.015);
}

/* COUNTRY */
#countTable td:nth-child(1){
  font-weight:1000;
}

/* CITY */
#countTable td:nth-child(2){
  color:var(--muted);
}

/* COUNT BADGE */
#countTable td:nth-child(3){
  text-align:center;
}

#countTable td:nth-child(3)::before{
  content:"👥 ";
}

#countTable td:nth-child(3) span{
  display:inline-block;
  min-width:48px;
  padding:6px 12px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  color:#fff;
  font-weight:1100;
}

/* EMPTY STATE */
#countTable td[colspan]{
  text-align:center;
  padding:22px;
  font-weight:1000;
  color:var(--muted);
}

/* MOBILE */
@media (max-width: 720px){
  #countTable thead{
    display:none;
  }

  #countTable tbody tr{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    padding:14px;
    border-bottom:1px solid var(--ring);
  }

  #countTable tbody td{
    border:none;
    padding:6px 0;
  }

  #countTable tbody td:nth-child(3){
    grid-column:span 2;
    text-align:left;
  }

  #countTable tbody td:nth-child(3)::before{
    content:"Registriert: ";
  }
}
.topbar{
  position:sticky;
  top:0;
  z-index:9999 !important;
  overflow:visible !important;
}
/* ================= REGISTER TYPE BUTTONS ================= */

.type-btn{
  transition:all .18s ease;
}

/* gjendja aktive */
.type-btn.active{
  background:linear-gradient(135deg,var(--brand),var(--brand2)) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 14px 30px rgba(34,197,94,.28) !important;
}

/* hover kur nuk eshte aktive */
.type-btn:not(.active):hover{
  background:rgba(2,6,23,.04);
}
.guaranteeGrid{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
.guaranteeOption{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid var(--ring);
  background:#fff;
  font-weight:1000;
  cursor:pointer;
}
/* ================= AUSZAHLUNGS-ÜBERSICHT TABLE ================= */

#payout-today .card{
  padding:0;
}

#payout-today .h2{
  padding:18px 20px 6px;
}

#payout-today table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  margin-top:8px;
  font-size:.95rem;
}

#payout-today thead th{
  background:rgba(2,6,23,.04);
  font-weight:1000;
  padding:14px 16px;
  border-bottom:1px solid var(--ring);
  text-align:center;
  white-space:nowrap;
}

#payout-today thead th:first-child{
  text-align:left;
}

#payout-today tbody td{
  padding:14px 16px;
  border-bottom:1px solid rgba(2,6,23,.06);
  vertical-align:middle;
}

#payout-today tbody tr:hover{
  background:rgba(22,163,74,.04);
}

#payout-today tbody td:first-child{
  font-weight:1000;
  width:38%;
}

#payout-today tbody small{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-weight:700;
}

/* ===== AKTIVE RATE ===== */
.rateActive{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:900;
  cursor:pointer;
}

.rateActive input{
  width:16px;
  height:16px;
  accent-color:var(--brand);
  cursor:pointer;
}

.rateActive span{
  font-size:.9rem;
}

/* ===== DISABLED RATE ===== */
.rateDisabled{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:rgba(220,38,38,.55);
  font-size:1.1rem;
}

/* ===== COLUMN ALIGN ===== */
#payout-today tbody td:not(:first-child){
  text-align:center;
}

/* ===== MOBILE ===== */
@media (max-width:720px){
  #payout-today table,
  #payout-today thead,
  #payout-today tbody,
  #payout-today th,
  #payout-today td,
  #payout-today tr{
    display:block;
  }

  #payout-today thead{
    display:none;
  }

  #payout-today tbody tr{
    padding:14px;
    border-bottom:1px solid var(--ring);
  }

  #payout-today tbody td{
    border:none;
    padding:6px 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
  }

  #payout-today tbody td:first-child{
    font-size:1rem;
  }

  #payout-today tbody td:not(:first-child)::before{
    content:attr(data-label);
    font-weight:900;
    color:var(--muted);
  }
}
/* ===============================
   JOB CARD – PAYMENT UI (PRO)
================================ */

.job-card{
  background:#fff;
  border:1px solid var(--ring);
  border-radius:18px;
  padding:18px;
  margin-top:16px;
}

.job-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}

.job-title{
  font-size:1.1rem;
  font-weight:1100;
  color:var(--ink);
}

.job-badge{
  padding:6px 12px;
  border-radius:999px;
  font-weight:1000;
  font-size:.8rem;
  background:#dcfce7;
  color:#166534;
}

.job-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}

.job-chip{
  background:#f8fafc;
  border:1px solid var(--ring);
  border-radius:999px;
  padding:6px 10px;
  font-weight:900;
  font-size:.85rem;
}

.job-desc{
  margin-top:12px;
  font-size:.95rem;
  line-height:1.6;
  color:#1f2937;
}

.pay-box{
  margin-top:14px;
  border:1px solid var(--ring);
  border-radius:14px;
  background:#f8fafc;
  padding:14px;
}

.pay-title{
  font-weight:1100;
  font-size:.95rem;
  margin-bottom:6px;
}

.pay-table{
  width:100%;
  border-collapse:collapse;
  font-size:.9rem;
}

.pay-table td{
  padding:6px 0;
}

.pay-table tr + tr{
  border-top:1px dashed var(--ring);
}

.pay-table .right{
  text-align:right;
  font-weight:900;
}

.pay-total{
  border-top:2px solid var(--ring);
  margin-top:6px;
  padding-top:6px;
  font-size:1rem;
  font-weight:1200;
}

.pay-formula{
  margin-top:6px;
  font-size:.8rem;
  color:#64748b;
}

.job-foot{
  margin-top:16px;
}

.job-foot .btn{
  width:100%;
}
/* ===== RESERVIERUNG BOX (APPLY MODAL) ===== */
.reserveBox{
  border:1px solid var(--ring);
  border-radius:22px;
  background:linear-gradient(180deg,rgba(22,163,74,.06),rgba(255,255,255,1));
  padding:14px;
}
.reserveTop{
  display:grid;
  grid-template-columns:1fr .55fr;
  gap:14px;
  align-items:start;
}
@media(max-width:980px){
  .reserveTop{grid-template-columns:1fr}
}
.reserveTitle{font-weight:1200;font-size:1.05rem}
.reserveLabel{display:block;font-weight:1100;margin-bottom:6px}
.reserveInput input{
  width:100%;
  padding:12px 14px;
  border:1px solid var(--ring);
  border-radius:14px;
  font-weight:1000;
  outline:none;
}
.reserveInput input:focus{
  border-color:rgba(34,197,94,.55);
  box-shadow:0 0 0 .2rem rgba(34,197,94,.14)
}
.reserveCalc{
  margin-top:12px;
  background:#fff;
  border:1px solid var(--ring);
  border-radius:18px;
  padding:12px 14px;
}
.calcRow{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:6px 0;
}
.calcRow strong{font-weight:1200}
.calcLine{height:1px;background:rgba(2,6,23,.08);margin:10px 0}
.calcTotal{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(22,163,74,.10);
  border:1px solid rgba(22,163,74,.22);
  margin-top:6px;
  font-weight:1200;
}
.calcTotal strong{font-size:1.05rem}

/* ================= APPLY MODAL – GRID FIX (FINAL) ================= */

.applyBody {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap: 24px;
  align-items: flex-start;
}

/* left column must be allowed to grow */
.applyBody > div,
.applyPanel,
.fileGrid {
  min-width: 0;
}

/* right column (calculator) */
.sideCard.sticky {
  position: sticky;
  top: 96px;
  align-self: flex-start;
}

/* prevent horizontal scroll */
.applyCard,
.applyBody {
  overflow-x: hidden;
}

/* mobile */
@media (max-width: 980px) {
  .applyBody {
    grid-template-columns: 1fr;
  }

  .sideCard.sticky {
    position: relative;
    top: auto;
  }
}
/* required input error */
input.error {
  border-color: #dc2626;
  box-shadow: 0 0 0 2px rgba(220,38,38,.15);
}
/* Units input – professional (FORCED) */
.unitInput {
  width: 100% !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  border: 1px solid var(--ring) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

.unitInput:focus {
  outline: none !important;
  border-color: #16a34a !important;
  box-shadow: 0 0 0 2px rgba(22,163,74,.15) !important;
}

.unitInput.error {
  border-color: #dc2626 !important;
  box-shadow: 0 0 0 2px rgba(220,38,38,.15) !important;
}
.calcBox{
  background:linear-gradient(180deg,#f8fafc,#f1f5f9);
  border:1px solid var(--ring);
}

.calc-input{
  margin-top:10px;
}

.calc-input label{
  font-weight:600;
  display:block;
  margin-bottom:4px;
}

.calc-input input{
  width:100%;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid var(--ring);
  font-weight:700;
}

.calc-results{
  margin-top:14px;
}

.calc-results .row{
  display:flex;
  justify-content:space-between;
  margin:6px 0;
}

.calc-results .row.total{
  font-size:1.05rem;
  font-weight:1100;
}

.calc-results .line{
  height:1px;
  background:var(--ring);
  margin:8px 0;
}
.job-grid{
  display:grid;
  grid-template-columns: 1fr 360px;
  gap:20px;
  align-items:start;
}

.job-main{
  min-width:0;
}

.job-side{
  position:sticky;
  top:90px;
}

.btnApplyFull{
  width:100%;
  margin-top:12px;
  font-size:1rem;
  font-weight:800;
}

/* Mobile */
@media(max-width:900px){
  .job-grid{
    grid-template-columns:1fr;
  }
  .job-side{
    position:static;
  }
}
.job-action-bottom{
  margin-top:18px;
}

.btnApplyBottom{
  width:100%;
  font-size:1.05rem;
  font-weight:900;
  padding:14px 16px;
  border-radius:14px;
}

/* pak shadow për CTA */
.btnApplyBottom.btnPrimary{
  box-shadow:0 10px 25px rgba(22,163,74,.35);
}