.tenant-wifi-card { margin-top: 18px; padding: 16px; border: 1px solid #dce9eb; border-radius: 12px; background: #fff; color: var(--text); }
.tenant-wifi-card header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.wifi-art { flex: 0 0 48px; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 8px; background: #e5f8f8; }
.tenant-wifi-card h2 { font-size: 17px; line-height: 24px; margin: 0; }
.wifi-caption { font-size: 12px; color: var(--secondary); }
.wifi-credentials { display: grid; grid-template-columns: minmax(0,1fr); }
.wifi-credential { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-top: 1px solid #edf3f3; }
.wifi-credential > div { min-width: 0; }
.wifi-credential small { display: block; font-size: 12px; line-height: 20px; color: var(--secondary); }
.wifi-credential strong { display: block; font-size: 15px; line-height: 23px; overflow-wrap: anywhere; white-space: pre-wrap; user-select: text; }
.wifi-credential button { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; min-height: 40px; border: 1px solid #c9eeee; border-radius: 8px; background: #effafa; color: #007d83; font-size: 12px; padding: 7px 9px; }
.wifi-credential button .ui-icon { width: 16px; height: 16px; }
.wifi-hint { display: flex; gap: 7px; align-items: flex-start; margin: 8px 0 0; color: var(--secondary); font-size: 12px; line-height: 20px; }
.wifi-hint .ui-icon { flex: 0 0 16px; width: 16px; height: 20px; }
.wifi-hint span { min-width: 0; overflow-wrap: anywhere; }
.wifi-manager { max-width: 520px; }
.wifi-manager-body { min-width: 0; }
.wifi-property-label { display: grid; gap: 8px; font-size: 14px; }
.wifi-property-label select { min-width: 0; width: 100%; padding: 12px; border: 1px solid #dce9eb; border-radius: 8px; background: #f8fafb; color: var(--text); font-size: 16px; }
.wifi-manager-summary { display: flex; align-items: center; gap: 12px; padding: 16px 0; border-bottom: 1px solid #e5eeee; margin-bottom: 12px; }
.wifi-manager-summary > div { display: grid; gap: 5px; min-width: 0; }
.wifi-manager-summary strong { font-size: 17px; }
.wifi-manager-summary small { font-size: 12px; color: var(--secondary); overflow-wrap: anywhere; }
.wifi-service-state { font-size: 13px; color: #00878c; }
.wifi-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 16px; }
.wifi-form label { min-width: 0; display: block; font-size: 14px; }
.wifi-required { color: #df2944; }
.wifi-form label.wifi-toggle { display: flex; align-items: center; justify-content: space-between; min-height: 44px; }
.wifi-form .wifi-toggle input { appearance: none; width: 46px; height: 26px; min-height: 0; border: 0; padding: 3px; margin: 0; background: #bccbcd; border-radius: 20px; cursor: pointer; }
.wifi-toggle input::before { content: ''; display: block; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform .15s; }
.wifi-toggle input:checked { background: #008b90; }
.wifi-toggle input:checked::before { transform: translateX(20px); }
.wifi-toggle input:focus-visible { outline: 2px solid #00777b; outline-offset: 3px; }
.wifi-location { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; padding-bottom: 12px; border-bottom: 1px solid #e5eeee; }
.wifi-password-input { display: flex; align-items: center; position: relative; }
.wifi-form .wifi-password-input input { padding-right: 48px; }
.wifi-password-input button { position: absolute; right: 4px; bottom: 3px; width: 40px; height: 40px; display: grid; place-items: center; border: 0; background: transparent; color: #007d83; }
.wifi-password-input .ui-icon { width: 20px; height: 20px; }
.wifi-form-actions { display: flex; align-items: center; gap: 12px; }
.wifi-form-actions button { flex: 1; min-width: 0; margin: 0; }
.wifi-error { color: #be283c; font-size: 13px; line-height: 20px; overflow-wrap: anywhere; }
.wifi-error:empty { display: none; }
.wifi-recovery-note { margin: -8px 0 0; padding: 10px 12px; border: 1px solid #ffd4b7; border-radius: 8px; background: #fff5ed; color: #a94d19; font-size: 12px; line-height: 20px; }
.wifi-form-note, .wifi-empty { font-size: 12px; line-height: 20px; color: var(--secondary); }
@media (min-width: 600px) {
  .wifi-credentials { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
}