/* =========================================================
   V176 — MOBILE UX SYSTEM
   - stały górny pasek
   - większe cele dotykowe
   - brak iOS input zoom
   - zadania w kafelkach / pełnoekranowych ekranach
   ========================================================= */

/* Nie pozwalaj Safari powiększać interfejsu po wejściu w pole. */
@media (max-width: 760px){
  input,select,textarea,button{font-size:16px!important}
}

/* PANEL ADMIN / PRACOWNIK — topbar naprawdę nieruchomy na mobile. */
@media (max-width:1050px){
  .ops-topbar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    z-index:5000!important;
    box-sizing:border-box!important;
    background:rgba(5,6,10,.985)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    backdrop-filter:blur(18px)!important;
    border-bottom:1px solid rgba(255,255,255,.09)!important;
    box-shadow:0 8px 26px rgba(0,0,0,.26)!important;
  }
  .ops-v98 .dashboard-shell{
    padding-top:calc(82px + env(safe-area-inset-top,0px))!important;
  }
  .ops-topbar-left,.ops-topbar-right{min-width:0!important}
  .ops-topbar-left{flex:1 1 auto!important}
  .ops-topbar-right{flex:0 0 auto!important}

  /* Większe, wygodniejsze cele dotykowe — admin i pracownik. */
  #mk-return-to-app,.ops-menu-toggle,.ops-notification-button{
    width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important;
    border-radius:16px!important;
  }
  .ops-menu-toggle{font-size:1.5rem!important}
  .ops-notification-bell{width:30px!important;height:30px!important}
  .ops-mobile-home-logo{width:50px!important;height:50px!important;min-width:50px!important;border-radius:15px!important}
  .ops-nav-button{min-height:58px!important;padding:10px 12px!important;font-size:1rem!important}
  .ops-nav-icon{width:36px!important;height:36px!important;font-size:1.32rem!important}
  .ops-sidebar-quick{min-height:64px!important}
  .ops-sidebar-quick>span:first-child{width:44px!important;height:44px!important;font-size:1.48rem!important}
  #admin-logout{min-height:52px!important;padding:0 17px!important;font-size:.92rem!important}
  .panel-button.compact{min-height:50px!important;font-size:.9rem!important}
}

@media (max-width:650px){
  .ops-topbar{height:78px!important;min-height:78px!important;padding:0 10px!important;gap:6px!important}
  .ops-v98 .dashboard-shell{padding-top:calc(92px + env(safe-area-inset-top,0px))!important}
  .ops-topbar-left,.ops-topbar-right{gap:7px!important}
  #topbar-section-title{font-size:.94rem!important;max-width:92px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important}
  .ops-topbar-title-full{display:none!important}
  .ops-topbar-title-short{display:inline!important}
  /* Na bardzo wąskim ekranie nie pokazujemy urwanego tytułu — ikony mówią więcej. */
  @media (max-width:430px){
    #topbar-section-title{display:none!important}
  }
}

/* Kafelki zadań — zamiast kilometrowych formularzy na ekranie. */
.mk-mobile-task-grid{display:none}
.mk-task-dialog{border:0;padding:0;background:transparent;color:#fff;max-width:none;max-height:none}
.mk-task-dialog::backdrop{background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.mk-task-dialog-shell{position:relative;background:#08090e;border:1px solid rgba(255,255,255,.1);border-radius:24px;box-shadow:0 30px 90px rgba(0,0,0,.6)}
.mk-task-dialog-head{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:rgba(8,9,14,.97);border-bottom:1px solid rgba(255,255,255,.08);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.mk-task-dialog-head div{display:grid;gap:2px}.mk-task-dialog-head small{color:#ff5964;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.mk-task-dialog-head strong{font-size:1.1rem}
.mk-task-dialog-close{width:50px;height:50px;min-width:50px;border-radius:15px;border:1px solid rgba(255,255,255,.14);background:#11131a;color:#fff;font-size:1.5rem;cursor:pointer}
.mk-task-dialog-content{padding:16px}

@media(max-width:760px){
  .mk-mobile-task-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0 16px}
  .mk-mobile-task-card{min-height:118px;padding:16px;border:1px solid rgba(255,255,255,.1);border-radius:20px;background:linear-gradient(145deg,#12131a,#090a0f);color:#fff;text-align:left;display:grid;align-content:space-between;gap:12px;box-shadow:0 14px 36px rgba(0,0,0,.2);cursor:pointer}
  .mk-mobile-task-card.primary{border-color:rgba(239,9,23,.4);background:linear-gradient(145deg,rgba(239,9,23,.17),#090a0f 58%)}
  .mk-mobile-task-card .mk-task-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:rgba(239,9,23,.14);color:#ff5f69;font-size:1.35rem;font-weight:900}
  .mk-mobile-task-card strong{font-size:1rem;line-height:1.18}.mk-mobile-task-card small{color:#999ba5;line-height:1.4;font-size:.78rem!important}
  .mk-task-dialog{width:100vw!important;height:100dvh!important;margin:0!important}
  .mk-task-dialog-shell{width:100%;height:100%;max-height:100%;overflow:auto;border-radius:0;border-left:0;border-right:0;padding-bottom:env(safe-area-inset-bottom,0px)}
  .mk-task-dialog-head{padding-top:max(14px,env(safe-area-inset-top,0px))}
  .mk-task-dialog-content{padding:16px 14px 28px}
  .mk-task-dialog-content .payroll-entry-form,
  .mk-task-dialog-content .payroll-month-card,
  .mk-task-dialog-content .invoice-settings-form,
  .mk-task-dialog-content .invoice-list-panel{margin:0!important;width:100%!important;max-width:none!important}
  .payroll-workspace.mk-taskified{display:block!important}
  .payroll-workspace.mk-taskified>.payroll-entry-form,
  .payroll-workspace.mk-taskified>.payroll-month-card{display:none!important}
  .invoice-admin-grid.mk-taskified>.invoice-settings-form,
  .invoice-admin-grid.mk-taskified>.invoice-list-panel{display:none!important}
}

/* App klienta — jeszcze wygodniejsze dotykanie i pełny brak zoomu pól. */
@media(max-width:760px){
  .app-topbar{position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;z-index:5000!important}
  .app-main{padding-top:calc(82px + var(--safe-top))!important}
  .icon-button,.avatar-button{width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important}
  .icon-button{font-size:1.5rem!important}.avatar-button{font-size:.86rem!important}
  .bottom-nav{height:calc(82px + var(--safe-bottom))!important;padding-top:9px!important}
  .bottom-nav button{min-height:58px!important}
  .bottom-nav button>span{font-size:1.55rem!important}
  .bottom-nav small{font-size:.68rem!important}
  .quick-card{min-height:108px!important;padding:16px!important}
  .quick-icon{width:46px!important;height:46px!important;font-size:1.28rem!important}
  .profile-link{min-height:64px!important}
}
