/* Build Tools Floater — polished to match the LSL script-dialog aesthetic
 * (rich blue gradients, #3498db accent, soft glow, gradient buttons). */

/* Source: floater_tools.xml:15 — <floater ... width="295">. The toolbox is a
 * narrow single column; every row below is sized against that 295px. */
#floater-build_tools {
    min-width: 295px;
}

/* ── Tool bar (Focus / Move / Edit / Create / Land) ───────────────── */
/* Source: floater_tools.xml:85-159 — five buttons, height="25" width="35",
 * left="10" then left_pad="10". A fixed-size icon grid, not stretched cells. */
.build-toolbar {
    display: flex;
    gap: 10px;
    padding: 5px 10px 4px;
    background: linear-gradient(135deg, #0a3d62 0%, #0c5a8a 100%);
    border-bottom: 1px solid #3498db;
}

.build-tool-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0;
    background: linear-gradient(180deg, rgba(41,128,185,0.25) 0%, rgba(26,82,118,0.25) 100%);
    border: 1px solid rgba(52,152,219,0.35);
    border-radius: 4px;
    color: rgba(220,235,250,0.75);
    cursor: pointer;
    transition: all 0.15s ease;
    /* Source: floater_tools.xml:87,95 — height="25" width="35" */
    flex: 0 0 35px;
    width: 35px;
    height: 25px;
}

/* Firestorm's tool buttons are icon-only (image_overlay="Tool_Zoom" …,
 * floater_tools.xml:89). Caption is hidden; title/aria-label carry the name. */
.build-tool-btn .tool-caption { display: none; }

.build-tool-btn:hover {
    background: linear-gradient(180deg, #3498db 0%, #2980b9 100%);
    border-color: #5dade2;
    color: #fff;
    transform: translateY(-1px);
}

.build-tool-btn.active {
    background: linear-gradient(180deg, #2980b9 0%, #1a5276 100%);
    border-color: #5dade2;
    color: #fff;
    box-shadow: 0 0 12px rgba(52,152,219,0.5), inset 0 1px 0 rgba(255,255,255,0.15);
}

.build-tool-btn .material-icons { font-size: 18px; line-height: 1; }

/* Source: floater_tools.xml:156-174 — "text status" line, left="8" width="285",
 * LabelSelectedDisabledColor. */
.build-status-text {
    font-size: 10px;
    line-height: 13px;
    color: rgba(200,210,230,0.55);
    padding: 3px 8px 2px;
}

/* ── Tool sub-panel (mode radios per tool) ────────────────────────── */
.build-tool-panel {
    padding: 4px 8px;
    background: rgba(10,45,70,0.55);
    border-bottom: 1px solid rgba(52,152,219,0.25);
    min-height: 22px;
    font-size: 11px;
    color: rgba(220,235,250,0.7);
}

.build-tool-panel .tool-mode-group { display: flex; gap: 4px; }

.build-tool-panel .tool-mode-btn {
    padding: 2px 10px;
    background: linear-gradient(180deg, rgba(41,128,185,0.2) 0%, rgba(26,82,118,0.2) 100%);
    border: 1px solid rgba(52,152,219,0.3);
    border-radius: 4px;
    color: rgba(220,235,250,0.75);
    cursor: pointer;
    font-size: 11px;
    transition: all 0.12s ease;
}

.build-tool-panel .tool-mode-btn:hover {
    background: linear-gradient(180deg, #3498db 0%, #2980b9 100%);
    color: #fff;
}

.build-tool-panel .tool-mode-btn.active {
    background: linear-gradient(180deg, #2980b9 0%, #1a5276 100%);
    border-color: #5dade2;
    color: #fff;
    box-shadow: 0 0 8px rgba(52,152,219,0.4);
}

/* ── Tabs (General / Object / Features / Face / Contents) ─────────── */
#floater-build_tools .llfloater-tabs {
    background: rgba(10,45,70,0.6);
    padding: 0;
    gap: 0;
    border-bottom: 1px solid #3498db;
}

/* Source: floater_tools.xml:896-908 — tab_container tab_height="20",
 * tab_min_width="40" tab_max_width="100", halign="center". A narrow strip. */
#floater-build_tools .llfloater-tab {
    padding: 0;
    height: 20px;
    line-height: 19px;
    min-width: 40px;
    max-width: 100px;
    flex: 1;
    text-align: center;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.2px;
    border-radius: 0;
    border-bottom: 2px solid transparent;
    color: rgba(200,220,240,0.55);
    transition: all 0.15s ease;
}

#floater-build_tools .llfloater-tab:hover {
    background: rgba(52,152,219,0.12);
    color: rgba(220,235,250,0.9);
}

#floater-build_tools .llfloater-tab.active {
    background: linear-gradient(180deg, rgba(52,152,219,0.18) 0%, rgba(52,152,219,0.05) 100%);
    color: #fff;
    border-bottom: 2px solid #3498db;
}

/* ── Tab content ──────────────────────────────────────────────────── */
/* Source: floater_tools.xml:987 — panel content starts at left="10" inside a
 * 295px floater, so the gutter is ~8-10px, not 12. */
#floater-build_tools .llfloater-tab-content {
    padding: 5px 8px 8px;
    background: linear-gradient(135deg, rgba(10,45,70,0.35) 0%, rgba(12,90,138,0.25) 100%);
    font-size: 11px;
}

/* ── Section headers ──────────────────────────────────────────────── */
/* Firestorm's section captions are plain 10px text rows (e.g.
 * floater_tools.xml:1978-1988 "Path Cut (begin/end)", height="10" top_pad="5") —
 * so the rhythm is tight: caption, then the spinner row 4px below. */
.build-section { margin-bottom: 7px; }

.build-section-header {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #5dade2;
    margin-bottom: 3px;
    padding-bottom: 2px;
    border-bottom: 1px solid rgba(52,152,219,0.25);
}

/* ── Transform rows (pos / size / rot with coloured axes) ─────────── */
/* Source: floater_tools.xml:1575-1662 — the X/Y/Z spinners are a single line of
 * small fixed-width fields (spinner width="68" height="19", left_pad="10"),
 * followed by the C/P/p copy-paste buttons. */
.build-transform-row {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 4px;
}

.build-transform-row .transform-label {
    width: 36px;
    font-size: 10px;
    font-weight: 500;
    color: rgba(200,220,240,0.65);
    flex-shrink: 0;
}

.build-transform-row .transform-fields { display: flex; gap: 4px; flex: 1; min-width: 0; }

/* Source: floater_tools.xml:1599 — spinner width="68" */
.build-transform-row .transform-field { flex: 1 1 0; max-width: 68px; min-width: 0; position: relative; }

.build-transform-row .transform-field .axis-label {
    position: absolute;
    left: 4px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    font-weight: 700;
    pointer-events: none;
    z-index: 1;
}

.build-transform-row .transform-field .axis-label.x { color: #ff6b6b; }
.build-transform-row .transform-field .axis-label.y { color: #51cf66; }
.build-transform-row .transform-field .axis-label.z { color: #4dabf7; }

.build-transform-row .transform-field input {
    width: 100%;
    /* Source: floater_tools.xml:1599 — spinner height="19" */
    height: 19px;
    padding: 0 4px 0 14px;
    font-size: 11px;
    background: rgba(0,0,0,0.4);
    border: 1px solid rgba(52,152,219,0.25);
    border-radius: 4px;
    color: #eaf4fc;
    font-family: 'Consolas', 'Courier New', monospace;
    box-sizing: border-box;
    transition: all 0.12s ease;
}

.build-transform-row .transform-field input:focus {
    border-color: #3498db;
    outline: none;
    background: rgba(0,0,0,0.55);
    box-shadow: 0 0 8px rgba(52,152,219,0.35);
}

.build-transform-row .transform-actions { display: flex; gap: 3px; flex-shrink: 0; }

/* Source: floater_tools.xml:1142-1143 — the small square icon buttons in the
 * toolbox are 18x18 (e.g. "button set group" height="18" width="18"). */
.build-cp-btn {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, rgba(41,128,185,0.25) 0%, rgba(26,82,118,0.25) 100%);
    border: 1px solid rgba(52,152,219,0.3);
    border-radius: 4px;
    color: rgba(200,220,240,0.6);
    cursor: pointer;
    font-size: 10px;
    transition: all 0.12s ease;
}

.build-cp-btn:hover:not(:disabled) {
    background: linear-gradient(180deg, #3498db 0%, #2980b9 100%);
    border-color: #5dade2;
    color: #fff;
}

/* Matches floaters.css:429-432 .ll-button:disabled — the set-group wrench is one
 * of these square buttons and must still read as disabled. */
.build-cp-btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ── Param rows (hollow, twist, etc.) ─────────────────────────────── */
/* Source: floater_tools.xml:1993-2002 — spinners carry their label INLINE to the
 * left (label="B" label_width="10"), height="16".."19", width="68", paired on one
 * line with left_pad="10". So a param-row is a flex line of label/value pairs,
 * never a stack of caption-above-field blocks. */
.build-param-row {
    display: flex;
    gap: 10px;
    margin-bottom: 3px;
    align-items: center;
    min-height: 19px;
}

.build-param-row .param-group {
    flex: 1 1 0;
    min-width: 0;
    display: grid;
    /* Label column sizes to its text (Firestorm label_width varies per spinner:
     * "10" for B/E at floater_tools.xml:1997, "65" for Price: L$ at :1274) but is
     * allowed to shrink — the control keeps a 56px floor so a long caption like
     * "Physics Shape Type:" (floater_tools.xml:3156-3187) ellipsises instead of
     * crushing its combo. */
    grid-template-columns: minmax(0, auto) minmax(56px, 1fr);
    align-items: center;
    column-gap: 5px;
}

.build-param-row .param-group label {
    display: block;
    font-size: 10px;
    color: rgba(200,220,240,0.6);
    margin: 0;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Source: floater_tools.xml:987-998 — the General panel is the wide two-column
 * form: "Name:" text left="10" width="90", line_editor width="190". Pin the label
 * column there so Name / Description / Click to line up. */
#build-tab-content[data-tab="general"] .build-param-row .param-group {
    grid-template-columns: 90px minmax(0, 1fr);
}

.build-param-row .param-group input,
.build-param-row .param-group select {
    width: 100%;
    /* Source: floater_tools.xml:991 — line_editor height="19" */
    height: 19px;
    padding: 0 4px;
    font-size: 11px;
    background: rgba(0,0,0,0.4);
    border: 1px solid rgba(52,152,219,0.25);
    border-radius: 3px;
    color: #eaf4fc;
    box-sizing: border-box;
    transition: all 0.12s ease;
}

/* Source: floater_tools.xml:1999,2046 — every numeric spinner in the toolbox is
 * width="68". Keep them small and fixed so pairs read as Firestorm's grid rather
 * than stretching across the panel. */
.build-param-row .param-group input[type="number"] { max-width: 68px; }

/* An unlabelled control (e.g. the base-type combo, floater_tools.xml:1880) spans
 * both grid columns instead of being squeezed into the label column. */
.build-param-row .param-group > input:only-child,
.build-param-row .param-group > select:only-child { grid-column: 1 / -1; }

.build-param-row .param-group input:focus,
.build-param-row .param-group select:focus {
    border-color: #3498db;
    outline: none;
    box-shadow: 0 0 8px rgba(52,152,219,0.35);
}

/* ── Checkbox rows ────────────────────────────────────────────────── */
/* Source: floater_tools.xml:1542-1574 — Locked / Physical / Temporary / Phantom
 * are check_box height="19" laid out two per line; :1345-1367 puts Move / Copy /
 * Export on ONE line (widths 85 / 80 / 90). Checkboxes share rows, they never
 * get a line each. */
.build-flags {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    margin-bottom: 5px;
}

.build-flags .build-flag,
.build-flag {
    display: flex;
    align-items: center;
    gap: 4px;
    /* Source: floater_tools.xml:1545 — check_box height="19" */
    height: 19px;
    font-size: 11px;
    color: rgba(220,235,250,0.85);
    cursor: pointer;
    white-space: nowrap;
}

.build-flag input,
.build-flags .build-flag input {
    cursor: pointer;
    accent-color: #3498db;
    width: 13px;
    height: 13px;
    margin: 0;
    flex-shrink: 0;
}

/* ── Object info bar ──────────────────────────────────────────────── */
.build-info-bar {
    padding: 5px 8px;
    background: rgba(0,0,0,0.25);
    border-top: 1px solid rgba(52,152,219,0.2);
    font-size: 10px;
    color: rgba(200,220,240,0.45);
    text-align: center;
}

/* ── Action / status bar ──────────────────────────────────────────── */
.build-action-bar {
    display: flex;
    gap: 6px;
    padding: 8px 10px;
    background: linear-gradient(135deg, #0a3d62 0%, #0c5a8a 100%);
    border-top: 1px solid #3498db;
}

/* Source: floater_tools.xml:1284-1291,1163-1173 — toolbox buttons are fixed-size
 * (height="19".."20", width="80".."100"), not stretched. Only the bottom action
 * bar shares its width equally. */
.build-action-bar button,
#floater-build_tools .ll-button,
#floater-build_tools .ll-button-small {
    flex: 0 0 auto;
    height: 20px;
    padding: 0 10px;
    font-size: 11px;
    font-weight: 600;
    background: linear-gradient(180deg, #2980b9 0%, #1a5276 100%);
    border: 1px solid #3498db;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    transition: all 0.15s ease;
}

.build-action-bar button:hover,
#floater-build_tools .ll-button:hover,
#floater-build_tools .ll-button-small:hover {
    background: linear-gradient(180deg, #3498db 0%, #2980b9 100%);
    border-color: #5dade2;
    transform: translateY(-1px);
}

.build-action-bar button:active,
#floater-build_tools .ll-button:active { transform: translateY(0); background: #1a5276; }

/* The bottom action bar is the one place Firestorm stretches buttons evenly —
 * restated after the fixed-size rule above so it wins regardless of source order,
 * and with the #floater id so it outranks the id-qualified .ll-button rule. */
#floater-build_tools .build-action-bar button { flex: 1 1 0; }

/* Square icon buttons (set-group wrench, floater_tools.xml:1136-1143 height/width
 * "18") must not inherit the 10px horizontal padding of a labelled button. */
#floater-build_tools .build-cp-btn { flex: 0 0 auto; padding: 0; }

/* ── Contents list ────────────────────────────────────────────────── */
.build-contents-list {
    list-style: none;
    margin: 0;
    padding: 0;
    background: rgba(0,0,0,0.35);
    border: 1px solid rgba(52,152,219,0.25);
    border-radius: 4px;
    min-height: 120px;
    max-height: 250px;
    overflow-y: auto;
}

.build-contents-list li {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    font-size: 11px;
    color: rgba(220,235,250,0.85);
    cursor: pointer;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}

.build-contents-list li:hover { background: rgba(52,152,219,0.14); }

.build-contents-list li:focus-visible {
    outline: 2px solid #5dade2;
    outline-offset: -2px;
}

.build-contents-list li.selected {
    background: linear-gradient(180deg, #2980b9 0%, #1a5276 100%);
    color: #fff;
}

.build-contents-list li .material-icons { font-size: 16px; opacity: 0.7; }

.build-contents-list .empty-msg {
    text-align: center;
    color: rgba(200,220,240,0.35);
    padding: 30px 10px;
    font-style: italic;
}

/* ── Create tool prim grid ────────────────────────────────────────── */
.build-create-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 5px;
}

.build-create-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 8px 4px;
    background: linear-gradient(180deg, rgba(41,128,185,0.22) 0%, rgba(26,82,118,0.22) 100%);
    border: 1px solid rgba(52,152,219,0.3);
    border-radius: 6px;
    color: rgba(220,235,250,0.8);
    cursor: pointer;
    font-size: 9px;
    transition: all 0.12s ease;
}

.build-create-btn:hover {
    background: linear-gradient(180deg, #3498db 0%, #2980b9 100%);
    border-color: #5dade2;
    color: #fff;
    transform: translateY(-1px);
}

.build-create-btn.active {
    background: linear-gradient(180deg, #2980b9 0%, #1a5276 100%);
    border-color: #5dade2;
    color: #fff;
    box-shadow: 0 0 12px rgba(52,152,219,0.5);
}

.build-create-btn .material-icons { font-size: 22px; }

/* ── Permissions section ──────────────────────────────────────────── */
/* Source: floater_tools.xml:1311-1405 — perms_build panel, height="98" width="290":
 * "Anyone:" then Move / Copy / Export, "Next owner:" then Modify / Copy / Transfer.
 * Rendered here as one line per group — the caption is an inline-block column and
 * the checkbox run follows it on the same line. */
.build-perms-section {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid rgba(52,152,219,0.2);
}

.build-perms-label {
    font-size: 10px;
    font-weight: 600;
    color: rgba(200,220,240,0.6);
    margin: 0;
    display: inline-block;
    width: 68px;
    vertical-align: middle;
    line-height: 19px;
}

.build-perms-row {
    display: inline-flex;
    gap: 8px;
    vertical-align: middle;
    flex-wrap: wrap;
    margin: 0;
}

/* Source: floater_tools.xml:1323-1336 — perm_modify ("You can modify this object")
 * is a full-width status line, not a column caption. */
#general-perm-modify {
    display: block;
    width: auto;
    line-height: 14px;
    margin-bottom: 3px;
}

/* ── Sliders ──────────────────────────────────────────────────────── */
#floater-build_tools input[type="range"] {
    -webkit-appearance: none;
    width: 100%;
    height: 4px;
    background: rgba(52,152,219,0.2);
    border-radius: 2px;
    outline: none;
    margin: 5px 0;
}

#floater-build_tools input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    background: #3498db;
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid rgba(255,255,255,0.4);
    box-shadow: 0 0 6px rgba(52,152,219,0.5);
}

#floater-build_tools input[type="range"]::-webkit-slider-thumb:hover { background: #5dade2; }

/* ── Colour input ─────────────────────────────────────────────────── */
#floater-build_tools input[type="color"] {
    -webkit-appearance: none;
    border: 1px solid rgba(52,152,219,0.35);
    border-radius: 4px;
    padding: 0;
    cursor: pointer;
}

/* ── General-tab info fields ──────────────────────────────────────── */
/* Source: floater_tools.xml:1018-1098 — Creator: / Owner: / Last Owner: are a
 * 75px label column ("Creator:" left="10" width="75") with a 190px name column.
 * The bare "Creator:" text node becomes the first (anonymous) grid item and the
 * .info-value span the second, so the values line up in a real column. */
.build-info-field {
    display: grid;
    grid-template-columns: 75px minmax(0, 1fr);
    align-items: center;
    column-gap: 5px;
    font-size: 11px;
    line-height: 16px;
    color: rgba(200,220,240,0.55);
    padding: 1px 0;
}

.build-info-field .info-value {
    color: rgba(220,235,250,0.85);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Source: llpanelpermissions.cpp:1543-1562 showMarkForSale — while the sale controls
   hold an uncommitted change, the "Apply" button is enabled AND flashing, with the
   EmphasisColor border. Without a visible state the button is indistinguishable from
   the one that has nothing to do. */
.ll-button.pending,
.ll-button-small.pending {
    border-color: rgba(243, 156, 18, 0.9);
    box-shadow: 0 0 0 1px rgba(243, 156, 18, 0.55) inset;
    animation: build-pending-flash 1.2s ease-in-out infinite;
}

@keyframes build-pending-flash {
    0%, 100% { background-color: rgba(243, 156, 18, 0.18); }
    50%      { background-color: rgba(243, 156, 18, 0.38); }
}

/* prefers-reduced-motion: keep the emphasis, drop the pulse (MDN: respect the user's
   motion preference rather than animating unconditionally). */
@media (prefers-reduced-motion: reduce) {
    .ll-button.pending,
    .ll-button-small.pending { animation: none; background-color: rgba(243, 156, 18, 0.28); }
}