/* Compact symbols: selected concept 2 — 2026-11-03.
   Presentation only. Values and permissions in Supabase are untouched.
   No llegar = red symbol cell; No trespassing = editable dark-red entire row.
*/
#streetPagesLive .street-page table {table-layout:fixed!important;width:100%!important;min-width:0!important}
#streetPagesLive .street-page table th:nth-child(1),#streetPagesLive .street-page table td:nth-child(1){width:18%!important}
#streetPagesLive .street-page table th:nth-child(2),#streetPagesLive .street-page table td:nth-child(2){width:20%!important}
#streetPagesLive .street-page table th:nth-child(3),#streetPagesLive .street-page table td:nth-child(3){width:44%!important}
#streetPagesLive .street-page table th:nth-child(4),#streetPagesLive .street-page table td:nth-child(4){width:18%!important}
#streetPagesLive .street-page td:nth-child(2){position:relative!important;vertical-align:middle!important}
#streetPagesLive .street-page .langwrap{
 position:relative!important;display:flex!important;align-items:stretch!important;
 height:42px!important;min-height:42px!important;max-height:42px!important;
 gap:3px!important;padding:3px 2px!important;border-radius:8px!important;
 border:1px solid #cbd8d1!important;background:#f8faf9!important;
 overflow:hidden!important;box-sizing:border-box!important;
}
#streetPagesLive .street-page .langwrap .langbadge{
 display:block!important;position:relative!important;width:4px!important;min-width:4px!important;
 flex:0 0 4px!important;border-radius:5px!important;height:auto!important;min-height:0!important;
}
/* The native select remains full-size and operative, with existing change/save
   listeners; visual text above it is non-interactive and never receives focus. */
#streetPagesLive .street-page .langwrap select[data-field="language"]{
 position:absolute!important;inset:0!important;z-index:3!important;display:block!important;
 width:100%!important;height:100%!important;min-height:0!important;
 opacity:0!important;cursor:pointer!important;pointer-events:auto!important;
 padding:0!important;margin:0!important;border:0!important;background:transparent!important;
 font-size:16px!important;
}
#streetPagesLive .street-page .langwrap .symbol-visible{
 display:flex!important;align-items:center!important;justify-content:center!important;
 position:relative!important;flex:1 1 auto!important;min-width:0!important;
 padding:0 12px 0 1px!important;text-align:center!important;
 overflow:hidden!important;white-space:normal!important;word-break:normal!important;
 line-height:1.05!important;letter-spacing:-.15px!important;
 font:800 clamp(9px,2.65vw,12px)/1.06 -apple-system,BlinkMacSystemFont,system-ui,sans-serif!important;
 color:#13221d!important;pointer-events:none!important;
}
#streetPagesLive .street-page .langwrap .symbol-visible::after{
 content:"";position:absolute;right:2px;top:50%;width:5px;height:5px;
 border-right:2px solid currentColor;border-bottom:2px solid currentColor;
 transform:translateY(-70%) rotate(45deg);opacity:.9;
}
#streetPagesLive .street-page .langwrap.state-en{background:#d9f0ff!important;border-color:#8fcaf0!important}
#streetPagesLive .street-page .langwrap.state-es{background:#d8f3d8!important;border-color:#86cc93!important}
#streetPagesLive .street-page .langwrap.state-other{background:#f4eeff!important;border-color:#d8c9ee!important}
#streetPagesLive .street-page .langwrap.state-other .langbadge{background:#8053b5!important}
#streetPagesLive .street-page .langwrap.state-attention{background:#ffe0a5!important;border-color:#df9e28!important}
#streetPagesLive .street-page .langwrap.state-letter{background:#fef08a!important;border-color:#facc15!important}
#streetPagesLive .street-page .langwrap.state-dog{background:#e53935!important;border-color:#bb1719!important}
#streetPagesLive .street-page .langwrap.state-dog .symbol-visible{color:white!important}
/* No llegar: RED DROPDOWN CELL ONLY. Do not tint the row or adjacent cells. */
#streetPagesLive .street-page tr:not(.special-no-llegar):not(.is-no-trespassing) .langwrap.state-no{
 background:#d62828!important;border:1.5px solid #a9151c!important;
}
#streetPagesLive .street-page .langwrap.state-no .symbol-visible{color:#fff!important}
/* No trespassing is a separate, normal user-editable choice. Full-row maroon. */
#streetPagesLive .street-page tbody tr.is-no-trespassing,
#streetPagesLive .street-page tbody tr.is-no-trespassing > td{
 background-color:#870e12!important;color:#fff!important;border-color:#ad4b4e!important;
}
#streetPagesLive .street-page tbody tr.is-no-trespassing .langwrap{
 background:#a51a20!important;border:1px solid #d18486!important;
}
#streetPagesLive .street-page tbody tr.is-no-trespassing .symbol-visible{color:#fff!important}
#streetPagesLive .street-page tbody tr.is-no-trespassing .langbadge.nt{background:#ff7373!important}
#streetPagesLive .street-page tbody tr.is-no-trespassing input[data-field="house_number"],
#streetPagesLive .street-page tbody tr.is-no-trespassing input[data-field="observations"]{
 background:#94191d!important;border-color:#ce7b7c!important;color:#fff!important;
 -webkit-text-fill-color:#fff!important;caret-color:#fff!important;
}
#streetPagesLive .street-page tbody tr.is-no-trespassing .nk-name-display{
 background:#94191d!important;border-color:#ce7b7c!important;color:#fff!important;
}
#streetPagesLive .street-page tbody tr.is-no-trespassing .nk-name-display.name-keyboard-selected{
 background:#722026!important;outline-color:#fff!important;
}
/* Don't let the enlarged observation row stretch the compact dropdown. */
#streetPagesLive .street-page tr.row-has-wrapped-text .langwrap,
#streetPagesLive .street-page tr.row-has-wrapped-text .langwrap select[data-field="language"]{
 height:42px!important;min-height:42px!important;max-height:42px!important;
}
#streetPagesLive .street-page th:nth-child(2){font-size:10.5px!important;white-space:nowrap!important}
#streetPagesLive .street-page th:nth-child(3){font-size:11px!important}
@media(max-width:350px){
 #streetPagesLive .street-page .langwrap .symbol-visible{font-size:9px!important;letter-spacing:-.3px!important;padding-right:9px!important}
 #streetPagesLive .street-page .langwrap .symbol-visible::after{right:1px;width:4px;height:4px}
}
@media print{
 #streetPagesLive .street-page tbody tr.is-no-trespassing,#streetPagesLive .street-page tbody tr.is-no-trespassing td{color:#111!important;background:#eee!important}
}

/* 2026-11-03 — readable, left-aligned dropdown labels.
   The native select stays transparent and interactive; styling affects display only. */
#streetPagesLive .street-page .langwrap .symbol-visible{
 justify-content:flex-start!important;text-align:left!important;
 padding-left:4px!important;padding-right:11px!important;
 line-height:1.04!important;
}
/* ESP / ING / NC / Perro: bigger lettering without enlarging the symbol column. */
#streetPagesLive .street-page .langwrap.state-en .symbol-visible,
#streetPagesLive .street-page .langwrap.state-es .symbol-visible,
#streetPagesLive .street-page .langwrap.state-nc .symbol-visible{
 font-size:clamp(15px,4.6vw,19px)!important;
 font-weight:850!important;letter-spacing:-.35px!important;
}
#streetPagesLive .street-page .langwrap.state-dog .symbol-visible{
 font-size:clamp(13px,3.9vw,16px)!important;
 font-weight:850!important;letter-spacing:-.4px!important;
}
/* Only the No llegar selector is red. Keep two lines and left alignment. */
#streetPagesLive .street-page .langwrap.state-no .symbol-visible{
 font-size:clamp(11px,3.2vw,13px)!important;
 font-weight:850!important;line-height:1.08!important;
}
/* No trespassing: show ALL characters. Its long word is wrapped across two
   additional lines (TRES / PASSING), rather than truncated before the T.
   Keep the chevron in the unused upper-right corner of this status. */
#streetPagesLive .street-page .langwrap.state-nt .symbol-visible{
 font-size:clamp(10px,2.85vw,12px)!important;
 font-weight:850!important;
 padding-left:2px!important;padding-right:0!important;
 letter-spacing:-.42px!important;line-height:1.02!important;
}
#streetPagesLive .street-page .langwrap.state-nt .symbol-visible::after{
 top:9px!important;right:2px!important;
}
/* Other two-line choices must still fit the narrow column. */
#streetPagesLive .street-page .langwrap.state-other .symbol-visible{
 font-size:clamp(10px,2.9vw,12px)!important;
 font-weight:850!important;
}
/* Option list legibility in browsers that allow styling <option>. */
#streetPagesLive .street-page .langwrap select[data-field="language"] option{
 font-size:17px!important;
}
@media(max-width:350px){
 #streetPagesLive .street-page .langwrap .symbol-visible{padding-left:3px!important;padding-right:8px!important}
 #streetPagesLive .street-page .langwrap.state-nt .symbol-visible{padding-left:1px!important;padding-right:0!important}
}

/* Put the chevron beside the first line of two-line statuses, keeping
   LLEGAR and IDIOMA unobstructed on the second line. */
#streetPagesLive .street-page .langwrap.state-no .symbol-visible,
#streetPagesLive .street-page .langwrap.state-other .symbol-visible{
 padding-right:0!important;
}
#streetPagesLive .street-page .langwrap.state-no .symbol-visible::after,
#streetPagesLive .street-page .langwrap.state-other .symbol-visible::after{
 top:9px!important;right:2px!important;
}

/* 2026-11-03 — Regular-weight short labels, bolder address numbers,
   +5 percentage points for resident names (taken only from Observaciones).
   No changes to field names, dropdown options, keyboard, save operations. */
#streetPagesLive .street-page table th:nth-child(1),
#streetPagesLive .street-page table td:nth-child(1){width:18%!important}
#streetPagesLive .street-page table th:nth-child(2),
#streetPagesLive .street-page table td:nth-child(2){width:20%!important}
#streetPagesLive .street-page table th:nth-child(3),
#streetPagesLive .street-page table td:nth-child(3){width:39%!important}
#streetPagesLive .street-page table th:nth-child(4),
#streetPagesLive .street-page table td:nth-child(4){width:23%!important}
/* Keep ING/ESP/NC at the larger size, but without bold lettering. */
#streetPagesLive .street-page .langwrap.state-en .symbol-visible,
#streetPagesLive .street-page .langwrap.state-es .symbol-visible{
 font-weight:800!important;
}
#streetPagesLive .street-page .langwrap.state-nc .symbol-visible{
 font-weight:400!important;
}
/* Where supported, selected options in the native dropdown should also be normal. */
#streetPagesLive .street-page .langwrap.state-en select[data-field="language"],
#streetPagesLive .street-page .langwrap.state-es select[data-field="language"],
#streetPagesLive .street-page .langwrap select[data-field="language"] option[value="Ingles"],
#streetPagesLive .street-page .langwrap select[data-field="language"] option[value="espanol"]{
 font-weight:800!important;
}
#streetPagesLive .street-page .langwrap.state-nc select[data-field="language"],
#streetPagesLive .street-page .langwrap select[data-field="language"] option[value="NC"]{
 font-weight:400!important;
}
/* Bold address digits in the editable rows (not the symbol column). */
#streetPagesLive .street-page tbody td:first-child input[data-field="house_number"]{
 font-weight:800!important;
}
/* Use the extra Names width efficiently without increasing row height. */
#streetPagesLive .street-page td:nth-child(4){
 padding-left:3px!important;padding-right:3px!important;
}
#streetPagesLive .street-page td:nth-child(4) .nk-name-display{
 padding-left:3px!important;padding-right:3px!important;
}
/* Extra compact phones need a little more room for seven to eight letters.
   Regular phones retain the conservative 39%/23% proportions above. */
@media(max-width:350px){
 #streetPagesLive .street-page table th:nth-child(3),
 #streetPagesLive .street-page table td:nth-child(3){width:35%!important}
 #streetPagesLive .street-page table th:nth-child(4),
 #streetPagesLive .street-page table td:nth-child(4){width:27%!important}
}


/* 2026-11-03 — allow the symbol cell to grow with expanded Observaciones.
   Keep the compact label styling, but match the taller row height. */
#streetPagesLive .street-page tr.row-has-wrapped-text .langwrap,
#streetPagesLive .street-page tr.row-has-wrapped-text .langwrap select[data-field="language"]{
 height:var(--text-row-height,68px)!important;
 min-height:var(--text-row-height,68px)!important;
 max-height:none!important;
}
#streetPagesLive .street-page tr.row-has-wrapped-text .langwrap{
 align-items:stretch!important;
}
#streetPagesLive .street-page tr.row-has-wrapped-text .langwrap .symbol-visible{
 min-height:100%!important;
 display:flex!important;
 align-items:center!important;
}


/* 2026-11-03 — ING/ESP bold again with slightly stronger blue/green. */