/* apple-design web adaptation: preserve brand and financial behavior. */
.operation-history-hero {
  background:linear-gradient(115deg,#3155b4,#286a94);
}
.operation-history-hero h1 { line-height:1.2; text-wrap:balance; }
.operation-history-balance { font-variant-numeric:tabular-nums; line-height:1.3; overflow-wrap:anywhere; }
.operation-history-filters { gap:12px; }
.operation-history-filters :is(input,select,button),
.operation-history-filters .searchable-select-input { min-height:44px; }
.operation-history-filters button[id$="Prev"],
.operation-history-filters button[id$="Next"] { min-width:44px; background:#ffffff14; border:1px solid #ffffff80; }
.operation-history-filters button[type="submit"] { background:#fff; color:#244b99; border:1px solid #fff; font-weight:650; padding:10px 16px; }
.operation-history-filters button[type="submit"]:hover { background:#edf3ff; }
.operation-history-main { grid-template-columns:105px minmax(135px,max-content) minmax(0,1fr) 180px; }
.operation-history-main :is(b,small),.operation-history-kind { overflow-wrap:anywhere; }
.operation-history-main strong { font-variant-numeric:tabular-nums; }
.operation-history-main .positive { color:#237044; }
.operation-history-main .negative { color:#b63d36; }
.operation-history-main time,.operation-history-kind { color:#586b80; }
.operation-history-event { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; padding:6px 0; line-height:1.5; }
.operation-history-event > span { flex:1 1 240px; min-width:0; overflow-wrap:anywhere; }
.operation-history-event details { display:block; margin:0; flex:1 1 100%; min-width:0; }
.operation-history-event summary { box-sizing:border-box; width:max-content; min-height:44px; padding:10px 12px; border:1px solid #cbd8ed; border-radius:6px; color:#2857b1; background:#f5f8ff; }
.operation-history-event summary:hover { background:#eaf1ff; }
.operation-history-event .history-entry { max-width:100%; }
#view-operation-history .empty { padding:20px; border:1px solid #d9e2ed; border-radius:8px; background:#fff; color:#516273; line-height:1.5; }
#view-operation-history [role="alert"] { border-color:#b63d36; color:#9e302b; }
:is(summary,textarea):focus-visible { outline:3px solid #2857b1; outline-offset:3px; }
.operation-history-filters :focus-visible { outline:3px solid #fff; outline-offset:3px; box-shadow:0 0 0 2px #244b99; }
@media(max-width:800px) {
  .operation-history-main { grid-template-columns:minmax(0,1fr) auto; }
  .operation-history-main strong { text-align:right; }
  .operation-history-filters { display:grid; grid-template-columns:44px minmax(0,1fr) 44px; align-items:end; }
  .operation-history-filters label { min-width:0; }
  .operation-history-filters label:nth-of-type(1) { grid-column:2; grid-row:1; }
  .operation-history-filters label:nth-of-type(2) { grid-column:2; grid-row:2; }
  #operationHistoryPrev { grid-column:1; grid-row:1 / 3; align-self:center; }
  #operationHistoryNext { grid-column:3; grid-row:1 / 3; align-self:center; }
  .operation-history-filters label:nth-of-type(3),.operation-history-filters button[type="submit"] { grid-column:1 / -1; }
  .operation-history-filters :is(input,select,.searchable-select) { width:100%; min-width:0; max-width:100%; }
  .topbar :is(#switchBusiness,#logoutBtn) { min-height:44px; padding:8px 10px; }
}
@media(max-width:360px) {
  .operation-history-hero h1 { font-size:1.6rem; }
  .operation-history-main { padding:12px; gap:8px; }
  .operation-history-main strong { font-size:.85rem; }
  .operation-history-events { padding:8px 12px 12px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
}
/* Keep the company controls on the first row at the narrowest tested width. */
@media(max-width:360px) {
  .topbar .brand { font-size:.93rem; gap:5px; }
  .topbar :is(#switchBusiness,#logoutBtn) { padding-inline:6px; }
}
@media(max-width:800px) {
  #view-accounts .view-head { flex-wrap:wrap; }
  #view-accounts .view-head h1 { flex:1 0 100%; }
}
/* A visible keyboard focus on light surfaces, with a light ring in the header. */
:is(button,a,input,select,[tabindex]):focus-visible { outline:3px solid #2857b1; outline-offset:3px; }
.topbar :is(a,button):focus-visible { outline-color:#fff; }
.op-amount-box:focus-within { border-color:#2857b1; box-shadow:0 0 0 3px #2857b130; }
@media(max-width:800px) {
  #opForm .op-amount-box input#opAmount { font-size:clamp(1.05rem,5.5vw,1.35rem); letter-spacing:normal; }
}
#view-money .transaction .value { font-variant-numeric:tabular-nums; white-space:normal; overflow-wrap:anywhere; }
#view-money .transaction .value.positive { color:#237044; }
#view-money .transaction .value.negative { color:#7434b1; }
@media(max-width:800px) {
  #view-money .transaction .value { grid-column:2 / -1; justify-self:end; max-width:100%; text-align:right; }
  #view-money .transaction .transaction-state { grid-row:2; }
}

/* History filter entry point remains full width in the mobile period grid. */
@media(max-width:800px) {
 .operation-history-filters #historyFilterToggle { grid-column:1 / -1; min-height:44px; }
 #historyFilterPanel { max-height:none; overflow:visible; }
}

#historyFilterPanel :is(.segmented button,.filter-operator button,.multi-filter-option,.multi-filter-done) { min-height:44px; }
#historyFilterPanel .filter-close { width:44px; height:44px; }
#historyFilterPanel .history-filter-actions { display:flex; flex-wrap:wrap; gap:10px; margin:16px 0 0 186px; }
#historyFilterPanel :is(#historyFilterApply,#historyFilterReset) { min-height:44px; margin:0; padding:10px 16px; transform:none; border-radius:5px; font:inherit; cursor:pointer; }
@media(max-width:800px) { #historyFilterPanel .history-filter-actions { margin-left:0; } }