/* Dorax Finance — the company's side in the summary's look (v214, owner, 2026-10-13: "actualiza la vista empresa en el backend, aún tienen la
   versión vieja"). Until now the look (css/look/look-land*.css) was the household's alone and the company kept the look before it, in blue. Now
   both sides have the same shapes, letters and buttons, and the company wears its own colours (owner, same day: "no me gusta el azul, usa blanco y
   #F2F4EE", then, between two versions of its summary on a review artifact, "verde y blanco"):
     - the block at the top, the bars and the side menu stay the household's forest #112622;
     - where the household has its lime on the forest (the strip under the figure, the chosen pill, the screen in use, the main button on the block,
       the marks), the company has white;
     - the page is #F2F4EE with white cards; on it (and on the panels) the main button, the chosen icon and the nearest bill are the forest with white
       words (--lk-pop, look-land.css), since white would not show on white.
   The look's colours are words since v214 (--lk-*, look-land.css): here the company's side gives them its values. In the dark theme the page stays
   the look's dark one and the accent is white. What a colour MEANS stays the same on both sides: money that came in is green, late or over is red.
   Contrast, measured: #112622 on white 15.9:1 (either way round), #112622 on #F2F4EE 14.3:1, #454745 on #E6EAE0 7.7:1. */
:root.side-co {
  --lk-lime: #FFFFFF; --lk-lime-rgb: 255, 255, 255; --lk-lime-hi: #F2F4EE; --lk-lime-lo: #E3E7DD; --lk-lime-2: #DCE3D3; --lk-mint: #C9D2C4;
}
:root.side-co:not(.land-dark) { --lk-pop: var(--lk-deep); --lk-pop-ink: #FFFFFF; --lk-pop-hi: var(--lk-deep-2); --lk-pop-lo: #0B1A17; }
:root.land.side-co:not(.land-dark) { --bq-page: #F2F4EE; --bq-page-glass: rgba(242, 244, 238, .92); --bq-mint: #E6EAE0; --bq-mint-ink-2: #454745; }
:root.land.side-co.land-dark { --bq-in: #B6DD62; }      /* money that came in stays green in the dark theme (the household's is its lime) */
@media (min-width: 921px) {
  :root.land.side-co:not(.land-dark) { --dk-now: rgba(var(--lk-deep-rgb), .07); --dk-mint-ink: #454745; }
  :root.land-dark.side-co { --dk-pos: #B6DD62; }
}

/* the currency (BRL | USD) on the block, as Transactions' switch: a glass track, the chosen one in the accent with the block's words */
:root.land .space .seg { gap: 4px; padding: 4px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }
:root.land .space .seg button { display: grid; place-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; color: var(--lk-soft); font-size: 13.5px; font-weight: 500; }
:root.land .space .seg button[aria-pressed="true"] { background: var(--lk-lime); color: var(--lk-deep); font-weight: 600; box-shadow: none; }
:root.land .space .seg button:focus-visible { outline: 2px solid var(--lk-lime); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { :root.land .space .seg button[aria-pressed="false"]:hover { color: #FFFFFF; background: rgba(255, 255, 255, .08); } }
:root.land .space .hint { color: var(--lk-soft); }
@media (max-width: 920px) {
  :root.land .space .seg button { min-height: 44px; }      /* under a thumb: 44 px, on the summary and on Plan, Goals and Reports */
  :root.land .bar-bal.co .bb-link b .cents { font-size: max(12px, .5em); }      /* a long balance made smaller beside the currency (phone.view.js: fitCoBal): its cents never under 12 px */
}

/* ---------- a phone: the month as a sum, on the block ---------- */
:root.land .bq-co-top { all: unset; box-sizing: border-box; touch-action: manipulation; -webkit-user-select: none; user-select: none; cursor: pointer; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; width: 100%; padding: 14px 16px 18px; background: var(--lk-deep); color: #FFFFFF; }
:root.land .bq-co-top:focus-visible { outline: 2px solid var(--lk-lime); outline-offset: -4px; }
:root.land .bq-co-v { color: #FFFFFF; font-family: var(--fig); font-size: 28px; font-weight: 600; letter-spacing: -.03em; line-height: 1; }
:root.land .bq-co-v .cents { color: var(--lk-soft); font-size: .55em; letter-spacing: 0; }
:root.land .bq-co-v.neg { color: #FF8A80; }
:root.land .bq-co-sum { color: var(--lk-soft); font-size: 13px; font-weight: 500; line-height: 1.4; }
:root.land .bq-co-sum b { color: #FFFFFF; font-weight: 600; }

/* ---------- the company itself: its name, its kind, the way to edit it ---------- */
:root.land .bq-co-id { display: flex; align-items: center; gap: 12px; min-width: 0; }
:root.land #view > .bq-co-id { padding: 12px 12px 12px 16px; border-radius: 24px; background: var(--bq-card); }
:root.land .bq-co-ic { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--bq-circle); color: var(--bq-accent); }
:root.land .bq-co-ic svg { width: 20px; height: 20px; }
:root.land .bq-co-n { flex: 1 1 auto; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; min-width: 0; }
:root.land .bq-co-n b { color: var(--bq-ink); font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
:root.land .bq-co-n small { color: var(--bq-ink-3); font-size: 13px; font-weight: 500; }
:root.land .bq-co-edit { all: unset; box-sizing: border-box; cursor: pointer; flex: none; display: grid; place-items: center; min-height: 44px; padding: 0 18px; border-radius: 999px; background: var(--bq-circle); color: var(--bq-ink); font-size: 14px; font-weight: 600; }
:root.land .bq-co-edit:focus-visible { outline: 2px solid var(--bq-accent); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { :root.land .bq-co-edit:hover { background: var(--bq-circle-2); } }
/* on the computer's header, on the block: light words, no card */
:root.land .bq-dhero .bq-co-id { margin-bottom: 14px; }
:root.land .bq-dhero .bq-co-ic { width: 40px; height: 40px; background: rgba(255, 255, 255, .08); color: var(--lk-lime); }
:root.land .bq-dhero .bq-co-n b { color: #FFFFFF; }
:root.land .bq-dhero .bq-co-n small { color: var(--lk-soft); }
:root.land .bq-dhero .bq-co-edit { min-height: 36px; padding: 0 14px; background: rgba(255, 255, 255, .08); color: #FFFFFF; font-size: 13px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); }
:root.land .bq-dhero .bq-co-edit:focus-visible { outline-color: var(--lk-lime); }
@media (hover: hover) and (pointer: fine) { :root.land .bq-dhero .bq-co-edit:hover { background: rgba(255, 255, 255, .14); } }

/* the word "Company" beside the logo, on the forest side menu: light, as the menu's other words */
:root.land .rail .side-tag { border-color: rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .1); color: #FFFFFF; }