/* Randevu çizelgesi (AppointmentGrid.razor, docs/VET.md §18.28) — panel + Vet Ana Makinesi ortak.
   Renkler MudBlazor tema değişkenlerinden: açık/koyu tema kendiliğinden uyar; koda renk gömülmez. */
.pts-sg { --pts-sg-line: var(--mud-palette-lines-default); border: 1px solid var(--pts-sg-line); border-radius: 12px; overflow: hidden;
  background: var(--mud-palette-surface); }
.pts-sg-scroll { overflow: auto; max-height: calc(100dvh - 250px); min-height: 380px; overscroll-behavior: contain; }
/* Izgara içerik genişliğinde olmalı: ekran genişliğinde kalırsa yana kaydırınca yapışkan saat ekseni kutunun dışına taşamaz. */
.pts-sg-grid { display: grid; position: relative; width: max-content; min-width: 100%; }

.pts-sg-corner, .pts-sg-head { position: sticky; top: 0; z-index: 3; background: var(--mud-palette-surface);
  border-bottom: 1px solid var(--pts-sg-line); }
.pts-sg-corner { left: 0; z-index: 4; }
.pts-sg-head { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 6px 4px; min-height: 48px;
  border-left: 1px solid var(--pts-sg-line); text-align: center; line-height: 1.2; }
.pts-sg-head.is-link { cursor: pointer; }
.pts-sg-head.is-link:hover { background: var(--mud-palette-action-default-hover); }
.pts-sg-head-name { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--mud-palette-text-secondary); }
.pts-sg-head-date { font-weight: 600; }
.pts-sg-head.is-today { color: var(--mud-palette-primary); box-shadow: inset 0 -3px 0 var(--mud-palette-primary); }
.pts-sg-head.is-today .pts-sg-head-name { color: var(--mud-palette-primary); }
.pts-sg-head.is-closed { color: var(--mud-palette-text-disabled); }

.pts-sg-axis { position: sticky; left: 0; z-index: 2; background: var(--mud-palette-surface); border-right: 1px solid var(--pts-sg-line); }
.pts-sg-hour { position: absolute; right: 6px; transform: translateY(-50%); font-size: .72rem; color: var(--mud-palette-text-secondary);
  font-variant-numeric: tabular-nums; }
.pts-sg-hour:first-child { transform: none; top: 2px !important; }

.pts-sg-col { position: relative; border-left: 1px solid var(--pts-sg-line); }
.pts-sg-col.is-today { background: color-mix(in srgb, var(--mud-palette-primary) 4%, transparent); }
.pts-sg-slot { height: var(--pts-sg-row); box-sizing: border-box; }
.pts-sg-slot.is-hour { border-top: 1px solid var(--pts-sg-line); }
.pts-sg-slot.is-half { border-top: 1px dashed color-mix(in srgb, var(--pts-sg-line) 60%, transparent); }
.pts-sg-slot.is-closed { background: repeating-linear-gradient(135deg, var(--mud-palette-action-disabled-background) 0 6px, transparent 6px 12px); }
.pts-sg-slot.is-full { background-color: color-mix(in srgb, var(--mud-palette-text-primary) 7%, transparent); }
.pts-sg-slot.is-free { background: color-mix(in srgb, var(--mud-palette-success) 22%, transparent); }
.pts-sg-slot.is-link { cursor: pointer; }
.pts-sg-slot.is-link:hover { background: color-mix(in srgb, var(--mud-palette-primary) 14%, transparent); }
.pts-sg-slot.is-free.is-link:hover { background: color-mix(in srgb, var(--mud-palette-success) 40%, transparent); }

.pts-sg-block { position: absolute; z-index: 1; box-sizing: border-box; overflow: hidden; cursor: pointer; border-radius: 6px;
  padding: 2px 6px; font-size: .78rem; line-height: 1.25; color: var(--mud-palette-text-primary);
  --pts-sg-tone: var(--mud-palette-primary);
  background: color-mix(in srgb, var(--pts-sg-tone) 16%, var(--mud-palette-surface)); border-left: 4px solid var(--pts-sg-tone); }
.pts-sg-block:hover, .pts-sg-block:focus-visible { outline: 2px solid var(--pts-sg-tone); outline-offset: -1px; z-index: 2; }
.pts-sg-block.is-short { padding-top: 0; padding-bottom: 0; font-size: .72rem; line-height: 1.15; white-space: nowrap; }
.pts-sg-block.is-arrived { --pts-sg-tone: var(--mud-palette-success); }
.pts-sg-block.is-noshow { --pts-sg-tone: var(--mud-palette-warning); opacity: .7; }
.pts-sg-block.is-cancelled { --pts-sg-tone: var(--mud-palette-text-disabled); opacity: .6; text-decoration: line-through; }
.pts-sg-block.is-conflict { box-shadow: inset 0 0 0 2px var(--mud-palette-error); }
.pts-sg-block-line { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pts-sg-block-sub { color: var(--mud-palette-text-secondary); }

.pts-sg-now { position: absolute; left: 0; right: 0; height: 2px; background: var(--mud-palette-error); z-index: 2; pointer-events: none; }
.pts-sg-now::before { content: ""; position: absolute; left: -5px; top: -4px; width: 10px; height: 10px; border-radius: 50%;
  background: var(--mud-palette-error); }

/* Açıklama şeridi (renklerin anlamı) */
.pts-sg-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .78rem; color: var(--mud-palette-text-secondary); }
.pts-sg-legend span { display: inline-flex; align-items: center; gap: 6px; }
.pts-sg-legend i { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }
.pts-sg-legend .is-planned { background: color-mix(in srgb, var(--mud-palette-primary) 30%, var(--mud-palette-surface)); }
.pts-sg-legend .is-arrived { background: color-mix(in srgb, var(--mud-palette-success) 30%, var(--mud-palette-surface)); }
.pts-sg-legend .is-noshow { background: color-mix(in srgb, var(--mud-palette-warning) 30%, var(--mud-palette-surface)); }
.pts-sg-legend .is-conflict { box-shadow: inset 0 0 0 2px var(--mud-palette-error); }
.pts-sg-legend .is-full { background: color-mix(in srgb, var(--mud-palette-text-primary) 12%, transparent); }
.pts-sg-legend .is-closed { background: repeating-linear-gradient(135deg, var(--mud-palette-action-disabled-background) 0 4px, transparent 4px 8px);
  border: 1px solid var(--mud-palette-lines-default); }
.pts-sg-legend .is-free { background: color-mix(in srgb, var(--mud-palette-success) 35%, transparent); }

@media (max-width: 600px) {
  .pts-sg-scroll { max-height: calc(100dvh - 200px); }
  .pts-sg-block { padding: 1px 4px; }
}