/* DROPS PRO 2.37.7 — navegação, identidade, vencimento e classificação dos pontos */
:root {
  --active-company-primary: #075fc7;
  --active-company-secondary: #ffc400;
  --map-drqt: #1677d2;
  --map-drqc: #16a05d;
  --map-drqi: #d71920;
}

.app-welcome {
  display: grid;
  grid-template-columns: minmax(190px, .85fr) minmax(0, 1.4fr);
  align-items: center;
  gap: 18px;
  padding: 20px;
  border-top: 5px solid var(--active-company-primary);
  overflow: hidden;
}

.company-brand-summary {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 12px;
  padding-right: 18px;
  border-right: 1px solid #dce7f4;
}

.company-logo-frame {
  flex: 0 0 68px;
  display: grid;
  place-items: center;
  width: 68px;
  height: 68px;
  overflow: hidden;
  border: 1px solid #d7e3f0;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(31, 72, 122, .1);
}

.company-logo {
  display: block;
  width: 100%;
  height: 100%;
  padding: 6px;
  object-fit: contain;
}

.company-logo-fallback {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: #fff;
  background: linear-gradient(135deg, var(--active-company-primary), #00386f);
  font-size: 23px;
  font-weight: 900;
}

.company-brand-copy {
  min-width: 0;
}

.company-brand-copy span,
.company-brand-copy strong {
  display: block;
}

.company-brand-copy span {
  color: #73839a;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .13em;
}

.company-brand-copy strong {
  margin-top: 5px;
  overflow-wrap: anywhere;
  color: #173252;
  font-size: 15px;
  line-height: 1.3;
}

.app-welcome .profile-summary {
  min-width: 0;
}

.compact-actions {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  grid-template-columns: none !important;
}

.compact-actions > .action-card,
.compact-actions > .action-card:last-child:nth-child(3n + 1) {
  flex: 0 1 calc((100% - 16px) / 3);
  max-width: 230px;
  min-width: 0;
  grid-column: auto;
}

.bottom-nav {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: min(calc(100% - 24px), 380px) !important;
  padding: 7px !important;
}

.bottom-nav button {
  justify-content: center;
  min-height: 58px;
}

body.settings-modal-open {
  overflow: hidden;
}

.settings-modal {
  position: fixed;
  inset: 0;
  z-index: 100200;
  display: grid;
  place-items: center;
  padding: max(18px, env(safe-area-inset-top)) 16px max(18px, env(safe-area-inset-bottom));
  background: rgba(0, 24, 48, .75);
  backdrop-filter: blur(8px);
}

.settings-modal-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(620px, 100%);
  max-height: min(88dvh, 820px);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 30px 90px rgba(0, 18, 38, .4);
}

.settings-modal-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 17px 18px;
  color: #fff;
  background: linear-gradient(135deg, var(--active-company-primary), #00386f);
}

.settings-modal-card > header span {
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
  opacity: .82;
}

.settings-modal-card > header h2 {
  margin: 3px 0 0;
  color: #fff;
  font-size: 22px;
}

.settings-modal-close {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 12px;
  color: #fff;
  background: rgba(255, 255, 255, .14);
  font-size: 27px;
  cursor: pointer;
}

.settings-modal-content {
  min-height: 0;
  overflow-y: auto;
  padding: 18px;
  overscroll-behavior: contain;
}

.settings-modal-card > footer {
  display: flex;
  justify-content: flex-end;
  padding: 13px 18px calc(13px + env(safe-area-inset-bottom));
  border-top: 1px solid #dce7f4;
  background: #f8fbff;
}

.settings-logout-button {
  min-width: 150px;
  min-height: 46px;
  border: 0;
  border-radius: 13px;
  color: #fff;
  background: linear-gradient(135deg, #d92d20, #a71919);
  font-weight: 900;
  cursor: pointer;
}

.equipment-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}

.qr-result-card.inspection-overdue {
  border: 2px solid #d92d20;
  background: linear-gradient(180deg, #fff7f7 0%, #fff 42%);
  box-shadow: 0 12px 30px rgba(217, 45, 32, .14);
}

.inspection-overdue-pill {
  color: #fff;
  background: #d92d20;
  box-shadow: 0 5px 14px rgba(217, 45, 32, .22);
}

.last-inspection-card.overdue {
  border-left-color: #d92d20;
  background: #fff0f0;
}

.last-inspection-card.overdue > span,
.last-inspection-card.overdue .next-inspection-date,
.last-inspection-card.overdue .next-inspection-date strong {
  color: #a71919;
}

.inspection-map-risk-classification {
  margin: 2px 0;
  padding: 12px;
  border: 1px solid #cbdff2;
  border-radius: 14px;
  background: #fff;
}

.inspection-map-risk-classification > legend {
  padding: 0 6px;
  color: #173252;
  font-size: 12px;
  font-weight: 900;
}

.inspection-map-risk-classification:disabled {
  opacity: .55;
}

.inspection-map-risk-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.inspection-form .map-risk-option {
  display: block;
  margin: 0 !important;
  cursor: pointer;
}

.inspection-form .map-risk-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 0;
  opacity: 0;
}

.map-risk-option > span {
  display: grid;
  grid-template-columns: 18px 1fr;
  align-items: center;
  gap: 2px 8px;
  min-height: 58px;
  padding: 9px;
  border: 1px solid #d7e3ef;
  border-radius: 12px;
  background: #f8fbff;
}

.map-risk-option i {
  grid-row: 1 / 3;
  width: 18px;
  height: 18px;
  border: 3px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px #b8c9db;
}

.map-risk-option strong,
.map-risk-option small {
  display: block;
}

.map-risk-option strong {
  color: #173252;
  font-size: 12px;
}

.map-risk-option small {
  color: #73839a;
  font-size: 9px;
}

.map-risk-option.drqt i { background: var(--map-drqt); }
.map-risk-option.drqc i { background: var(--map-drqc); }
.map-risk-option.drqi i { background: var(--map-drqi); }
.map-risk-option:has(input:checked) > span {
  border-color: var(--active-company-primary);
  background: #edf6ff;
  box-shadow: 0 0 0 3px rgba(7, 95, 199, .1);
}

.inspection-map-marker.drqt,
.map-marker.drqt,
.map-state-badge.drqt { background: var(--map-drqt) !important; }
.inspection-map-marker.drqc,
.map-marker.drqc,
.map-state-badge.drqc { background: var(--map-drqc) !important; }
.inspection-map-marker.drqi,
.map-marker.drqi,
.map-state-badge.drqi { background: var(--map-drqi) !important; }
.inspection-map-marker:not(.drqt):not(.drqc):not(.drqi) { background: #7b8798; }

@media (max-width: 620px) {
  .app-welcome {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .company-brand-summary {
    padding: 0 0 13px;
    border-right: 0;
    border-bottom: 1px solid #dce7f4;
  }

  .company-logo-frame {
    flex-basis: 58px;
    width: 58px;
    height: 58px;
    border-radius: 15px;
  }

  .settings-modal {
    padding: 12px;
  }

  .settings-modal-card {
    max-height: 92dvh;
    border-radius: 21px;
  }
}

@media (max-width: 390px) {
  .compact-actions > .action-card,
  .compact-actions > .action-card:last-child:nth-child(3n + 1) {
    flex-basis: calc((100% - 8px) / 2);
  }

  .inspection-map-risk-options {
    grid-template-columns: 1fr;
  }

  .map-risk-option > span {
    min-height: 50px;
  }

  .settings-modal-card > footer,
  .settings-logout-button {
    width: 100%;
  }
}
