/* Leave Planner team grid (Absentify-style): one row per person, one column per day. */
.leave-grid { border-collapse: separate; border-spacing: 0; width: 100%; min-width: 900px; font-size: 12px; }
.leave-grid th, .leave-grid td { border-bottom: 1px solid #e2e8f0; height: 44px; }
.leave-grid thead th { position: sticky; top: 0; background: #fff; z-index: 2; text-align: center; padding: 4px 0; color: #475569; font-weight: 600; }
.leave-grid-day { min-width: 30px; }
.leave-grid-day.is-weekend, .leave-grid-cell.is-weekend { background: #f1f5f9; }
.leave-grid-day.is-today { color: #1d4ed8; box-shadow: inset 0 -2px 0 #2563eb; }
.leave-grid-dow { display: block; font-size: 10px; font-weight: 500; color: #64748b; }
.leave-grid-num { display: block; }
.leave-grid-person { position: sticky; left: 0; z-index: 1; background: #fff; text-align: left; padding: 6px 10px; min-width: 210px; border-right: 1px solid #e2e8f0; }
thead .leave-grid-person { z-index: 3; }
.leave-grid-name { display: block; color: #0f172a; font-size: 13px; }
.leave-grid-sub { display: block; color: #64748b; font-size: 11px; font-weight: 400; }
.leave-grid-balance { display: flex; align-items: center; gap: 6px; margin-top: 3px; font-size: 11px; color: #475569; font-weight: 500; }
.leave-grid-balance.is-low { color: #b45309; font-weight: 700; }
.leave-grid-balance.is-hidden { font-style: italic; color: #94a3b8; }
.leave-grid-bar { width: 60px; height: 6px; border-radius: 4px; background: #e2e8f0; overflow: hidden; flex: none; }
.leave-grid-bar-fill { display: block; height: 100%; background: #2f9e5f; }
.leave-grid-cell { padding: 0 1px; text-align: center; }
.leave-grid-cell.is-today { box-shadow: inset 2px 0 0 #2563eb, inset -2px 0 0 #2563eb; }
.leave-grid-chip { display: block; width: calc(100% - 2px); margin: 6px 0 0; height: 26px; border: 0; border-radius: 5px; color: #fff; font: inherit; font-size: 10px; font-weight: 700; cursor: pointer; padding: 0 2px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.leave-grid-chip.is-annual { background: #2f9e5f; }
.leave-grid-chip.is-sick { background: #d9534f; }
.leave-grid-chip.is-other { background: #8a5cf6; }
.leave-grid-chip.is-pending { background: repeating-linear-gradient(45deg, #f0ad4e 0 5px, #f7c26b 5px 10px); color: #5b3b00; }
.leave-grid-chip.is-cancelled, .leave-grid-chip.is-rejected { background: #e2e8f0; color: #475569; text-decoration: line-through; }
.leave-grid-chip:focus-visible { outline: 3px solid #93c5fd; outline-offset: 1px; }
.leave-view-toggle { display: inline-flex; gap: 0; margin-right: 8px; }
.leave-view-toggle button { border-radius: 0; }
.leave-view-toggle button:first-child { border-radius: 6px 0 0 6px; }
.leave-view-toggle button:last-child { border-radius: 0 6px 6px 0; }
.leave-view-toggle button[aria-pressed="true"] { background: #1f5eff; border-color: #1f5eff; color: #fff; }
.leave-grid-week { min-width: 720px; }
.leave-grid-week .leave-grid-day { min-width: 90px; }
.leave-grid-week .leave-grid-chip { height: 32px; font-size: 11px; }

/* Sidebar: Configuration & Others group (collapsible). */
.nav-group { margin-top: 6px; }
.nav-group-title { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 9px 12px; color: #64748b; font-size: 13px; font-weight: 600; border-radius: 8px; user-select: none; }
.nav-group-title::-webkit-details-marker { display: none; }
.nav-group-title::after { content: "▾"; margin-left: auto; font-size: 11px; transition: transform .15s ease; }
.nav-group:not([open]) .nav-group-title::after { transform: rotate(-90deg); }
.nav-group-title:focus-visible { outline: 3px solid #93c5fd; outline-offset: 1px; }
.nav-group-items { padding-left: 8px; }
.nav-group-items .nav-item { padding-left: 14px; }

/* Responsive: the grid scrolls inside its own panel on tablet/mobile instead of pushing the page wider. */
.leave-grid-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; max-width: 100%; }
.leave-grid-scroll:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }
#leave-planner-calendar.leave-calendar { display: block; }
.leave-grid thead th.leave-grid-person, .leave-grid td.leave-grid-person, .leave-grid th.leave-grid-person { min-width: 180px; }
@media (max-width: 1080px) {
  .leave-grid-person { min-width: 170px; }
}
@media (max-width: 700px) {
  .leave-grid { min-width: 760px; font-size: 11px; }
  .leave-grid-person { min-width: 150px; max-width: 170px; padding: 6px 8px; }
  .leave-grid-name { font-size: 12px; }
  .leave-grid-sub { font-size: 10px; }
  .leave-grid-day { min-width: 26px; }
  .leave-grid-week { min-width: 680px; }
  .leave-grid-week .leave-grid-day { min-width: 80px; }
  .leave-grid-chip { height: 24px; font-size: 9px; }
  .leave-view-toggle { margin-right: 4px; }
  .leave-view-toggle button { padding: 6px 8px; font-size: 12px; }
  .planner-controls { flex-wrap: wrap; justify-content: flex-start; }
  .leave-grid-scroll::after { content: "Scroll sideways →"; display: block; text-align: center; font-size: 11px; color: #64748b; padding: 6px; }
}

/* Accordion panels (collapsed by default): Recorded segments and Your leave requests. */
.accordion-panel > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.accordion-panel > summary::-webkit-details-marker { display: none; }
.accordion-summary { display: flex; }
.accordion-summary h3 { margin: 0; }
.accordion-chevron { font-size: 14px; color: #64748b; transition: transform .15s ease; flex: none; }
.accordion-panel:not([open]) > .accordion-summary .accordion-chevron { transform: rotate(-90deg); }
.accordion-panel:not([open]) > :not(summary) { display: none; }
.accordion-summary:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; border-radius: 8px; }

/* Overview: My performance panel (efficiency, hours, record completeness with Daily/Weekly/Monthly selectors). */
.productivity-panel { margin-top: 16px; }
.productivity-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.productivity-card { border: 1px solid #e2e8f0; border-radius: 10px; padding: 12px 14px; background: #fff; display: grid; gap: 6px; min-width: 0; }
.productivity-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.productivity-range { width: auto; min-width: 110px; padding: 4px 8px; font-size: 12px; }
.productivity-value { margin: 0; font-size: 24px; font-weight: 700; color: #0f172a; }
.productivity-card small { overflow-wrap: anywhere; line-height: 1.4; }
@media (max-width: 860px) { .productivity-grid { grid-template-columns: 1fr; } }
.productivity-toolbar { display: flex; justify-content: flex-end; margin: 4px 0 10px; }
.productivity-toolbar .field-label { display: flex; align-items: center; gap: 8px; font-size: 13px; }

/* Overview: Assigned tasks — status-aware cards and filter chips. */
.assigned-status-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 14px; }
.filter-chip { border: 1px solid #cbd5e1; background: #fff; color: #334155; border-radius: 999px; padding: 5px 12px; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.filter-chip:hover { border-color: #94a3b8; }
.filter-chip.is-active { background: #0f172a; border-color: #0f172a; color: #fff; }
.filter-chip:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }
.status-chip { display: inline-block; border-radius: 999px; padding: 2px 9px; font-size: 11px; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.status-chip.is-wip { background: #dbeafe; color: #1e40af; }
.status-chip.is-ready-for-testing { background: #fef3c7; color: #92400e; }
.status-chip.is-backlog { background: #e2e8f0; color: #334155; }
.status-chip.is-done { background: #dcfce7; color: #166534; }
.assigned-task-list { display: grid; gap: 10px; }
.assigned-task-card { border: 1px solid #e2e8f0; border-left: 4px solid #cbd5e1; border-radius: 10px; padding: 12px 14px; background: #fff; display: grid; gap: 6px; }
.assigned-task-card.is-wip { border-left-color: #2563eb; }
.assigned-task-card.is-ready-for-testing { border-left-color: #d97706; }
.assigned-task-card.is-backlog { border-left-color: #94a3b8; }
.assigned-task-card.is-done { border-left-color: #16a34a; }
.assigned-task-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.assigned-task-key { font-size: 11px; font-weight: 700; color: #64748b; letter-spacing: .04em; }
.assigned-task-title { color: #0f172a; font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; }
.assigned-task-meta { color: #64748b; font-size: 12px; overflow-wrap: anywhere; }
.assigned-task-card > .small-button { justify-self: start; }

/* Work Board: Archived issues as a simple list (no kanban columns). */
.archive-list { width: 100%; }
.archive-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.archive-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(90px, auto) minmax(110px, auto) auto; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; }
.archive-row-main { display: grid; gap: 2px; text-align: left; background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer; min-width: 0; }
.archive-row-main:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; border-radius: 6px; }
.archive-row-key { font-size: 11px; font-weight: 700; color: #64748b; letter-spacing: .04em; }
.archive-row-title { font-size: 14px; font-weight: 600; color: #0f172a; overflow-wrap: anywhere; }
.archive-row-meta { font-size: 12px; color: #64748b; overflow-wrap: anywhere; }
.archive-row-assignee, .archive-row-target { font-size: 12px; color: #475569; }
@media (max-width: 700px) { .archive-row { grid-template-columns: 1fr; } }

/* Leave details dialog: card layout with status badge and fact grid. */
#leave-grid-detail-dialog.edit-dialog { width: min(520px, calc(100% - 24px)); }
.leave-detail-card { display: grid; gap: 16px; }
.leave-detail-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.leave-detail-status { display: inline-block; padding: 4px 12px; border-radius: 999px; font-size: 12px; font-weight: 700; background: #e2e8f0; color: #334155; }
.leave-detail-status.is-approved { background: #dcfce7; color: #166534; }
.leave-detail-status.is-pending { background: #fef3c7; color: #92400e; }
.leave-detail-status.is-rejected, .leave-detail-status.is-cancelled { background: #fee2e2; color: #991b1b; }
.leave-detail-type { font-size: 13px; font-weight: 600; color: #475569; }
.leave-detail-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0; }
.leave-detail-fact { border: 1px solid #e2e8f0; border-radius: 10px; padding: 10px 12px; background: #f8fafc; min-width: 0; }
.leave-detail-fact dt { font-size: 11px; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: .05em; margin: 0 0 4px; }
.leave-detail-fact dd { margin: 0; font-size: 14px; font-weight: 600; color: #0f172a; overflow-wrap: anywhere; }
.leave-detail-note { font-size: 12px; color: #64748b; margin: 0; }
@media (max-width: 560px) { .leave-detail-facts { grid-template-columns: 1fr; } }

/* Corner cell (header + sticky name column) must stay above both scrolled axes. */
.leave-grid thead th.leave-grid-person { z-index: 4; background: #fff; }