/* Studio360 v2 — mobilna UI zakrpa: navigacija, modal prozori i prijava.
   Ne dira bazu ni poslovnu logiku. Učitava se zadnja da pregazi stare konflikte. */
:root{
  --mobile-topbar-h:var(--v2-topbar,56px);
  --mobile-safe-bottom:env(safe-area-inset-bottom,0px);
}
html,body{max-width:100%;overflow-x:hidden;}
body.guest,body.login-page{padding-top:0!important;min-height:100svh;}
body.guest .app,body.login-page .app{min-height:100svh;}
body.guest .main.full,body.login-page .main.full{min-height:100svh!important;margin:0!important;padding:0!important;display:grid!important;place-items:center!important;width:100%!important;}

/* Lijep i centriran login */
.login-wrap{
  min-height:100svh!important;width:100%!important;display:grid!important;place-items:center!important;
  padding:24px!important;position:relative;overflow:hidden;
  background:radial-gradient(circle at 18% 12%,rgba(210,165,68,.28),transparent 34%),radial-gradient(circle at 82% 18%,rgba(17,18,20,.15),transparent 28%),linear-gradient(135deg,#fff8eb,#eee4d5 58%,#f8f0e1);
}
.login-wrap:before{content:'';position:absolute;inset:auto auto -130px -90px;width:310px;height:310px;border-radius:999px;background:linear-gradient(135deg,rgba(17,18,20,.12),rgba(210,165,68,.25));filter:blur(2px);}
.login-wrap:after{content:'360';position:absolute;right:-34px;top:8%;font-size:150px;font-weight:950;letter-spacing:-.08em;color:rgba(17,18,20,.045);line-height:1;pointer-events:none;}
.login-card{position:relative;z-index:1;width:min(430px,calc(100vw - 28px))!important;border-radius:30px!important;padding:28px!important;background:rgba(255,253,248,.92)!important;backdrop-filter:blur(18px);box-shadow:0 30px 90px rgba(30,22,10,.22)!important;}
.login-card .brand.center{margin-bottom:22px!important;}
.login-card .brand-mark,.login-card .brand-logo{width:58px!important;height:58px!important;border-radius:20px!important;box-shadow:0 12px 28px rgba(0,0,0,.10);}
.login-card input{min-height:48px;}
.login-card .btn{width:100%;min-height:48px;border-radius:16px;}
@media(max-width:480px){.login-wrap{padding:14px!important}.login-card{padding:22px!important;border-radius:24px!important}.login-wrap:after{font-size:105px;right:-20px;top:5%}}

/* Gornja traka i navigacija na mobitelu */
@media(max-width:1200px){
  body:not(.guest):not(.login-page){padding-top:var(--mobile-topbar-h)!important;}
  .mobile-topbar{height:var(--mobile-topbar-h)!important;min-height:var(--mobile-topbar-h)!important;padding:7px 10px!important;z-index:1200!important;}
  .menu-toggle,.mobile-user-action{width:42px!important;height:42px!important;flex:0 0 42px!important;border-radius:14px!important;}
  .mobile-brand img{width:32px!important;height:32px!important;}
  .mobile-brand strong{font-size:13.5px!important;max-width:calc(100vw - 150px)!important;}
  .menu-overlay{top:var(--mobile-topbar-h)!important;z-index:1000!important;}
  .sidebar{top:var(--mobile-topbar-h)!important;height:calc(100dvh - var(--mobile-topbar-h))!important;z-index:1100!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;}
  .sidebar-scroll{flex:1 1 auto!important;overflow-y:auto!important;overflow-x:hidden!important;min-height:0!important;padding-bottom:18px!important;-webkit-overflow-scrolling:touch;}
  .main{padding:8px 12px 24px!important;margin-left:0!important;max-width:100vw!important;overflow-x:hidden!important;}
  .context-bar{position:static!important;top:auto!important;margin:0 0 10px!important;padding:0!important;background:transparent!important;backdrop-filter:none!important;gap:8px!important;align-items:center!important;}
  .context-back{min-height:38px!important;padding:8px 10px!important;border-radius:13px!important;font-size:12.5px!important;box-shadow:0 8px 20px rgba(0,0,0,.10)!important;}
  .context-back svg{width:16px!important;height:16px!important;}
  .breadcrumbs{min-height:38px!important;padding:8px 10px!important;border-radius:13px!important;font-size:12.5px!important;}
  .page-head{margin-bottom:12px!important;gap:8px!important;}
  .page-head h1{font-size:24px!important;line-height:1.1!important;}
  .card{border-radius:18px!important;padding:13px!important;margin-bottom:12px!important;}
}

/* Donja traka: stalne brze akcije na mobilnom, bez prekrivanja formi */
.mobile-bottom-actions{display:none!important;}
@media(max-width:900px){
  body.logged-in:not(.guest):not(.login-page){padding-bottom:calc(72px + var(--mobile-safe-bottom))!important;}
  body.logged-in .mobile-bottom-actions{
    display:grid!important;
    grid-template-columns:repeat(4,1fr)!important;
    left:12px!important;
    right:12px!important;
    bottom:calc(9px + var(--mobile-safe-bottom))!important;
    padding:6px!important;
    border-radius:18px!important;
    z-index:1850!important;
  }
  body.logged-in .mobile-bottom-actions a{min-height:44px!important;font-size:10.5px!important;border-radius:13px!important;}
  body.logged-in .mobile-bottom-actions svg{width:17px!important;height:17px!important;}
  body[data-action="new"] .mobile-bottom-actions,
  body[data-action="edit"] .mobile-bottom-actions,
  body[data-action="print"] .mobile-bottom-actions,
  body[data-action="view"] .mobile-bottom-actions,
  body[data-action="calculator"] .mobile-bottom-actions,
  body.menu-open .mobile-bottom-actions,
  body.modal-open .mobile-bottom-actions,
  body.form-focus .mobile-bottom-actions{display:none!important;}
}

/* Modal prozori: na mobitelu full-screen da se vide X, Odustani i Sačuvaj */
.modal{z-index:3000!important;}
.modal-card{display:flex!important;flex-direction:column!important;min-height:0!important;}
.modal-card .page-head.compact{position:sticky!important;top:0!important;z-index:5!important;background:rgba(255,253,248,.96)!important;backdrop-filter:blur(12px);padding:4px 0 10px!important;margin:0 0 10px!important;border-bottom:1px solid rgba(231,220,203,.7);}
.modal-card .page-head.compact .btn.small{min-width:42px!important;min-height:42px!important;border-radius:14px!important;font-size:20px!important;line-height:1!important;}
.modal-card form{min-height:0!important;}
.modal-card .actions:last-child,.modal-card .wide.actions:last-child{position:sticky!important;bottom:0!important;z-index:8!important;background:linear-gradient(180deg,rgba(255,253,248,.78),rgba(255,253,248,.98) 26%)!important;border-top:1px solid rgba(231,220,203,.85)!important;margin:8px -2px -2px!important;padding:12px 2px calc(12px + var(--mobile-safe-bottom))!important;border-radius:0 0 18px 18px!important;}
@media(max-width:760px){
  .modal{inset:0!important;display:block!important;padding:0!important;background:rgba(17,18,20,.58)!important;}
  .modal[hidden]{display:none!important;}
  .modal-card{width:100vw!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important;padding:14px!important;overflow-y:auto!important;overflow-x:hidden!important;background:#fffdf8!important;box-shadow:none!important;}
  .modal-card .page-head.compact{margin-left:-14px!important;margin-right:-14px!important;padding:8px 14px 10px!important;}
  .modal-card .page-head.compact h2{font-size:20px!important;margin:0!important;}
  .modal-card .page-head.compact p{font-size:13px!important;margin-top:4px!important;}
  .modal-card .grid-form{display:grid!important;grid-template-columns:1fr!important;gap:11px!important;}
  .modal-card input,.modal-card select,.modal-card textarea{min-height:46px!important;font-size:16px!important;}
  .modal-card .actions:last-child,.modal-card .wide.actions:last-child{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;margin-left:-14px!important;margin-right:-14px!important;margin-bottom:-14px!important;padding:12px 14px calc(14px + var(--mobile-safe-bottom))!important;border-radius:0!important;}
  .modal-card .actions:last-child .btn,.modal-card .wide.actions:last-child .btn{width:100%!important;min-height:46px!important;}
}

/* Račun na mobitelu: kontrole i stavke ne izlaze van ekrana */
@media(max-width:760px){
  .wizard-steps{position:sticky!important;top:0!important;z-index:30!important;background:rgba(245,239,230,.94)!important;backdrop-filter:blur(10px);padding:6px 0!important;margin:0 0 10px!important;overflow-x:auto!important;display:flex!important;gap:6px!important;}
  .wizard-steps button{flex:0 0 auto!important;min-height:38px!important;padding:8px 10px!important;border-radius:12px!important;font-size:12px!important;}
  .wizard-step .actions,.wizard-step .sticky-actions{position:sticky!important;bottom:0!important;z-index:35!important;background:linear-gradient(180deg,rgba(255,253,248,.72),rgba(255,253,248,.98) 24%)!important;padding:10px 0 calc(10px + var(--mobile-safe-bottom))!important;margin-top:12px!important;border-top:1px solid rgba(231,220,203,.9)!important;display:grid!important;grid-template-columns:1fr!important;gap:8px!important;}
  .wizard-step .actions .btn,.wizard-step .sticky-actions .btn{width:100%!important;min-height:46px!important;}
  #itemsTable tr{padding:10px!important;border-radius:16px!important;}
  #itemsTable td{padding:6px 0!important;}
  #itemsTable input,#itemsTable select{font-size:16px!important;}
  .quick-add-services{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;}
  .quick-add-services .btn{width:100%!important;min-height:44px!important;}
}

/* Manji ekrani: bez rezanja sadržaja */
@media(max-width:430px){
  .main{padding-left:10px!important;padding-right:10px!important;}
  .breadcrumbs{max-width:calc(100vw - 88px)!important;}
  .context-back{flex:0 0 auto!important;}
  .context-back span{display:none!important;}
  .btn{white-space:normal!important;line-height:1.2!important;}
}
