/* IT-BALON.CZ v639 – schválený mobilní detail ticketu, návrh č. 2 */
.itb-ticket-mobile-overview-v639,
.itb-ticket-id-v639,
.itb-summary-icon-v639{
  display:none;
}

@media (max-width:900px){
  html body.unified-support-layout .itb-ticket-main-v347,
  html body.unified-support-layout .ticket-detail-page{
    background:#edf5fd!important;
  }

  /* Mobilní hlavička detailu zůstává sjednocená s hlavním portálem. */
  html body.unified-support-layout .itb-ticket-mobile-top-v634{
    display:block!important;
    padding:4px 7px 8px!important;
    background:#edf5fd!important;
  }
  html body.unified-support-layout .itb-ticket-appbar-v634{
    min-height:66px!important;
    border-radius:0 0 19px 19px!important;
    box-shadow:0 10px 24px rgba(7,31,72,.10)!important;
  }

  /* Hero – kompaktní, čitelný a bez druhé velké workflow sady. */
  html body.unified-support-layout .ticket-detail-page > .ticket-hero{
    margin:0!important;
    padding:22px 14px 24px!important;
    border-radius:0 0 25px 25px!important;
    min-height:auto!important;
    overflow:hidden!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-back{
    display:inline-flex!important;
    align-items:center!important;
    min-height:28px!important;
    margin:0 0 14px!important;
    font-size:13px!important;
    font-weight:800!important;
    color:#fff!important;
    opacity:.92!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-head{
    display:block!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-head > div:first-child{
    min-width:0!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .itb-ticket-id-v639{
    display:inline-flex!important;
    align-items:center!important;
    min-height:34px!important;
    padding:0 13px!important;
    margin:0 0 10px!important;
    border-radius:9px!important;
    background:rgba(9,105,255,.55)!important;
    border:1px solid rgba(255,255,255,.18)!important;
    color:#fff!important;
    font-size:13px!important;
    font-weight:900!important;
    letter-spacing:.01em!important;
    box-shadow:0 8px 18px rgba(1,24,63,.12)!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero h1{
    max-width:100%!important;
    margin:0 0 12px!important;
    font-size:clamp(27px,8vw,34px)!important;
    line-height:1.04!important;
    letter-spacing:-.035em!important;
    color:#fff!important;
    text-wrap:balance!important;
    overflow-wrap:anywhere!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .itb-ticket-title-prefix-v639{
    display:none!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-sub{
    display:block!important;
    margin:0!important;
    color:rgba(255,255,255,.93)!important;
    font-size:12.5px!important;
    line-height:1.5!important;
    font-weight:700!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-sub .itb-company-with-package{
    display:inline-flex!important;
    max-width:100%!important;
    color:#fff!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-sub .itb-package-response-note{
    display:inline!important;
    color:#ffd6df!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-hero-right-v469{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:14px 0 0!important;
    padding:0!important;
    text-align:left!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-client-logo-v469{
    display:none!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-badges{
    display:flex!important;
    flex-wrap:wrap!important;
    justify-content:flex-start!important;
    gap:8px!important;
    margin:0!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero .ticket-badges .badge{
    min-height:34px!important;
    padding:7px 12px!important;
    border-radius:10px!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:1.1!important;
  }
  html body.unified-support-layout .ticket-detail-page > .ticket-hero > .ticket-flow{
    display:none!important;
  }

  /* Schválený pětikrokový průběh – samostatná bílá karta. */
  html body.unified-support-layout .itb-ticket-mobile-overview-v639{
    display:block!important;
    margin:12px 10px 0!important;
    padding:0!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-stepper-v639{
    position:relative!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:0!important;
    min-height:116px!important;
    padding:18px 8px 14px!important;
    border:1px solid #dfe9f5!important;
    border-radius:22px!important;
    background:#fff!important;
    box-shadow:0 12px 26px rgba(15,44,87,.07)!important;
    overflow:hidden!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-stepper-v639::before{
    content:""!important;
    position:absolute!important;
    top:35px!important;
    left:12%!important;
    right:12%!important;
    height:2px!important;
    background:#d9e4f1!important;
    z-index:0!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-step-v639{
    position:relative!important;
    z-index:1!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    min-width:0!important;
    text-align:center!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-step-v639 > span{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:38px!important;
    height:38px!important;
    margin:0 auto 11px!important;
    border:1px solid #d8e4f2!important;
    border-radius:50%!important;
    background:#f4f8fc!important;
    color:#7e91ae!important;
    font-size:15px!important;
    font-weight:950!important;
    box-shadow:0 0 0 5px #fff!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-step-v639 > b{
    display:block!important;
    max-width:100%!important;
    padding:0 2px!important;
    color:#7285a2!important;
    font-size:9.5px!important;
    font-weight:900!important;
    line-height:1.15!important;
    overflow-wrap:anywhere!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-step-v639.done > span{
    background:#e9f9ef!important;
    border-color:#9fe3b3!important;
    color:#13a34a!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-step-v639.current > span{
    background:#0969ff!important;
    border-color:#0969ff!important;
    color:#fff!important;
    box-shadow:0 0 0 5px #fff,0 9px 20px rgba(9,105,255,.24)!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-step-v639.current > b{
    color:#075cd8!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-step-v639.cancelled > span{
    background:#fff0f0!important;
    border-color:#f2a3a3!important;
    color:#d52424!important;
  }

  /* Aktuální a následující krok – dva vyrovnané sloupce. */
  html body.unified-support-layout .itb-ticket-mobile-focus-v639{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    margin:12px 0 0!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    min-width:0!important;
    min-height:228px!important;
    padding:18px 12px 15px!important;
    border:1.5px solid #dbe7f4!important;
    border-radius:22px!important;
    background:#fff!important;
    text-align:center!important;
    box-shadow:0 13px 28px rgba(15,44,87,.07)!important;
    overflow:hidden!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639.current{
    border-color:#9cddb1!important;
    background:linear-gradient(180deg,#f6fff8 0%,#ecfbf1 100%)!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639.next{
    border-color:#cbdcf3!important;
    background:linear-gradient(180deg,#fff 0%,#f4f8ff 100%)!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-icon-v639{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:56px!important;
    height:56px!important;
    margin:0 0 12px!important;
    border-radius:50%!important;
    background:#11aa4d!important;
    color:#fff!important;
    font-size:25px!important;
    font-weight:900!important;
    box-shadow:0 10px 22px rgba(17,170,77,.20)!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639.next .itb-ticket-mobile-focus-icon-v639{
    background:#e7f0ff!important;
    color:#0969ff!important;
    box-shadow:none!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639 > small{
    display:block!important;
    margin:0 0 4px!important;
    color:#6b7f9f!important;
    font-size:10px!important;
    font-weight:850!important;
    letter-spacing:.02em!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639 > h2{
    margin:0 0 10px!important;
    color:#0d2348!important;
    font-size:19px!important;
    line-height:1.15!important;
    letter-spacing:-.02em!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639.current > h2{
    color:#087d36!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639 > p{
    margin:0!important;
    color:#506986!important;
    font-size:12px!important;
    line-height:1.45!important;
    text-wrap:balance!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639 > strong{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:31px!important;
    margin-top:auto!important;
    padding:6px 12px!important;
    border-radius:999px!important;
    background:#dfeaff!important;
    color:#075bcf!important;
    font-size:10.5px!important;
    font-weight:950!important;
    line-height:1.1!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639.current > strong{
    background:#d9f7e3!important;
    color:#078037!important;
  }

  /* KPI karty návrhu č. 2 – dva sloupce, vše přesně na střed. */
  html body.unified-support-layout .ticket-summary-strip-v466{
    margin:0!important;
    padding:12px 10px 16px!important;
    background:transparent!important;
  }
  html body.unified-support-layout .ticket-summary-grid-v466{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  html body.unified-support-layout .ticket-summary-grid-v466 .summary-card{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:0!important;
    min-height:135px!important;
    padding:15px 10px!important;
    border:1px solid #dce8f5!important;
    border-radius:20px!important;
    background:#fff!important;
    text-align:center!important;
    box-shadow:0 12px 25px rgba(15,44,87,.06)!important;
  }
  html body.unified-support-layout .ticket-summary-grid-v466 .summary-card:last-child{
    grid-column:1 / -1!important;
    min-height:108px!important;
  }
  html body.unified-support-layout .ticket-summary-grid-v466 .itb-summary-icon-v639{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:46px!important;
    height:46px!important;
    margin:0 0 10px!important;
    border-radius:15px!important;
    background:#eaf2ff!important;
    color:#0969ff!important;
    font-size:17px!important;
    font-weight:950!important;
    line-height:1!important;
  }
  html body.unified-support-layout .ticket-summary-grid-v466 .summary-card:nth-child(3) .itb-summary-icon-v639{
    background:#ebf9ef!important;
    color:#0b9a42!important;
  }
  html body.unified-support-layout .ticket-summary-grid-v466 .summary-card:nth-child(6) .itb-summary-icon-v639{
    background:#fff1e8!important;
    color:#f46a11!important;
  }
  html body.unified-support-layout .ticket-summary-grid-v466 .summary-card small{
    margin:0 0 5px!important;
    color:#7387a5!important;
    font-size:9.5px!important;
    font-weight:900!important;
    letter-spacing:.075em!important;
    line-height:1.2!important;
  }
  html body.unified-support-layout .ticket-summary-grid-v466 .summary-card strong{
    display:block!important;
    max-width:100%!important;
    margin:0 0 4px!important;
    color:#0c2348!important;
    font-size:15px!important;
    line-height:1.2!important;
    overflow-wrap:anywhere!important;
  }
  html body.unified-support-layout .ticket-summary-grid-v466 .summary-card span:not(.itb-summary-icon-v639){
    display:block!important;
    max-width:100%!important;
    color:#667c9c!important;
    font-size:10.5px!important;
    line-height:1.3!important;
    overflow-wrap:anywhere!important;
  }

  /* Obsah pod KPI pokračuje v jednom čistém sloupci. */
  html body.unified-support-layout .ticket-detail-page .ticket-main-grid{
    margin:0!important;
    padding:0 10px 24px!important;
    gap:12px!important;
  }
  html body.unified-support-layout .ticket-detail-page .ticket-card{
    border-radius:20px!important;
  }
}

@media (max-width:390px){
  html body.unified-support-layout .itb-ticket-mobile-stepper-v639{
    padding-left:3px!important;
    padding-right:3px!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-step-v639 > span{
    width:34px!important;
    height:34px!important;
    font-size:13px!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-step-v639 > b{
    font-size:8.6px!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639{
    min-height:220px!important;
    padding-left:9px!important;
    padding-right:9px!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639 > h2{
    font-size:17px!important;
  }
  html body.unified-support-layout .itb-ticket-mobile-focus-card-v639 > p{
    font-size:11px!important;
  }
}