/* ================= telefon ve tablet =================
 * En son yüklenir; masaüstü görünümüne dokunmaz.
 * Kırılımlar: 1180 (tablet yatay, menü katlanır) · 900 (tablet dikey) · 760 (telefon) · 420 (küçük telefon)
 */

/* Genel: yatay sayfa kaymasını engelle, ızgara öğeleri içerikle taşmasın */
html, body { overflow-x: hidden; }
@supports (overflow: clip) { html, body { overflow-x: clip; } }
.dash > *, .detail > *, .stats > *, .grid2 > *, .grid3 > * { min-width: 0; }
.tablewrap { -webkit-overflow-scrolling: touch; }
img, svg, video { max-width: 100%; }

/* ---------------------------------------------------------------- üst menü (Ticket) */
@media (max-width: 1180px) {
  .topbar { gap: 12px; padding: 0 16px; }
  .topbar .brand .t { display: none; }
  .topbar .brand { order: 0; }
  .topbar .modesw { order: 1; }
  .topbar .newbtn { order: 2; margin-left: auto; }
  .topbar .usermenu { order: 3; margin-left: 0; }
  /* tek menü öğesi varsa (personel) menü düğmesine gerek yok; logo zaten Taleplerim'e götürür */
  .topbar:has(.nav > a:only-child) .burger { display: none; }
  .burger { display: grid; place-items: center; order: 4; width: 42px; height: 42px; padding: 0; border-radius: 10px; margin-right: -6px; }
  .burger:hover, .burger:focus-visible { background: var(--dark-2); }
  .topbar:has(.nav.open) .burger { background: var(--yellow); color: var(--dark); }
  /* Menü: üst çubuğun altından açılan panel */
  .nav { display: none; position: absolute; top: 100%; left: 0; right: 0; margin-top: 3px; flex-direction: column; gap: 2px; padding: 10px; background: var(--dark); border-bottom: 3px solid var(--yellow); box-shadow: 0 18px 40px rgba(0,0,0,.35); max-height: calc(100vh - 70px); max-height: calc(100dvh - 70px); overflow-y: auto; }
  .nav.open { display: flex; animation: navdown .16s ease-out; }
  .nav a, .nav a span, .nav a.on span { display: flex; }
  .nav a { align-items: center; gap: 12px; padding: 12px 14px; min-height: 46px; font-size: 15px; border-radius: 10px; }
  .nav a .ic { width: 20px; height: 20px; }
  .newbtn span { display: inline; }
}
@keyframes navdown { from { opacity: 0; transform: translateY(-6px); } }
@media (min-width: 761px) and (max-width: 1180px) {
  .nav { display: none; left: auto; right: 12px; width: 300px; border: 1px solid #3a3a35; border-top: 0; border-radius: 0 0 14px 14px; }
  .nav.open { display: flex; }
}
@media (max-width: 760px) {
  .topbar { height: 58px; gap: 8px; padding: 0 12px; }
  .topbar .brand img { height: 24px; }
  .topbar .modesw { padding: 2px; }
  .topbar .modesw a { padding: 6px 8px; }
  .newbtn span { display: none; }
  .newbtn { width: 40px; height: 40px; padding: 0; }
  .usermenu > button { padding: 3px; }
  .usermenu .menu { position: fixed; top: 64px; right: 10px; left: auto; min-width: 240px; }
  .usermenu .menu a, .usermenu .menu button { padding: 12px 10px; }
}
@media (max-width: 360px) {
  .topbar .brand img { height: 20px; }
  .topbar { gap: 6px; padding: 0 8px; }
}

/* ---------------------------------------------------------------- dokunmatik ekranlar */
@media (pointer: coarse) {
  .btn { min-height: 42px; }
  .btn.sm { min-height: 36px; padding: 6px 12px; }
  .tabs button { padding: 12px 12px 12px; }
  .jbtn { height: 38px; }
  .jbtn.sm { height: 34px; }
  .linkbtn { padding: 6px 0; }
  .modal .box header button { width: 44px; height: 44px; margin: -10px -12px -10px 0; }
}
@media (max-width: 760px) {
  /* iOS, 16 pikselden küçük yazılı alana dokununca ekranı büyütür; büyümesin */
  input:not([type=checkbox]):not([type=radio]), select, textarea { font-size: 16px !important; }
  .code-input { font-size: 26px !important; letter-spacing: 9px; }
}

/* ---------------------------------------------------------------- sayfa başlığı, sekmeler, araç çubuğu */
@media (max-width: 760px) {
  .pagehead { align-items: stretch; gap: 12px; margin-bottom: 14px; }
  .pagehead h1 { font-size: 22px; }
  .pagehead > .row, .pagehead > div:last-child:not(:first-child) { width: 100%; }
  .pagehead .btn { flex: 1 1 auto; }
  .tabs { padding: 4px 6px 0; scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .toolbar { padding: 12px; }
  .toolbar select, .toolbar input[type=date] { min-width: 0; }
  .toolbar.adv .datef { flex: 1 1 45%; }
  .toolbar.adv .datef input { flex: 1; min-width: 0; }
  .card.pad, .card > .pad { padding: 16px; }
  .settings-nav { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 6px; margin: 0 -14px 14px; padding: 0 14px 4px; scrollbar-width: none; }
  .settings-nav::-webkit-scrollbar { display: none; }
  .settings-nav button { flex: 0 0 auto; white-space: nowrap; }
}

/* ---------------------------------------------------------------- talep listesi: tablet ve telefonda kart görünümü */
@media (min-width: 901px) and (max-width: 1180px) {
  table.tl td.c-title { min-width: 240px; }
  table.tl th:nth-child(9), table.tl td:nth-child(9) { display: none; }
}
@media (min-width: 901px) and (max-width: 1100px) {
  table.tl th:nth-child(8), table.tl td:nth-child(8) { display: none; }
}
@media (max-width: 900px) {
  table.tl thead { display: none; }
  table.tl, table.tl tbody { display: block; }
  table.tl tr { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "no status" "title title" "app cat"; gap: 6px 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
  table.tl tr:last-child { border-bottom: 0; }
  table.tl td { padding: 0; border: 0 !important; }
  table.tl td.hide-sm { display: none; }
  table.tl .c-no { grid-area: no; align-self: center; } table.tl .c-status { grid-area: status; justify-self: end; }
  table.tl .c-title { grid-area: title; } table.tl .c-title .ttitle { font-size: 15px; }
  table.tl .c-app { grid-area: app; align-self: center; } table.tl .c-cat { grid-area: cat; justify-self: end; }
  table.tl .c-cat select { max-width: 190px; }
}

/* panel: son açık talepler */
@media (max-width: 760px) {
  table.trecent, table.trecent tbody { display: block; }
  table.trecent tr { display: grid; grid-template-columns: 1fr auto; gap: 6px 10px; padding: 12px 14px; border-bottom: 1px solid var(--line); }
  table.trecent td { padding: 0; border: 0 !important; }
  table.trecent td:nth-child(1) { grid-column: 1; grid-row: 1; align-self: center; }
  table.trecent td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  table.trecent td:nth-child(3) { grid-column: 1; grid-row: 3; }
  table.trecent td:nth-child(n+4) { grid-column: 2; grid-row: 1; justify-self: end; }
  table.trecent td:nth-child(n+5) { grid-row: 3; }
  .bar { grid-template-columns: 92px minmax(0, 1fr) auto; gap: 8px; }
  .bar .num { white-space: nowrap; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}

/* kullanıcılar */
@media (max-width: 760px) {
  table.tu thead { display: none; }
  table.tu, table.tu tbody { display: block; }
  table.tu tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
  table.tu td { padding: 0; border: 0 !important; min-width: 0; }
  table.tu td.hide-sm { display: none; }
  table.tu td:first-child { grid-column: 1 / -1; }
  table.tu td:first-child .row > div { min-width: 0; }
  table.tu .tsub { overflow-wrap: anywhere; }
  table.tu td:last-child { justify-self: end; }
}

/* uygulamalar */
@media (max-width: 760px) {
  table.ta thead { display: none; }
  table.ta, table.ta tbody { display: block; }
  table.ta tr { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
  table.ta td { padding: 0; border: 0 !important; min-width: 0; }
  table.ta td.hide-sm, table.ta td:nth-child(1), table.ta td:nth-child(5) { display: none; }
  table.ta td:nth-child(2) { grid-column: 1 / -1; }
  table.ta td:nth-child(6) { grid-column: 1; }
  table.ta td:last-child { grid-column: 3; }
}

/* diğer tablolar: yatay kaydırılır, başlık sütunu tek kelimelik satırlara bölünmez */
@media (max-width: 900px) {
  .tablewrap table.t:not(.tl):not(.trecent):not(.tu) .ttitle { min-width: 180px; }
  .tablewrap table.rptable td:first-child { min-width: 200px; }
  .tablewrap { position: relative; }
  .jtablewrap { -webkit-overflow-scrolling: touch; }
  .jtablewrap .jtable .jsum { min-width: 200px; }
  .jtablewrap .jtable td { white-space: nowrap; }
  .jtablewrap .jtable td:has(.jsum) { white-space: normal; }
}

/* ---------------------------------------------------------------- talep detayı */
@media (max-width: 960px) {
  .detail { gap: 14px; }
}
@media (max-width: 760px) {
  .stepper { padding: 12px 10px; margin-left: -2px; margin-right: -2px; scroll-snap-type: x proximity; }
  .step { min-width: 76px; scroll-snap-align: center; }
  .detail .desc { font-size: 15px; }
  .filelist, .thumbs { gap: 8px; }
}

/* ---------------------------------------------------------------- pencereler (modal): telefonda alttan açılan tam genişlik */
@media (max-width: 760px) {
  .modal { padding: 0; place-items: end stretch; }
  .modal .box { max-width: none !important; width: 100%; max-height: 92vh; max-height: 92dvh; border-radius: 16px 16px 0 0; animation: sheetup .2s ease-out; display: flex; flex-direction: column; }
  .modal .box > form { display: flex; flex-direction: column; min-height: 0; flex: 1; }
  .modal .box header { position: sticky; top: 0; background: #fff; z-index: 2; padding: 12px 16px; }
  .modal .box .bd { padding: 16px; overflow-y: auto; flex: 1; -webkit-overflow-scrolling: touch; }
  .modal .box footer { position: sticky; bottom: 0; background: #fff; z-index: 2; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
  .modal .box footer .btn { flex: 1; }
  .modal.jsendm .box, .modal.jmodal .box { max-height: 100vh; max-height: 100dvh; height: 100dvh; border-radius: 0; }
}
@keyframes sheetup { from { transform: translateY(40px); opacity: 0; } }

/* ---------------------------------------------------------------- Jira bölümü */
@media (max-width: 860px) {
  .jtop { gap: 8px; padding: 0 10px; }
  .jburger { width: 40px; height: 40px; display: grid; place-items: center; }
  .jside { width: min(300px, 86vw); }
  .jside a { padding: 11px 12px; }
  .jbody:has(.jside.open)::after { content: ""; position: fixed; inset: 56px 0 0; background: rgba(9,30,66,.35); z-index: 35; }
}
@media (max-width: 600px) {
  .jlogo span { display: none; }
  .jtop-r { gap: 2px; }
  .jtop-r a.jbtn { display: none; }
  .jtop .modesw a { padding: 6px 9px; }
  .jhead { flex-wrap: wrap; gap: 10px; }
  .jhead h1 { font-size: 22px; }
  /* iş satırları: özet ikinci satıra iner, kesilmez */
  .jrow { flex-wrap: wrap; row-gap: 4px; padding: 10px 14px; }
  .jrow .jsum { order: 9; flex: 1 1 100%; white-space: normal; }
  .jrow .lz { margin-left: auto; }
  .jkpis { gap: 8px; }
  .jl-row { grid-template-columns: 26px minmax(0, 1fr) 70px 24px; }
  .jbar { gap: 8px; }
  .jbar select { flex: 1 1 100%; }
}
/* pano: sütunlar parmakla kaydırılır, kart sütun başına oturur */
@media (max-width: 900px) {
  .jcols { scroll-snap-type: x mandatory; scroll-padding: 0 16px; margin: 0 -16px; padding: 0 16px 10px; -webkit-overflow-scrolling: touch; min-height: 0; }
  .jcol { scroll-snap-align: start; max-height: none; }
  .jcol-body { overflow: visible; }
  .javgroup { margin-left: 6px; }
}
@media (min-width: 601px) and (max-width: 900px) { .jcol { flex-basis: 300px; } }
@media (max-width: 600px) { .jcol { flex-basis: calc(100vw - 56px); } }
/* iş detayı paneli: telefonda tam ekran */
@media (max-width: 760px) {
  .jd { width: 100%; }
  .jd-head { padding: 10px 12px; gap: 8px; }
  .jd-head { flex-wrap: nowrap; }
  .jd-head .jcrumbs { flex: 1; min-width: 0; flex-wrap: nowrap; overflow: hidden; white-space: nowrap; }
  .jd-head .jcrumbs > span:nth-of-type(2), .jd-head .jcrumbs > span:nth-of-type(3) { display: none; }
  .jd-head > .row { flex-shrink: 0; flex-wrap: nowrap; }
  .jd-body h2 { font-size: 19px; }
}
/* Jira'ya gönder penceresi */
@media (max-width: 760px) {
  .jsend-head { padding: 10px 12px; }
  .jsend-head span { font-size: 12px; }
  .jsend { gap: 14px; }
  .jsend-side { padding: 12px; }
  .jfield { grid-template-columns: 1fr !important; gap: 4px; }
  .jquick { flex-wrap: wrap; }
  .jatts { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
  .jsub-f { grid-template-columns: 1fr 1fr; }
  .jpick-pop { max-width: calc(100vw - 40px); }
  .modal .bd select, .jsend-side select { width: 100%; }
  .jstatusck { display: block; line-height: 1.5; }
  .jstatusck > input { vertical-align: -2px; margin: 0 8px 0 0; }
}
@media (max-width: 420px) {
  .jsub-f { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------- raporlar ve analiz */
@media (max-width: 760px) {
  .rpk b { font-size: 22px; }
  .matrix th, .matrix td { padding: 8px 10px; }
}

/* ---------------------------------------------------------------- giriş */
@media (max-width: 760px) {
  .auth-brand { padding-bottom: 110px; }
  .auth-form { padding: 24px 16px 40px; }
}

/* açıklamalı onay kutuları: metin kutunun yanında akar, sütunlara bölünmez */
@media (max-width: 760px) {
  label.check:has(> small) { display: block; line-height: 1.5; }
  label.check:has(> small) > input { margin: 0 8px 0 0; vertical-align: -2px; }
  label.check:has(> small) > small { display: block; margin: 2px 0 0 24px; }
  .rp-preset { flex: 1 1 100%; }
}

/* altbilgi */
@media (max-width: 760px) {
  .foot { padding: 0 14px 24px; }
}
