/* Year Planning View - Refactored for Theming */

/* Planning Table Headers */
#planningTable thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--theme-bg-tertiary);
    border: 1px solid var(--theme-border-color);
    color: var(--theme-text-primary);
    text-align: left;
    white-space: nowrap;
    padding: 3px 5px;
    font-size: 0.85em;
}

#planningTable th[data-team-id] {
    background-color: var(--theme-bg-tertiary);
    /* Was legacy light blue #ddeeff */
    color: var(--theme-text-primary);
    padding: 5px 2px;
    font-size: 0.8em;
    min-width: 25px;
    max-width: 25px;
}

/* Planning Table Body Cells - EXACT ORIGINAL */
#planningTable tbody td,
#teamLoadSummaryTable tbody td {
    padding: 2px 4px;
    font-size: 0.82em;
    border: 1px solid var(--theme-border-color);
    vertical-align: middle;
    color: var(--theme-text-primary);
}

#planningTable tbody td input[type="number"] {
    font-size: 0.9em;
    padding: 2px;
    background-color: var(--theme-bg-primary);
    color: var(--theme-text-primary);
    border: 1px solid var(--theme-border-color);
}

/* Team Load Summary Table */
#teamLoadSummaryTable {
    font-size: 0.85em;
    color: var(--theme-text-primary);
}

#teamLoadSummaryTable thead th {
    padding: 5px 8px;
    background-color: var(--theme-bg-tertiary);
    color: var(--theme-text-primary);
    border: 1px solid var(--theme-border-color);
}

#teamLoadSummaryTable tbody td,
#teamLoadSummaryTable tfoot td {
    padding: 4px 6px;
    font-size: 0.85em;
}

#teamLoadSummaryTable tfoot td {
    background-color: var(--theme-bg-secondary);
    color: var(--theme-text-primary);
    font-weight: 600;
    border: 1px solid var(--theme-border-color);
}

/* ============================================
   PHASE 4: Structural Layout Classes
   (Extracted from inline styles - DO NOT MODIFY TABLE STYLING)
   ============================================ */

/* Planning Toolbar (extracted from inline) */
.planning-toolbar {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
}

/* Team Load Summary Section (collapsible) */
#teamLoadSummarySection {
    margin-bottom: 20px;
    border: 1px solid var(--theme-border-color);
    border-radius: 4px;
    background-color: var(--theme-bg-primary);
}

#teamLoadSummarySection h4 {
    cursor: pointer;
    margin: 0;
    padding: 10px;
    background-color: var(--theme-bg-secondary);
    border-bottom: 1px solid var(--theme-border-color);
    color: var(--theme-text-primary);
}

#teamLoadSummaryContent {
    padding: 10px;
}

#teamLoadSummaryContent.is-hidden {
    display: none;
}

#teamLoadSummaryContent>p {
    font-size: 0.9em;
    color: var(--theme-text-muted);
    margin-top: 0;
}

/* Summary Table Layout (NOT styling - that's in the table rules above) */
#teamLoadSummaryTable {
    margin: 0 auto;
    border-collapse: collapse;
}

#planningTableWrapper {
    max-height: var(--planning-table-max-height, 600px);
    overflow-y: auto;
}

/* ============================================
   Drag & Drop Visual Feedback
   ============================================ */

/* Row being dragged */
#planningTableBody tr.dragging {
    opacity: 0.5;
    border: 2px dashed var(--theme-text-muted);
    background-color: var(--theme-bg-secondary);
}

/* Drop zone indicator - shows where the row will be placed */
#planningTableBody tr.drag-over {
    border-top: 3px solid var(--theme-primary);
    box-shadow: 0 -2px 4px var(--theme-card-shadow);
}

/* ============================================
   Toolbar Layout Classes
   ============================================ */

.year-plan-toolbar-group {
    display: flex;
    align-items: center;
    gap: 8px;
}

.year-plan-toolbar-group--right {
    margin-left: auto;
}

.year-plan-toolbar-label {
    font-weight: 600;
    color: var(--theme-text-primary);
}

.year-plan-toggle-label {
    cursor: pointer;
    user-select: none;
    color: var(--theme-text-primary);
}

/* ============================================
   Row Type Classes
   ============================================ */

/* Protected initiatives - top of list, styled distinctly */
#planningTableBody tr.year-plan-row--protected {
    background-color: var(--theme-bg-secondary);
}

#planningTableBody tr.year-plan-row--protected td:nth-child(2) {
    font-weight: bold;
}

/* BTL initiatives - below the line */
#planningTableBody tr.year-plan-row--btl {
    background-color: rgba(var(--theme-warning-rgb), 0.05);
}

/* Draggable cursor */
#planningTableBody tr[draggable="true"] {
    cursor: move;
}

#planningTableBody tr[draggable="false"] {
    cursor: default;
}

/* ============================================
   Cell Type Classes
   ============================================ */

.year-plan-cell--center {
    text-align: center;
}

.year-plan-cell--right {
    text-align: right;
}

.year-plan-cell--left {
    text-align: left;
}

.year-plan-cell--id {
    font-size: 0.8em;
    color: var(--theme-text-muted);
}

.year-plan-cell--description {
    color: var(--theme-text-secondary);
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.year-plan-cell--bold {
    font-weight: bold;
}

/* ============================================
   ATL/BTL Status Classes
   ============================================ */

.year-plan-atl-status {
    font-weight: bold;
    text-align: center;
}

.year-plan-atl-status--atl {
    color: var(--theme-success, #28a745);
}

.year-plan-atl-status--btl {
    color: var(--theme-danger, #dc3545);
}

/* ============================================
   Capacity Status Classes
   ============================================ */

.year-plan-capacity--ok {
    background-color: rgba(var(--theme-success-rgb), 0.15);
}

.year-plan-capacity--warning {
    background-color: rgba(var(--theme-warning-rgb), 0.15);
}

.year-plan-capacity--danger {
    background-color: rgba(var(--theme-danger-rgb), 0.15);
}

/* ============================================
   Team Estimate Cell Classes
   ============================================ */

.year-plan-team-cell {
    text-align: center;
    padding: 2px !important;
}

.year-plan-team-cell--ok {
    background-color: rgba(var(--theme-success-rgb), 0.15);
}

.year-plan-team-cell--over {
    background-color: rgba(var(--theme-danger-rgb), 0.15);
}

.year-plan-estimate-input {
    width: 60px;
    text-align: right;
    border: none;
    background-color: transparent;
    color: var(--theme-text-primary);
    font-size: inherit;
    padding: 2px 4px;
}

.year-plan-estimate-input:focus {
    outline: 2px solid var(--theme-primary, #007bff);
    border-radius: 2px;
}

/* ============================================
   Team Header (Vertical Text)
   ============================================ */

.year-plan-team-header {
    text-align: center;
    writing-mode: vertical-lr;
    text-orientation: mixed;
    white-space: nowrap;
    min-width: 35px;
    max-width: 35px;
}

/* ============================================
   Summary Table Value Classes
   ============================================ */

.year-plan-value--positive {
    color: var(--theme-success, #28a745);
}

.year-plan-value--negative {
    color: var(--theme-danger, #dc3545);
}

.year-plan-status-text--ok {
    color: var(--theme-success, #28a745);
    font-weight: bold;
}

.year-plan-status-text--warning {
    color: var(--theme-warning-alt, darkorange);
    font-weight: bold;
}

.year-plan-status-text--danger {
    color: var(--theme-danger, #dc3545);
    font-weight: bold;
}

/* ============================================
   Scenario Buttons
   ============================================ */

.year-plan-scenario-btn {
    border: 1px solid var(--theme-border-color);
}

/* ============================================
   Checkbox Styling
   ============================================ */

.year-plan-checkbox {
    cursor: pointer;
}