.node-accessory-dialog { width: min(480px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); padding: 0; border: 1px solid #e2e8f0; border-radius: 16px; color: #334155; background: #fff; box-shadow: 0 24px 80px #0f234033; }
.node-accessory-dialog::backdrop { background: #162b4d66; backdrop-filter: blur(3px); }
.node-accessory-form { padding: 24px; }
.node-accessory-form > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.node-accessory-form h2 { margin: 0; font-size: 20px; font-weight: 700; color: #21334d; }
.node-accessory-form header p { margin: 5px 0 0; font-size: 13px; color: #6e829d; overflow-wrap: anywhere; }
.node-accessory-form header p span { margin: 0 5px; color: #b3c0d1; }
.node-accessory-form header button { padding: 0 5px; font-size: 25px; line-height: 25px; color: #94a3b8; }
.node-accessory-form .accessory-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.node-accessory-form .accessory-fields label { min-width: 0; font-size: 12px; color: #64748b; }
.node-accessory-form .accessory-fields label:first-child { grid-column: 1 / -1; }
.node-accessory-form .accessory-fields input, .node-accessory-form .accessory-fields select { width: 100%; min-width: 0; margin-top: 6px; padding: 9px 10px; min-height: 40px; border: 1px solid #dbe3ee; border-radius: 7px; font-size: 14px; color: #334155; background: #fbfcfe; }
.node-accessory-form .node-accessory-help { margin: 15px 0 20px; font-size: 12px; line-height: 1.7; color: #8898ac; }
.node-accessory-form .node-accessory-error { margin: 12px 0; font-size: 13px; color: #b91c1c; }
.node-accessory-form footer { display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding-top: 16px; border-top: 1px solid #edf1f6; }
.node-accessory-form footer > span { margin-right: auto; max-width: 190px; font-size: 11px; line-height: 1.6; color: #8998ac; }
.node-accessory-form footer button { padding: 8px 16px; border: 1px solid #dce4ef; border-radius: 7px; font-size: 13px; white-space: nowrap; }
.node-accessory-form footer button[type="submit"] { background: #2563eb; border-color: #2563eb; color: white; }
.node-accessory-form :is(button,input,select):focus-visible { outline: 2px solid #6395df; outline-offset: 2px; }
.dark .node-accessory-dialog { background: #1e293b; border-color: #475569; color: #cbd5e1; }
.dark .node-accessory-form h2 { color: #e2e8f0; }
.dark .node-accessory-form .accessory-fields input, .dark .node-accessory-form .accessory-fields select { background: #162235; color: #e2e8f0; border-color: #475569; }
.dark .node-accessory-form footer { border-color: #334155; }
@media (max-width: 480px) { .node-accessory-form { padding: 20px; } .node-accessory-form .accessory-fields input, .node-accessory-form .accessory-fields select { font-size: 16px; } .node-accessory-form footer { flex-wrap: wrap; } .node-accessory-form footer > span { flex: 1 1 100%; max-width: none; } }
.accessory-help { color:#64748b; font-size:12px; line-height:1.6; margin:6px 0; }
.accessory-record { font-size:13px; overflow-wrap:anywhere; }
.accessory-receiving { margin-top:12px; padding:12px; border:1px solid #dce5f0; border-radius:8px; background:#f8fafc; }
.accessory-receiving>summary { cursor:pointer; font-weight:600; color:#305a85; min-height:28px; }
.accessory-receiving>summary span { font-size:12px; color:#64748b; margin-left:8px; }
.accessory-fields,.accessory-receipt-fields { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr)); gap:10px; margin-top:12px; }
.accessory-fields label,.accessory-receipt-fields label { display:block; font-size:13px; color:#475569; }
.accessory-fields input,.accessory-fields select,.accessory-receipt-fields input,.accessory-receipt-fields select { display:block; width:100%; min-width:0; min-height:40px; border:1px solid #cbd5e1; border-radius:6px; padding:7px; background:#fff; margin-top:5px; }
.accessory-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.accessory-actions button,.accessory-record button { padding:7px 12px; border:1px solid #cbd5e1; border-radius:6px; color:#2563eb; background:#fff; font-size:13px; }
.accessory-actions [data-submit] { background:#2563eb; color:white; border-color:#2563eb; }
.accessory-history { font-size:12px; margin-top:8px; }
.accessory-history summary { cursor:pointer; padding:6px 0; }
.accessory-history>div { max-height:280px; overflow:auto; }
.accessory-record { padding:8px 0; border-bottom:1px solid #e2e8f0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.accessory-record>details { flex-basis:100%; font-size:12px; color:#64748b; }
.accessory-receipt-history { margin-top:12px; font-size:13px; }
.accessory-receipt-history>p { margin-top:6px; color:#475569; }
.accessory-schedule-notes { padding:10px 16px; background:#f0f7ff; font-size:13px; color:#305a85; line-height:1.8; }
.dark .accessory-receiving { background:#1f2937; border-color:#475569; color:#e2e8f0; }
.dark .accessory-fields label { color:#e2e8f0; }
.dark .accessory-fields input,.dark .accessory-fields select { background:#172b3b; color:#e2e8f0; }
@media(max-width:600px) { .accessory-actions button,.accessory-record button { min-height:40px; } .accessory-receipt-fields { grid-template-columns:1fr 1fr; } .accessory-receipt-fields>label:first-child { grid-column:1/-1; } .accessory-receipt-fields input { font-size:16px; } }
.node-accessory-form .accessory-source-field { grid-column: 1/-1; }
#components-container .accessory-node-kind { width: auto; min-width: 24px; padding: 0 5px; font-size: 10px; }
#components-container .accessory-node-edit { min-width: 0; padding: 0; border: 0; background: transparent; text-align: left; }
#components-container .accessory-node-edit:hover { color: var(--node-blue); }
.accessory-more-settings { margin-top: 12px; color: #62768d; font-size: 13px; }
.accessory-more-settings > summary { cursor: pointer; padding: 6px 0; }
.accessory-more-settings .accessory-fields { margin-top: 8px; }
.accessory-entry-hidden { display: none !important; }
.accessory-entry-panel { border: 0; padding: 0; background: transparent; }
.accessory-entry-panel > summary { display: none; }
.accessory-entry-panel .accessory-receipt-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.accessory-entry-panel .accessory-receipt-fields > label:first-child { grid-column: 1 / -1; }
.node-accessory-form .accessory-fields label:has([name="name"]) { grid-column: 1/-1; }
.node-accessory-form .accessory-fields input:disabled,.node-accessory-form .accessory-fields select:disabled { opacity: .65; }
.accessory-receipt-error { color: #b91c1c; font-size: 13px; margin-top: 10px; }
.accessory-receiving-dialog { width: min(560px, calc(100vw - 24px)); }
.accessory-receiving-dialog .accessory-receiving { padding: 0; margin: 0; border: 0; background: transparent; }
.accessory-receiving-dialog .accessory-receiving > summary { display: none; }
.accessory-receiving-dialog .accessory-receipt-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
.accessory-receiving-dialog .accessory-receipt-fields > label:first-child { display: none; }
.accessory-receiving-dialog .accessory-actions button:disabled { opacity: .5; }
.dark .accessory-receipt-fields label,.dark .accessory-receipt-history > p { color: #bdcbdc; }
.dark .accessory-receipt-fields input,.dark .accessory-receipt-fields select { background: #162235; color: #e2e8f0; border-color: #475569; }
.dark .accessory-receipt-error { color: #fca5a5; }
@media (max-width: 380px) { .accessory-receiving-dialog .accessory-receipt-fields { grid-template-columns: minmax(0,1fr); } }

/* Accessories use amber throughout settings and scheduling. */
#components-container .accessory-node-card {
    --node-ink: #714814; --node-muted: #856333; --node-line: #ead19b;
    --node-surface: #fff9e9; --node-field: #fffdf5; --node-blue: #97600c;
    background: var(--node-surface) !important;
}
#components-container .accessory-node-card:hover,
#components-container .accessory-node-card:focus-within { border-color: #c89435 !important; }
#components-container .accessory-node-kind { width: auto; background: #f8e3a9; color: #78500d; }
#components-container .component-accessory-add { background: #fff5d9; border-color: #ead19b; color: #825513; }
.dark #components-container .accessory-node-card {
    --node-ink: #f8e5bb; --node-muted: #d9bb83; --node-line: #76603a;
    --node-surface: #3b3222; --node-field: #30291e; --node-blue: #ffda8c;
}
.dark #components-container .accessory-node-kind,
.dark #components-container .component-accessory-add { background: #59431e; border-color: #76603a; color: #ffdf98; }
.accessory-schedule-notes { background: #fff9e9; color: #714814; }
.accessory-schedule-item { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 8px 0; }
.accessory-schedule-item p { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.accessory-schedule-item strong { display: block; font-weight: 500; }
.accessory-schedule-item p > span { display: block; font-size: 12px; color: #856333; }
.ss-accessory-settings { flex-shrink: 0; padding: 7px 10px; border: 1px solid #dfc38a; border-radius: 7px; background: #fffdf5; color: #825513; font-size: 12px; }
.dark .accessory-schedule-notes { background: #3b3222; color: #f8e5bb; }
.dark .accessory-schedule-item p > span { color: #d9bb83; }
.dark .ss-accessory-settings { background: #59431e; border-color: #76603a; color: #ffdf98; }
#page-smart-scheduling .ss-gantt-row.is-accessory .ss-row-label,
#page-smart-scheduling .ss-mobile-process.is-accessory { background: #fff9e9; color: #714814; }
#page-smart-scheduling .ss-gantt-row.is-accessory .ss-bar,
#page-smart-scheduling .ss-mobile-process.is-accessory .ss-mini-range { background: #f3d58e; border-color: #ca982c; }
#page-smart-scheduling .ss-gantt-row.is-accessory .ss-process-label > span { color: #825513; }
.dark #page-smart-scheduling .ss-gantt-row.is-accessory .ss-row-label,
.dark #page-smart-scheduling .ss-mobile-process.is-accessory { background: #3b3222; color: #f8e5bb; }
.dark #page-smart-scheduling .ss-gantt-row.is-accessory .ss-process-label > span { color: #ffdf98; }
@media (max-width: 600px) { .accessory-schedule-item { align-items: flex-start; flex-wrap: wrap; } .ss-accessory-settings { min-height: 40px; } }
