/* Weekly note page (/haftalik). Frame and tokens come from style.css and telefon.css; this page is wider for its tables. */
.hk .tel-ust-ic, .hk .tel-kap { max-width: 880px; }
.hk-simge { font-size: 15px; color: var(--vurgu); }
.hk .tel-giris-metin { max-width: 62ch; }
.hk-haftalar { display: grid; gap: 14px; margin-top: 18px; min-width: 0; }

/* one week */
.hk-hafta { min-width: 0; border-radius: calc(var(--kart-r) + 4px); background: var(--yuzey); border: 1px solid var(--cizgi);
  box-shadow: 0 1px 2px rgba(20, 30, 50, .05), 0 10px 30px -14px rgba(20, 30, 50, .16); overflow: hidden; }
.hk-hafta summary { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; padding: 14px 44px 14px 18px; position: relative; cursor: pointer; list-style: none;
  -webkit-tap-highlight-color: transparent; }
.hk-hafta summary::-webkit-details-marker { display: none; }
.hk-hafta summary:focus-visible { outline: 2px solid var(--vurgu); outline-offset: -2px; border-radius: calc(var(--kart-r) + 4px); }
.hk-hafta-ad { font: 600 15px/1.3 var(--mono); letter-spacing: -.01em; }
.hk-hafta-aralik { flex-basis: 100%; font-size: 13px; color: var(--metin-2); overflow-wrap: anywhere; }
.hk-ok { position: absolute; right: 16px; top: 16px; font-size: 16px; color: var(--soluk); transition: transform .18s var(--kolay); }
.hk-hafta[open] .hk-ok { transform: rotate(180deg); }
.hk-govde { display: grid; gap: 12px; min-width: 0; padding: 0 12px 12px; }

/* one block */
.tel .hk-blok { min-width: 0; padding: 16px; border-radius: var(--kart-r); background: var(--yuzey-2); border: 1px solid var(--cizgi-2); }
.hk-blok h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 16px; font-weight: 620; letter-spacing: -.01em; }
.hk-blok-ik { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; font-size: 16px; color: #fff;
  background: linear-gradient(160deg, color-mix(in srgb, var(--vurgu) 78%, #fff), var(--vurgu)); }
.hk-blok p { margin: 12px 0 8px; font-size: 13.5px; color: var(--metin-2); max-width: 74ch; overflow-wrap: anywhere; }
.hk-blok p b, .hk-blok li b { color: var(--metin); font-weight: 600; }
.hk-blok h3 + p { margin-top: 0; }
.hk-blok ul { margin: 8px 0; padding-left: 18px; font-size: 13.5px; color: var(--metin-2); overflow-wrap: anywhere; }
.hk-blok li + li { margin-top: 4px; }
.hk-blok code, .hk-bos code { font: 500 12.5px var(--mono); overflow-wrap: anywhere; }

/* tables scroll inside the card on a phone, the page itself never does */
.hk-tablo { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--cizgi); border-radius: 11px; background: var(--yuzey); }
.hk-tablo:focus-visible { outline: 2px solid var(--vurgu); outline-offset: 1px; }
.hk-tablo table { width: 100%; border-collapse: collapse; font-size: 13px; }
.hk-tablo th { text-align: left; font-size: 11.5px; font-weight: 600; color: var(--soluk); padding: 8px 12px; white-space: nowrap; background: var(--yuzey-2); border-bottom: 1px solid var(--cizgi); }
.hk-tablo td { padding: 8px 12px; font-variant-numeric: tabular-nums; border-top: 1px solid var(--cizgi-2); min-width: 92px; }
.hk-tablo tbody tr:first-child td { border-top: 0; }
.hk-tablo td:first-child { color: var(--metin); font-weight: 500; }
.hk-tablo td:not(:first-child) { font-family: var(--mono); font-size: 12.5px; color: var(--metin-2); }
.hk-yok { display: inline-block; padding: 0 7px; border-radius: 999px; font-family: var(--sans); font-size: 11.5px; font-weight: 550; line-height: 1.6; white-space: nowrap;
  color: var(--soluk); background: var(--yuzey-2); border: 1px dashed var(--cizgi); }
.hk-suruyor { display: inline-block; padding: 0 7px; border-radius: 999px; font-family: var(--sans); font-size: 11.5px; font-weight: 600; line-height: 1.6;
  color: var(--kotu); background: var(--kotu-zemin); }

.hk-bos { display: grid; justify-items: center; gap: 6px; padding: 32px 18px; text-align: center; border-radius: var(--kart-r); background: var(--yuzey); border: 1px solid var(--cizgi); color: var(--metin-2); font-size: 13.5px; }
.hk-bos i { font-size: 26px; color: var(--soluk); }
.hk-bos b { color: var(--metin); }

@media (max-width: 560px) {
  .hk-govde { padding: 0 8px 8px; }
  .tel .hk-blok { padding: 13px; }
  .hk-tablo th, .hk-tablo td { padding: 7px 10px; }
}
@media (prefers-reduced-motion: reduce) { .hk-ok { transition: none; } }