html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
  zoom: var(--hilo-ui-scale, 1);
}

body { margin: 0; }

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

.legal-document { max-width: 920px; margin: 2rem auto 5rem; color: #202331; }
.legal-hero { padding: clamp(2rem,5vw,4rem); margin-bottom: 2rem; border-radius: 28px; color: #fff; background: radial-gradient(circle at 15% 10%,#8128df 0,transparent 38%),radial-gradient(circle at 90% 5%,#1767ef 0,transparent 42%),linear-gradient(140deg,#090712,#15102c 55%,#061633); box-shadow: 0 24px 60px rgba(25,18,70,.22); }
.legal-hero h1 { margin: .35rem 0 .6rem; font-size: clamp(2.1rem,5vw,4rem); letter-spacing: -.05em; }
.legal-hero p { margin: 0; color: #c9c6da; }
.legal-kicker { text-transform: uppercase; letter-spacing: .16em; color: #c9b8ff; font-size: .75rem; font-weight: 700; }
.legal-document section { padding: .5rem clamp(.25rem,2vw,1.25rem); margin-bottom: 1.5rem; }
.legal-document h2 { font-size: 1.3rem; margin-bottom: .7rem; }
.legal-document p,.legal-document li { line-height: 1.72; color: #4f5363; }
/* Simple connection wizard */
.wa-connect-logo { width: 58px; height: 58px; margin: 0 auto; border-radius: 18px; display: grid; place-items: center; background: #e8f8ef; color: #0d9f5a; font-size: 30px; font-weight: 800; }
.wa-connected { display: flex; align-items: center; gap: 16px; padding: 20px; border: 1px solid #bde5cd; border-radius: 14px; background: #effaf4; }
.wa-connected > div { display: flex; flex-direction: column; gap: 3px; }
.wa-connected small, .wa-connected span { color: #64756b; }
.wa-connected strong { font-size: 1.25rem; }
.wa-status-dot { width: 14px; height: 14px; border-radius: 50%; background: #16a765; box-shadow: 0 0 0 6px #d6f2e1; flex: 0 0 auto; }
.wa-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 20px; }
.wa-steps li { display: flex; gap: 14px; align-items: center; }
.wa-steps li > span { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: #e8f8ef; color: #0b8a50; font-weight: 700; flex: 0 0 auto; }
.wa-steps strong, .wa-steps small { display: block; }
.wa-steps small { color: #6c757d; margin-top: 2px; }
.onboarding-progress { display: flex; align-items: center; justify-content: center; gap: 10px; color: #8a949e; font-size: .9rem; }
.onboarding-progress i { width: 55px; height: 1px; background: #d8dee3; }
.onboarding-progress .done { color: #0b8a50; font-weight: 700; }
.onboarding-progress .current { color: #172534; font-weight: 700; }
.setup-check { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; background: #edf0f2; font-weight: 800; }
.setup-check.done { background: #dff5e8; color: #0b8a50; }

/* WhatsApp connection and managed-group scope */
.wa-management-page { width: min(100%,980px); margin: 0 auto; }
.wa-back-link { display: inline-block; margin-bottom: 25px; color: #567078; font-size: 12px; text-decoration: none; }.wa-back-link:hover { color: #108157; }
.wa-management-hero { display: flex; align-items: center; gap: 20px; margin-bottom: 28px; }.wa-management-logo { width: 62px; height: 62px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 20px; color: white; background: linear-gradient(145deg,#2fd68d,#0a9a5e); box-shadow: 0 16px 35px rgba(16,154,94,.22); font-size: 34px; font-weight: 800; }.wa-management-kicker { color: #16825a; font-size: 10px; font-weight: 800; letter-spacing: .13em; }.wa-management-hero h1 { margin: 4px 0 7px; color: #102734; font-size: clamp(28px,4vw,42px); letter-spacing: -.035em; }.wa-management-hero p { max-width: 680px; margin: 0; color: #64777e; font-size: 14px; line-height: 1.55; }
.wa-connect-card,.wa-state-card,.wa-automatic-scope,.wa-groups-section { border: 1px solid #e0e9e8; border-radius: 18px; background: rgba(255,255,255,.9); box-shadow: 0 10px 35px rgba(15,54,65,.05); }.wa-connect-card { padding: clamp(24px,5vw,42px); text-align: center; }.wa-connect-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-bottom: 28px; }.wa-connect-steps span { display: flex; align-items: center; gap: 9px; color: #496068; font-size: 12px; text-align: left; }.wa-connect-steps b { width: 26px; height: 26px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: #0c8053; background: #e3f6eb; }.wa-primary-button { min-width: 230px; height: 47px; padding: 0 20px; border: 0; border-radius: 12px; color: white; background: linear-gradient(135deg,#18ad6e,#0a8c56); box-shadow: 0 10px 24px rgba(10,140,86,.2); font-weight: 700; }.wa-primary-button span { margin-left: 8px; }.wa-connect-card > small { display: block; margin-top: 16px; color: #829095; font-size: 10px; }
.wa-state-card { min-height: 104px; display: flex; align-items: center; gap: 15px; padding: 20px 22px; }.wa-state-card > div { flex: 1; }.wa-state-card small,.wa-state-card strong,.wa-state-card p { display: block; }.wa-state-card small { color: #16825a; font-size: 9px; font-weight: 800; letter-spacing: .1em; }.wa-state-card strong { margin: 3px 0; color: #16303b; font-size: 17px; }.wa-state-card p { margin: 0; color: #687b81; font-size: 11px; }.wa-state-card.unavailable > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #a4600c; background: #fff0d8; font-weight: 800; }.wa-live-dot { width: 13px; height: 13px; flex: 0 0 auto; border-radius: 50%; background: #17ae6d; box-shadow: 0 0 0 7px #ddf5e8; }.wa-secondary-button { height: 37px; padding: 0 14px; border: 1px solid #b8d6c6; border-radius: 9px; color: #0d7f52; background: #fff; font-size: 11px; font-weight: 700; }.wa-secondary-button:hover { background: #eaf8f0; }
.wa-automatic-scope { display: flex; align-items: center; gap: 13px; margin: 14px 0 30px; padding: 16px 20px; box-shadow: none; }.wa-automatic-scope > span { width: 29px; height: 29px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; color: #087d50; background: #e3f6eb; font-weight: 800; }.wa-automatic-scope strong { display: block; color: #1a343d; font-size: 12px; }.wa-automatic-scope p { margin: 3px 0 0; color: #718187; font-size: 10px; }
.wa-groups-section { padding: clamp(20px,4vw,30px); scroll-margin-top: 90px; }.wa-groups-section > header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 20px; }.wa-groups-section h2 { margin: 3px 0 5px; color: #142d38; font-size: 23px; }.wa-groups-section header p { margin: 0; color: #708086; font-size: 11px; }.wa-groups-section header > b { padding: 6px 10px; border-radius: 20px; color: #0c8053; background: #e5f7ed; font-size: 10px; white-space: nowrap; }.wa-groups-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }.wa-group-card { min-width: 0; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 11px; padding: 13px; border: 1px solid #e2e9e8; border-radius: 12px; background: #fbfcfc; }.wa-group-card.selected { border-color: #acd9bf; background: #f1faf5; }.wa-group-avatar { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: #385666; font-size: 13px; font-weight: 800; }.wa-group-card.selected .wa-group-avatar { background: #16a765; }.wa-group-card strong,.wa-group-card small,.wa-group-card time { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.wa-group-card strong { color: #18313c; font-size: 12px; }.wa-group-card small { margin-top: 3px; color: #6d7d83; font-size: 9px; }.wa-group-card time { margin-top: 4px; color: #929da1; font-size: 8px; }.wa-group-card form { margin: 0; }.wa-group-card button { min-width: 92px; height: 32px; padding: 0 9px; border-radius: 8px; font-size: 9px; font-weight: 750; }.wa-group-card button.add { border: 1px solid #16a765; color: white; background: #16a765; }.wa-group-card button.remove { border: 1px solid #ccd8d5; color: #65767b; background: #fff; }.wa-groups-empty { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 38px; border: 1px dashed #cad8d5; border-radius: 12px; color: #748489; font-size: 11px; }.wa-history-note { margin: 18px 0 0; color: #819095; font-size: 9px; line-height: 1.5; }
@media (max-width: 760px) { .wa-management-hero { align-items: flex-start; }.wa-management-logo { width: 50px; height: 50px; border-radius: 16px; }.wa-connect-steps,.wa-groups-grid { grid-template-columns: 1fr; }.wa-state-card { align-items: flex-start; flex-wrap: wrap; }.wa-state-card form { width: 100%; }.wa-secondary-button { width: 100%; }.wa-group-card { grid-template-columns: 38px minmax(0,1fr); }.wa-group-card form { grid-column: 2; }.wa-groups-section > header { flex-direction: column; gap: 8px; } }