/* css/tool-sheets.css */

.sheets-page > h2 {
    /* Page title styling if needed, usually handled by global.css */
}
.sheets-container { 
    display: flex; 
    flex-direction: column; 
    flex-grow: 1; 
    background-color: var(--surface); 
    border-radius: var(--md-sys-shape-corner-m); 
    box-shadow: var(--md-sys-elevation-level1); 
    overflow: hidden; 
    border: 1px solid var(--outline);
}
.sheets-toolbar { 
    padding: 6px 10px; /* Reduced padding */
    background-color: var(--surface-container-low); 
    border-bottom: 1px solid var(--outline); 
    display: flex; 
    align-items: center; 
    flex-wrap: wrap;
    gap: 6px; /* Reduced gap */
}
.formula-bar-container {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-grow: 1;
    min-width: 200px; 
    max-width: 600px; /* Max width for formula bar area */
    margin-right: auto; /* Push toolbar actions to the right */
}
.selected-cell-label {
    font-family: var(--md-sys-typescale-label-large-font);
    font-size: 12px;
    color: var(--on-surface-variant);
    padding: 5px 8px; /* Adjusted padding */
    border: 1px solid var(--outline);
    border-radius: var(--md-sys-shape-corner-xs);
    background-color: var(--surface-container-highest);
    min-width: 45px; 
    text-align: center;
    white-space: nowrap;
    cursor: default;
}
.fx-label {
    font-family: 'Times New Roman', Times, serif;
    font-style: italic;
    font-weight: bold;
    font-size: 15px; /* Slightly smaller */
    color: var(--on-surface-variant);
    padding: 0 5px;
    align-self: center;
    cursor: default;
}
#formulaInputBar {
    flex-grow: 1;
    padding: 6px 8px; /* Adjusted padding */
    border-radius: var(--md-sys-shape-corner-xs);
    border: 1px solid var(--outline);
    background-color: var(--surface-bright);
    font-family: 'Roboto Mono', Consolas, monospace;
    font-size: 13px; /* Slightly smaller */
    line-height: 1.4;
    min-height: 34px; /* Adjusted height */
}
#formulaInputBar:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 20%, transparent);
    outline: none;
}
.toolbar-actions {
    display: flex;
    gap: 4px; 
    align-items: center;
    margin-left: auto; /* Push to the right if formula bar doesn't take all space */
}
.toolbar-actions .button { 
    padding: 5px 10px; /* Adjusted padding */
    min-height: 34px;
}
.toolbar-actions .button.icon-button {
    padding: 5px;
    min-width: 34px;
    min-height: 34px;
}
.toolbar-actions .split-button-container .button {
    padding: 5px 10px; 
    min-height: 34px;
}
.toolbar-actions .split-button-container .split-button-dropdown-trigger {
    padding: 5px 7px;
}

.table-responsive-wrapper {
    width: 100%;
    overflow: auto; 
    flex-grow: 1;
    position: relative; 
    background-color: var(--surface-bright); 
    -webkit-overflow-scrolling: touch; /* For smoother touch scrolling */
}
#sheetsGrid { 
    border-collapse: collapse;
    table-layout: fixed; 
    user-select: none; 
    cursor: cell;
    position: relative; 
    /* Remove width: 100% from table if it conflicts with sticky calculations, let wrapper handle width */
}
#sheetsGrid:focus {
    outline: 2px solid var(--primary); /* Focus ring for keyboard navigation on the grid */
    outline-offset: -1px;
}


#sheetsGrid th, 
#sheetsGrid td { 
    border: 1px solid color-mix(in srgb, var(--outline) 60%, transparent); /* Lighter grid lines */
    padding: 0; 
    min-width: 25px; /* Absolute minimum */
    height: 26px; 
    text-align: left; 
    vertical-align: middle; 
    position: relative; 
    font-size: 12px; /* Even smaller for density */
    box-sizing: border-box;
    white-space: nowrap; 
    overflow: hidden; 
}
#sheetsGrid td .cell-content { 
    padding: 0 4px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Column Headers (A, B, C...) */
#sheetsGrid thead th { 
    background-color: var(--surface-container); 
    font-weight: 500; 
    padding: 2px 0; 
    text-align: center;
    color: var(--on-surface-variant); 
    position: sticky; 
    top: 0;
    z-index: 100; /* Higher z-index for headers */
    border-bottom: 1.5px solid var(--md-sys-color-outline-light);
    cursor: default; 
    overflow: visible;
}
#sheetsGrid thead th .col-resizer { 
    position: absolute;
    top: 0;
    right: -5px; /* Centered over the border line */
    width: 10px; /* Larger touch/mouse target */
    height: 100%;
    cursor: col-resize;
    z-index: 105; 
    /* background-color: rgba(0,0,255,0.05); /* For debugging resizer area */
}
#sheetsGrid thead th:first-child { /* Top-left empty cell */
    background-color: var(--surface-container-high); 
    z-index: 120; /* Highest for corner */
    border-right: 1.5px solid var(--md-sys-color-outline-light);
    width: 35px !important; 
    min-width: 35px !important;
    max-width: 35px !important;
    padding: 0;
}
#sheetsGrid thead th:first-child .col-resizer { display: none; }

/* Row Headers (1, 2, 3...) */
#sheetsGrid tbody th.row-header { 
    background-color: var(--surface-container);
    width: 35px !important; 
    min-width: 35px !important;
    max-width: 35px !important;
    text-align: center;
    font-weight: 500;
    color: var(--on-surface-variant);
    position: sticky;
    left: 0;
    z-index: 110; 
    padding: 2px 0;
    border-right: 1.5px solid var(--md-sys-color-outline-light);
    cursor: default;
    overflow: visible;
}
/* #sheetsGrid tbody th.row-header .row-resizer { ... } */


#sheetsGrid td input.cell-input-edit { 
    position: absolute; 
    top: 0; left: 0;
    width: 100%; height: 100%; 
    border: 2px solid var(--primary); 
    outline: none; 
    padding: 0 3px; 
    margin: 0; 
    font-family: 'Roboto Mono', Consolas, monospace; /* Match formula bar for consistency */
    font-size: 12px; /* Match cell display */
    background-color: var(--surface-bright); 
    color: var(--on-surface); 
    z-index: 200; /* Above everything in the cell */
    box-sizing: border-box;
    line-height: normal; /* Reset line height for input */
}
#sheetsGrid td.editing .cell-content { /* Hide static content when editing */
    display: none;
}


/* Cell Selection Styling */
#sheetsGrid td.selected-cell-primary { 
    /* Primary selection handled by the selection-overlay now mostly */
}
#sheetsGrid td.selected-cell-range { 
    background-color: color-mix(in srgb, var(--primary) 10%, transparent) !important;
}

/* Fill Handle */
.fill-handle {
    position: absolute;
    width: 9px; 
    height: 9px;
    background-color: var(--primary);
    border: 1.5px solid var(--surface-bright); /* Contrast border */
    cursor: crosshair;
    z-index: 250; 
    border-radius: 1px;
    box-shadow: 0 0 2px rgba(0,0,0,0.4);
    touch-action: none; /* Prevent scrolling on touch devices when dragging fill handle */
}
/* Temp fill path for drag visualization */
#sheetsGrid td.temp-fill-path {
    background-color: color-mix(in srgb, var(--secondary) 30%, transparent) !important;
    outline: 1px dashed var(--secondary);
    outline-offset: -1px;
}

/* Formula Suggestion Box */
.formula-suggestions { /* ... (Same as before) ... */
    position: absolute; background-color: var(--surface-container-high);
    border: 1px solid var(--outline); border-radius: var(--md-sys-shape-corner-s);
    box-shadow: var(--md-sys-elevation-level2); z-index: 1000; 
    max-height: 180px; overflow-y: auto; min-width: 200px;
    font-family: 'Roboto Mono', Consolas, monospace;
}
.formula-suggestions div { padding: 6px 10px; cursor: pointer; font-size: 13px; color: var(--on-surface); white-space: nowrap; }
.formula-suggestions div:hover,
.formula-suggestions div.selected { background-color: var(--surface-container-highest); color: var(--primary); }
.formula-suggestions div .func-name { font-weight: 500; }
.formula-suggestions div .func-desc { font-size: 11px; color: var(--on-surface-variant); margin-left: 8px;}

/* Selection Overlay (for visual drag selection border) */
.selection-overlay {
    position: absolute;
    border: 2px solid var(--primary); /* Primary selection border */
    background-color: color-mix(in srgb, var(--primary) 8%, transparent); /* Very light fill for selection area */
    pointer-events: none; 
    z-index: 150; /* Above cells, below active input/fill handle */
    box-sizing: border-box;
    display: none; 
}