/* Screens of task 23799 (design #23726: 01 auth, 02 dashboard, 03 proceedings). Tokens only; loaded after arbitrage.css. */

/* helpers */
.arb-hidden { display: none !important; }
.arb-mt-2 { margin-top: var(--mds-space-2); }
.arb-mt-3 { margin-top: var(--mds-space-3); }
.arb-mt-4 { margin-top: var(--mds-space-4); }
.arb-gap-2 { --mds-gap: var(--mds-space-2); }
.arb-gap-3 { --mds-gap: var(--mds-space-3); }
.arb-gap-1 { --mds-gap: var(--mds-space-1); }
.arb-gap-6 { --mds-gap: var(--mds-space-6); }
.arb-flex-1 { flex: 1; min-width: 0; }
.arb-w-auto { width: auto; }
.arb-center { justify-content: center; }
.arb-text { color: var(--mds-text); }
.arb-list { display: flex; flex-direction: column; gap: var(--mds-space-4); }

/* dropdown on <details> (page actions, row menu) */
.arb-dd { position: relative; display: inline-block; }
.arb-dd > summary { list-style: none; }
.arb-dd > summary::-webkit-details-marker { display: none; }
.arb-dd__menu { position: absolute; top: calc(100% + var(--mds-space-1)); left: 0; width: 240px; }
.arb-dd--end .arb-dd__menu, .mds-page-header__actions .arb-dd__menu { left: auto; right: 0; --mds-origin: top right; }
.arb-dd__menu a.mds-menu__item { text-decoration: none; }
.mds-menu__item[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }

/* 03 proceedings list (from mockups/03-proceedings.html) */
.arb-tabs { overflow-x: auto; scrollbar-width: none; }
/* five stage tabs + «Բոլորը» (the mockup has four): tighter padding so they fit at 1440 */
.arb-tabs .mds-tab { padding: 0 var(--mds-space-2); }
.arb-list-search { width: min(360px, 100%); }
.arb-contract { max-width: 150px; display: block; }
.arb-jud { font-size: var(--mds-text-xs); color: var(--mds-text-2); margin-top: var(--mds-space-1); max-width: 190px; }
.arb-resp-m { font-size: var(--mds-text-sm); color: var(--mds-text); }
.arb-list .mds-table td { padding-top: var(--mds-space-2); padding-bottom: var(--mds-space-2); }
.arb-filters { position: relative; }
.arb-popover { position: absolute; top: calc(100% + var(--mds-space-2)); left: 0; z-index: var(--mds-z-dropdown); width: 380px; max-width: 100%; box-sizing: border-box; padding: var(--mds-space-4); background: var(--mds-surface); border-radius: var(--mds-radius-lg); box-shadow: var(--mds-shadow-2); }
.arb-chip-x { display: inline-flex; margin-right: calc(var(--mds-space-1) * -1); }
.arb-skel { display: block; height: 12px; }
@media (max-width: 1023px) { .arb-popover { position: static; width: auto; } }
@media (max-width: 767px) {
  .arb-list .mds-toolbar { flex-wrap: nowrap; overflow-x: auto; }
  .arb-list-search { min-width: 220px; }
  .arb-list .mds-toolbar .mds-chip { flex: none; }
  .arb-list .mds-page-header__actions, .arb-list .mds-page-header__actions > * { width: 100%; }
  .arb-list .mds-page-header__actions .mds-btn { width: 100%; justify-content: center; }
}

/* 01 auth (from mockups/01-auth.html) */
.arb-auth-body { margin: 0; }
.arb-auth__intro { --mds-gap: var(--mds-space-3); max-width: 420px; }
.arb-auth__note { font-size: var(--mds-text-xs); }
.arb-auth__link { font-size: var(--mds-text-sm); }
.arb-auth__form { max-width: none; }
.arb-auth__sent { background: var(--mds-success-soft); color: var(--mds-success); }
.arb-rules { list-style: none; padding: 0; margin: var(--mds-space-1) 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: var(--mds-space-1) var(--mds-space-3); font-size: var(--mds-text-sm); }
.arb-rules li { display: flex; align-items: center; gap: var(--mds-space-1); color: var(--mds-text-3); }
.arb-rules li[data-ok="true"] { color: var(--mds-success); }
.arb-rules li[data-ok="true"] .arb-rule-no, .arb-rules li[data-ok="false"] .arb-rule-ok { display: none; }
@media (max-width: 767px) { .arb-rules { grid-template-columns: 1fr; } .arb-auth__main .mds-input { min-height: 44px; } }

/* 02 dashboard (from mockups/02-dashboard.html; the bar count is a variable: 13 weeks or 12 months) */
.arb-text-sm { font-size: var(--mds-text-sm); }
.arb-sk-40 { height: 40px; }
.arb-sk-inline { display: inline-block; width: 220px; height: 1em; vertical-align: middle; }
.arb-sk-label { height: 12px; width: 70%; }
.arb-sk-value { height: 28px; width: 50%; margin-top: var(--mds-space-3); }
.arb-sk-meta { height: 10px; width: 60%; margin-top: var(--mds-space-2); }
.arb-sk-chart { display: block; height: 220px; }
.arb-dash { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: var(--mds-space-6); align-items: start; }
@media (max-width: 1279px) { .arb-dash { grid-template-columns: minmax(0, 1fr); } }
.arb-dash .mds-card__header { gap: var(--mds-space-2); }
.arb-dash .mds-table td .mds-truncate { display: block; max-width: 220px; }
.arb-att-list, .arb-imp-list { list-style: none; margin: 0; padding: 0; }
.arb-att { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: var(--mds-space-3); align-items: center; padding: var(--mds-space-3) var(--mds-space-4); border-top: 1px solid var(--mds-divider); }
.arb-att:first-child { border-top: 0; }
.arb-att__icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: var(--mds-radius-md); background: var(--mds-surface-2); color: var(--mds-text-2); flex: none; }
.arb-att__icon--danger { background: var(--mds-danger-soft); color: var(--mds-danger); }
.arb-att__icon--warning { background: var(--mds-warning-soft); color: var(--mds-warning); }
.arb-att__icon--info { background: var(--mds-info-soft); color: var(--mds-info); }
.arb-att__icon--success { background: var(--mds-success-soft); color: var(--mds-success); }
.arb-att__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.arb-att__text b { font-weight: var(--mds-weight-medium); }
.arb-att__text span { font-size: var(--mds-text-sm); color: var(--mds-text-2); }
.arb-imp { display: flex; flex-direction: column; gap: var(--mds-space-1); padding: var(--mds-space-3) var(--mds-space-4); border-top: 1px solid var(--mds-divider); font-size: var(--mds-text-sm); min-width: 0; }
.arb-imp:first-child { border-top: 0; }
.arb-imp__top { display: flex; justify-content: space-between; align-items: center; gap: var(--mds-space-2); font-size: var(--mds-text-md); min-width: 0; }
.arb-imp__top b { font-weight: var(--mds-weight-medium); }
.arb-imp .mds-progress { margin-top: var(--mds-space-1); }
.arb-imp__top .mds-badge { flex: none; }
.arb-chart { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); grid-template-rows: 220px auto; column-gap: var(--mds-space-2); }
.arb-chart__grid { grid-column: 1 / -1; grid-row: 1; position: relative; }
.arb-chart__grid span { position: absolute; left: 40px; right: 0; border-top: 1px solid var(--mds-chart-grid); }
.arb-chart__grid em { position: absolute; left: -40px; width: 32px; text-align: right; transform: translateY(-50%); font-style: normal; font-size: var(--mds-text-xs); color: var(--mds-text-3); font-variant-numeric: tabular-nums; }
.arb-chart__bars { grid-column: 2; grid-row: 1; display: grid; grid-template-columns: repeat(var(--arb-bars, 13), minmax(0, 1fr)); gap: var(--mds-space-2); align-items: end; position: relative; }
.arb-bar { position: relative; height: var(--h); background: var(--mds-p-ink-300); border-radius: var(--mds-radius-xs) var(--mds-radius-xs) 0 0; }
.arb-bar.is-cur { background: var(--mds-accent); }
.arb-bar__v { position: absolute; bottom: 100%; left: 0; right: 0; text-align: center; font-size: var(--mds-text-xs); color: var(--mds-text-2); padding-bottom: 2px; font-variant-numeric: tabular-nums; }
.arb-tip { display: none; position: absolute; right: calc(100% + 8px); top: 0; width: max-content; padding: var(--mds-space-2) var(--mds-space-3); background: var(--mds-surface); border-radius: var(--mds-radius-md); box-shadow: var(--mds-shadow-2); font-size: var(--mds-text-xs); line-height: var(--mds-leading-snug); z-index: 2; }
.arb-bar:hover .arb-tip, .arb-bar:focus-within .arb-tip { display: block; }
.arb-chart__x { grid-column: 2; display: grid; grid-template-columns: repeat(var(--arb-bars, 13), minmax(0, 1fr)); gap: var(--mds-space-2); font-size: var(--mds-text-xs); color: var(--mds-text-3); text-align: center; padding-top: var(--mds-space-2); font-variant-numeric: tabular-nums; }
@media (max-width: 767px) {
  .arb-att { grid-template-columns: 32px minmax(0, 1fr); }
  .arb-att .mds-btn { grid-column: 2; justify-self: start; }
  .arb-chart__bars, .arb-chart__x { gap: var(--mds-space-1); }
  .arb-bar__v, .arb-tip { display: none; }
  .arb-page .mds-page-header__actions { width: 100%; }
}
.arb-popover .mds-segmented { display: flex; width: 100%; } .arb-popover .mds-segmented button { flex: 1; padding-left: var(--mds-space-2); padding-right: var(--mds-space-2); }
