.actions-page h1 { font-size: 1.6rem; letter-spacing: -.025em; }
.actions-page .customer-nav, .settings-page .customer-nav { padding: 12px 16px; }
.customer-nav__left { flex-wrap: wrap; gap: 4px; }
.customer-nav__left a { padding: 8px 12px; font-size: .875rem; }
.communication-controls { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; }
.communication-controls label, .communication-form label { display: grid; gap: 5px; font-size: .8125rem; color: var(--text-secondary); }
.communication-controls button, .communication-controls a { align-self: end; }
.actions-heading { margin-top: 24px; }
.sync-status { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 16px; font-size: .8125rem; }
.actions-filters { margin-bottom: 20px; }
.actions-search { flex: 1; min-width: 160px; }
.action-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.action-tabs [aria-pressed="true"] { color: #fff; background: var(--accent); border-color: var(--accent); }
.actions-layout { display: grid; grid-template-columns: minmax(260px, .85fr) minmax(360px, 1.15fr); gap: 20px; align-items: start; }
.actions-layout:has(#action-detail[hidden]) { grid-template-columns: 1fr; }
.action-list-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.action-card { margin-bottom: 12px; padding: 20px; border-left: 4px solid var(--border); }
.action-card.is-high { border-left-color: var(--warning); }
.action-card.is-selected { border-color: var(--accent); }
.action-card h2 { font-size: 1rem; margin: 6px 0; }
.action-card .communication-controls { margin-top: 12px; }
.communication-link { text-decoration: underline; text-underline-offset: 3px; font-size: .8125rem; overflow-wrap: anywhere; }
button.communication-link { background: transparent; border: 0; text-align: left; color: var(--text-primary); }
.communication-body { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .875rem; margin-top: 8px; }
.communication-excerpt { overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.communication-label { font-size: .875rem; margin-top: 22px; margin-bottom: 8px; }
.communication-notice { background: #fffbeb; border: 1px solid #fde68a; border-radius: var(--radius-sm); padding: 10px 14px; font-size: .8125rem; margin-bottom: 14px; white-space: pre-wrap; overflow-wrap: anywhere; }
.communication-form { display: grid; gap: 14px; margin-top: 20px; }
.communication-form > button { justify-self: start; }
.communication-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.communication-form input, .communication-form select, .communication-form textarea { max-width: 100%; }
.communication-form .form-textarea { resize: vertical; }
.communication-form .communication-check { display: flex; align-items: start; gap: 8px; }
.communication-check input { margin-top: 4px; flex: none; }
.communication-fieldset { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px; min-width: 0; }
.communication-fieldset legend { padding: 0 5px; font-size: .8125rem; color: var(--text-secondary); }
.communication-fieldset .communication-controls, .communication-fieldset .communication-form-grid { margin-top: 12px; }
.linked-order-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.linked-order-chip { display: flex; align-items: center; gap: 8px; border: 1px solid var(--border); border-radius: 8px; padding: 5px 8px; }
.order-search-result { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border); font-size: .8125rem; }
.detail-orders { display: grid; gap: 8px; margin: 16px 0; }
.detail-order { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px; }
.communication-timeline { list-style: none; display: grid; gap: 12px; margin-top: 12px; max-height: 520px; overflow-y: auto; }
.communication-timeline li { border-left: 2px solid var(--border); padding: 0 0 4px 12px; }
.communication-timeline .is-internal { border-color: var(--warning); background: #fffbeb; padding: 10px 12px; }
.communication-attachment { display: flex; align-items: start; gap: 10px; padding: 10px 0; border-top: 1px solid var(--border); }
.communication-attachment img { width: 52px; height: 52px; object-fit: cover; border-radius: 6px; }
.communication-attachment label { display: flex; gap: 8px; align-items: start; flex: 1; }
.order-communication-summary { display: grid; gap: 5px; padding-top: 8px; border-top: 1px solid var(--border); }
.communication-action-list { padding-left: 18px; margin: 14px 0; }
.order-follow-up-content { display: grid; gap: 8px; }
.settings-page { max-width: 1100px; }
.settings-page .communication-form > section { margin-bottom: 6px; }
.settings-page .secret-status { color: var(--text-muted); }
.settings-page details { margin-top: 14px; font-size: .8125rem; }
.settings-page details ol { margin: 10px 0 0 20px; display: grid; gap: 8px; }
.settings-page .settings-submit { position: sticky; bottom: 12px; padding: 12px 16px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); }
.ops-navigation { height: auto !important; min-height: 56px; flex-wrap: wrap; padding: 10px 16px !important; gap: 10px; }
.ops-navigation > div { flex-wrap: wrap; gap: 6px !important; }
.ops-navigation a { padding: 6px 12px !important; }
[hidden] { display: none !important; }
@media (max-width: 950px) { .actions-layout { grid-template-columns: 1fr; } .actions-layout #action-detail { grid-row: 1; } }
@media (max-width: 600px) { .customer-nav { flex-wrap: wrap; padding: 12px !important; } .customer-nav__brand { width: 100%; padding: 0 12px 6px; } .sync-status { flex-direction: column; align-items: start; } .communication-form-grid { grid-template-columns: 1fr; } .actions-page .card, .settings-page .card { padding: 16px; } .communication-controls > label { width: 100%; } .actions-heading > div { width: 100%; } }