/* Plate frames use the same proportions across public pages and the inbox. */
.plate, .number-links .plate {
  display: inline-flex; align-items: stretch; vertical-align: middle; flex-shrink: 0;
  padding: 3px; border: 1px solid #202923; border-radius: 9px;
  background: #39443d; color: #202923; font: 700 24px/1.1 "Consolas", "Courier New", monospace;
  letter-spacing: .025em; white-space: nowrap;
  box-shadow: 0 2px 0 #18231c, 0 5px 12px #26322914;
}
.plate-main {display: flex; align-items: center; padding: 10px 12px; background: #fffef9; border-radius: 4px 0 0 4px;}
.plate-region {display: flex; flex-direction: column; justify-content: center; align-items: center; min-width: 53px; padding: 3px 7px; background: #fffef9; border-left: 1px solid #657065; border-radius: 0 4px 4px 0; font: 700 24px/1.1 "Consolas", "Courier New", monospace;}
.plate-region small, .plate-input-country {display: flex; align-items: center; justify-content: center; gap: 4px; font: 600 9px/12px Arial, sans-serif; letter-spacing: .02em;}
.plate-flag {display: inline-block; width: 15px; height: 10px; border: 1px solid #9ba097; background: linear-gradient(to bottom, white 0 33.33%, #2154a4 33.33% 66.66%, #d84942 66.66%);}
.plate--taxi .plate-main, .plate--taxi .plate-region {background: #ffe9a4;}
.plate.plate--compact {font-size: 17px; padding: 2px; border-radius: 7px;}
.plate--compact .plate-main {padding: 7px 8px;}
.plate--compact .plate-region {font-size: 18px; min-width: 39px; padding: 2px 4px;}
.plate--compact .plate-region small {font-size: 7px; gap: 2px; line-height: 9px;}
.plate--compact .plate-flag {width: 11px; height: 8px;}
.plate-link {display: inline-flex; text-decoration: none; border-radius: 9px; transition: transform .15s;}
.plate-link:hover {transform: translateY(-2px);}
.plate-link:focus-visible {outline: 3px solid #ed643e; outline-offset: 5px;}
.plate-link:hover .plate {box-shadow: 0 2px 0 #18231c, 0 5px 14px #ed643e35;}
.content-heading h1 .plate {font-size: clamp(22px, 4vw, 40px); margin-top: 12px; letter-spacing: .02em;}
.content-heading h1 .plate-region {font-size: clamp(24px, 4vw, 36px);}
.hero-plate-display {position: absolute; z-index: 2; top: 57%; left: 33%; transform: rotate(-6deg);}
.hero-plate-display .plate {font-size: 29px; box-shadow: 0 2px 0 #18231c, 0 12px 25px #26322924;}
.inbox-summary .plate {margin-bottom: 5px;}
.chat-own-plate {display: flex; align-items: center; gap: 6px; margin-top: 8px;}
.chat-head {flex-wrap: wrap;}
.chat-head h2 {margin: 0;}
.vehicle-card-top {flex-wrap: wrap;}
.waiting-alert > .plate {margin: 10px 0;}
.vehicle-options {border: 0; padding: 0; margin: 0; display: grid; gap: 8px; min-width: 0;}
.vehicle-options legend {font-size: 12px; font-weight: 600; margin-bottom: 10px;}
.form-stack .vehicle-option {display: flex; flex-direction: row; align-items: center; gap: 10px; border: 1px solid #d7ddd1; border-radius: 10px; padding: 12px; cursor: pointer;}
.vehicle-option:has(input:checked) {background: #f2f6ed; border-color: #889b7a;}
.form-stack .vehicle-option input {width: 17px; min-height: 17px; height: 17px; margin: 0; accent-color: #ed643e; flex-shrink: 0;}
.vehicle-option > span > small {display: block; margin-top: 7px; font-size: 12px; color: #52604f;}
.plate-field {min-width: 0; width: 100%; display: flex; flex-direction: column; gap: 8px;}
.plate-input-frame {display: flex; align-items: stretch; padding: 3px; border: 2px solid #39443d; border-radius: 9px; background: #fffef9; box-shadow: inset 0 0 0 1px #bbc0b4;}
.plate-input-frame:focus-within {border-color: #ed643e; outline: 3px solid #ed643e20;}
.plate-input-frame:has([aria-invalid="true"]) {border-color: #b33d27;}
.plate-field .plate-input-frame input {flex: 1; width: 100%; min-width: 0; border: 0; outline: 0; border-radius: 3px; background: transparent; box-shadow: none; min-height: 48px; padding: 9px 8px; color: #202923; font: 700 23px/1.3 "Consolas", "Courier New", monospace; letter-spacing: .02em;}
.plate-input-country {padding: 0 6px; border-left: 1px solid #727b73; flex-direction: column;}
.plate-field .plate-format {align-self: flex-start; width: auto; max-width: 100%; padding: 5px 24px 5px 7px; border: 1px solid #d7ddd1; border-radius: 6px; background-color: #f6f7f2; color: #52604f; font-size: 11px; min-height: 30px;}
.plate-field .plate-help {font: 400 12px/1.5 "Segoe UI", sans-serif; color: #52604f; margin: 0; letter-spacing: normal;}
.plate-field .plate-help.is-error {color: #a12f20; font-weight: 600;}
.hero-search {align-items: flex-start;}
.hero-search > .plate-field {flex: 1;}
.hero-search > .button {min-height: 60px;}
@media (max-width: 600px) {
  .hero-search {flex-direction: column;}
  .hero-search > .button {width: 100%; min-height: 48px;}
  .hero-plate-display {left: 28%; top: 53%;}
  .hero-plate-display .plate {font-size: 22px;}
  .number-links {gap: 14px;}
  .number-links .plate {font-size: 21px;}
  .inbox-row {gap: 9px;}
  .inbox-row > .avatar {display: none;}
  .chat-head > .avatar {display: none;}
  .chat-tools {margin-left: auto;}
}
