/* HOODI-tema, delfil: settings. Indlæses af hoodi-theme-links.php. Skrives af én agent ad gangen. */

/* ---------------------------------------------------------------------------
   1. Indstillingsmodalen (tandhjulet): #kt_modal_showNeighbors med indholdet fra neighbors/details (profil),
      settings/personal.php, privacy.php, notifications.php, security.php og changeassociation.php.
      Mockups: Web_Profil_modal.png og Web_Personlige_oplysninger.png (rækker 60 px, avatar 100 px, navn 26/800,
      rolle 15 grå, kort 22 px runding med 24 px imellem). Bredden er 600 px som de øvrige modaler (.mw-600px i
      hoodi-theme.css); mockup'ens 500 px er fravalgt (Patrick 04-11-2026).
   --------------------------------------------------------------------------- */

/* Profilhovedet: avatar (150 px som i det gamle design, sat i neighbors/details), navn og "Firma · Rolle" som i det gamle design
   (Patrick 04-11-2026: mockup'ens 100 px og foreningsnavn efter rollen er droppet) */
#showNeighbor_content > .row > .col-md-12.text-center { margin-top: -16px; margin-bottom: 24px !important; }
#showNeighbor_content > .row > .col-md-12.text-center h1 {
  font-size: 26px; font-weight: 800; color: var(--hoodi-petrol);
  letter-spacing: -0.02em; line-height: 1.2; margin: 12px 0 0 !important;
}
#showNeighbor_content > .row > .col-md-12.text-center .text-muted {
  font-size: 15px !important; font-weight: 400 !important; color: var(--hoodi-tekst2) !important; margin-top: 6px;
}
#showNeighbor_content .overlay .overlay-layer { border-radius: 999px; }
#showNeighbor_content .overlay .overlay-layer i { font-size: 32px !important; }
/* Profilens sidste kort ligger fem niveauer under modalkroppen (row > div > row > col > card), dybere end hovedfilens
   "sidste element uden bundmargen" (fire niveauer). Uden denne regel stod kortets 17 px oven i kroppens 32 px, så luften
   under det sidste kort (Farver) var 49 px mod 32 px i siderne (Patrick 04-11-2026). */
#showNeighbor_content > .row > div > .row > .col > .card:last-child { margin-bottom: 0 !important; }

/* Rækker i modalens lister bygges præcis som sidernes lister: chevronen og alle mål kommer fra hovedfilen, ingen egne mål her
   (Patrick 02-11-2026: ens rækker overalt). Fluebenet ved det valgte punkt (rolle, abonnement, farver) er 14 px, mindre end
   chevronens 16 px, da glyffen er bredere, og står på samme lodrette linje som chevronerne (04-11-2026). Skift forening viser ikke den aktuelle forening (changeassociation.php). */
#showNeighbor_content table.tablebank .fi-rr-check { font-size: 14px !important; color: var(--hoodi-petrol) !important; line-height: 1; }   /* 16 -> 14 som indbakkemenuens flueben (Patrick 04-11-2026) */
#showNeighbor_content table.tablebank > tbody > tr > td:last-child:has(> .fi-rr-check) { padding-right: 17px !important; }
#showNeighbor_content table.tablebank .fw-normal.text-dark.fs-6 { font-size: 15px !important; font-weight: 600 !important; color: var(--hoodi-petrol) !important; }   /* feltværdier som rækketitler 15/600 (Patrick 02-11-2026; før 17/400) */
/* Til/Fra og anden undertekst til højre i rækker */
#showNeighbor_content table.tablebank .fs-6.text-muted { font-size: 15px !important; font-weight: 400 !important; color: var(--hoodi-tekst2) !important; }
#showNeighbor_content table.tablebank .text-muted.fs-8 { font-size: 14px !important; color: var(--hoodi-tekst2) !important; }
/* Kontakter (Privatliv, Notifikationer): petrol når slået til (sat i hovedfilen), 44 x 24 px */
#showNeighbor_content .form-check-input.h-25px.w-45px { width: 44px !important; height: 24px !important; }

/* Overskrifter over kort (Notifikationer, Sikkerhed og login): boksoverskrift 16/700 i petrol, forklaring 15 grå */
#showNeighbor_content td.text-dark.fw-bold.fs-5 { font-size: 16px !important; font-weight: 700 !important; color: var(--hoodi-petrol) !important; padding: 0 4px 4px; }
#showNeighbor_content table.mb-3 { margin-bottom: 8px !important; }
#showNeighbor_content > p.fs-6, #showNeighbor_content p.text-dark.fw-normal.fs-6 { font-size: 15px !important; color: var(--hoodi-tekst2) !important; line-height: 1.5; margin-bottom: 24px !important; }
#showNeighbor_content .card.mb-8 { margin-bottom: 17px !important; }   /* 17 px mellem kort som overalt (Patrick 04-11-2026; før 24) */

/* Personlige oplysninger og kontaktfelter: som listernes rækker, bare med den lille tekst øverst (Patrick 02-11-2026):
   etiket 13/400 grå (som undertekst), værdi 15/600 petrol (som rækketitel), lås 16 px. Ikoncirklen står som i alle andre
   feltrækker (Patrick 04-11-2026; før skjult efter mockup'en, og teksten stod 24 px inde), så cellerne har hovedfilens polstring.
   Før: etiket 16/600 skaleret .85 af Bootstrap, værdi 17/400. Etiketten står uskaleret (scale 1), så 13 px er 13 px. */
/* Rækkerne 72 px som ikonrækkerne (14 px over og under et 44 px felt), etiketten øverst og værdien 20 px nede, så der er
   samme luft mellem linjerne som mellem titel og undertekst i listerne (Patrick 02-11-2026: for tæt, for lave) */
#showNeighbor_content .form-floating { height: 44px; }
#showNeighbor_content .form-floating > label,
#showNeighbor_content .form-floating > .form-control ~ label {
  font-size: 13px !important; font-weight: 400 !important; color: var(--hoodi-tekst2) !important; opacity: 1 !important;
  top: 3px !important; left: 0 !important; padding: 0 !important; height: auto !important; line-height: 1.4 !important; transform: none !important;   /* 3 px ned, så luften over etiketten = luften under værdien (målt 2x: 37/47 -> 43/41) */
}
#showNeighbor_content .form-floating > .form-control { height: 44px !important; min-height: 44px !important; padding: 20px 0 0 0 !important; line-height: 1.3 !important; }   /* etiketten står 3 px nede, så 20 px giver stadig 7-8 px blæk-til-blæk som i listerne */
#showNeighbor_content .form-floating > label span { font-size: inherit !important; color: inherit !important; font-weight: inherit !important; }
#showNeighbor_content .form-floating > .form-control { font-size: 15px !important; font-weight: 600 !important; color: var(--hoodi-petrol) !important; }
#showNeighbor_content .form-floating > .form-control:disabled { color: var(--hoodi-petrol) !important; -webkit-text-fill-color: var(--hoodi-petrol); opacity: 1; }
#showNeighbor_content table.tablebank .fi-rr-lock { color: var(--hoodi-petrol) !important; }   /* størrelsen (16 px) sættes nederst i filen */
#showNeighbor_content .badge.badge-dark { background: var(--hoodi-graa) !important; color: var(--hoodi-petrol) !important; }
#showNeighbor_content .col-xl-12.mb-5 { margin-bottom: 0 !important; }
/* Knappen under kortene (Gem ændringer) står kortets 17 px under det som overalt; de ekstra 8 px gav 25 (Patrick 04-11-2026) */

/* Navne- og adressebeskyttelse (privacy.php): grå boks i stedet for Metronics lyseblå */
#showNeighbor_content .bg-light-info { background: var(--hoodi-graa) !important; border-radius: var(--hoodi-r-indre); }
#showNeighbor_content .bg-light-info .ki-information { color: var(--hoodi-petrol); }

/* Opkrævninger (settings/accounting/invoices.php, selvstændig side): kanalnavnene (E-mail, SMS, e-Boks) har samme opmærkning
   som modalens kontaktrækker (span.fw-normal.text-dark.fs-6), men står uden for #showNeighbor_content og fik derfor 16/400.
   Rækketitler som i Indstillinger-oversigten: 15/600 petrol (Patrick 04-11-2026). */
.hoodi-invoicechannels table.tablebank .fw-normal.text-dark.fs-6 { font-size: 15px !important; font-weight: 600 !important; line-height: 1.3; color: var(--hoodi-petrol) !important; }

/* ---------------------------------------------------------------------------
   2. Spørg HOODI (AI-assistenten i modals.php, #wg-*). Mockup: højre del af Web_Dokumenter_+_Spørg_HOODI.png:
      launcher 60 px petrol 28 px fra kanterne (nu 50 px som det gamle design), panel 380 x 560 px 16 px over launcheren uden skygge, hoved 74 px
      med stjerner og "Spørg HOODI", petrol brugerboble, grå svarboble, rund grå inputpille med petrol sendeknap.
      modals.php' egen <style> står sidst i dokumentet, så reglerne her bruger body #wg-... for at vinde på
      specificitet; inline-styles og JS'ens padding-top på launcheren overstyres med !important.
      Under 992 px bestemmer mobile.css afstandene til bunden (fanelinjen), så placeringen her er kun for desktop.
   --------------------------------------------------------------------------- */
@media (min-width: 992px) {
  body #wg-launcher { width: 50px !important; height: 50px !important; right: 28px !important; bottom: 28px !important; }   /* 50 px som det gamle design; 60 var for stor (Patrick 04-11-2026) */
  body #wg-panel { right: 28px !important; bottom: 94px !important; width: 420px !important; height: min(780px, calc(100dvh - 122px)); }   /* 420 px: en anelse bredere end mockup'ens 388 (Patrick 02-11-2026) */   /* mockup Dokumenter + Spørg HOODI (2x): panel 776 x 1563 = 388 x 781 px (Patrick 02-11-2026: større/højere) */
  body #wg-panel.wg-expanded { height: calc(100dvh - 122px); }
}

/* Launcheren: petrol cirkel uden kant, ikonet centreret */
body #wg-launcher {
  padding: 0 !important; border: 0 !important; box-shadow: none !important;
  display: flex; align-items: center; justify-content: center;
}
body #wg-launcher:hover { background: #1D3640 !important; }
body #wg-launcher #wg-launcher-icon { display: inline-flex !important; line-height: 1; }
body #wg-launcher #wg-launcher-icon i { font-size: 20px !important; line-height: 1; display: inline-flex; }   /* stjerner og chevron 20 px som det gamle designs fs-2 (Patrick 04-11-2026; før 24/32, og 28 var for voldsomt 02-11-2026) */

/* Panelet: hvid flade uden skygge. Metronics lilla-blå skygge (rgba(82,63,105,.15), 50 px) lå rundt om panelet og
   stak frem langs højre kant og bag launcheren som en mørk, afrundet flade; den er fjernet. */
body #wg-panel { box-shadow: 0 12px 32px rgba(38, 69, 81, .14) !important; background: var(--hoodi-hvid) !important; }   /* samme skygge som minimenuerne (Patrick 02-11-2026: manglede skygge) */

/* Hovedet: stjerner + "Spørg HOODI" til venstre, menuknappen som 40 px grå cirkel til højre */
body #wg-panel .wg-chat-header {
  display: flex; align-items: center; justify-content: space-between;
  min-height: 74px; padding: calc(16px + var(--safe-top, 0px)) 20px 16px 24px;
  border-bottom: 1px solid var(--hoodi-skillelinje);
}
body #wg-panel .wg-chat-header .wg-topbar-title {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 16px !important; font-weight: 700 !important; color: var(--hoodi-petrol);   /* 16 px som menuteksten (Patrick 04-11-2026: 18 var for stort) */
}
body #wg-panel .wg-chat-header .wg-topbar-title .fi { font-size: 18px; line-height: 1; display: inline-flex; color: var(--hoodi-petrol); }   /* 18 px som menuikonerne (før 22) */
body #wg-panel .wg-topbar-menu { position: static; }
body #wg-panel .wg-topbar-menu > a.symbol { display: inline-flex; }
body #wg-panel .wg-topbar-menu > a.symbol .symbol-label {
  width: 40px; height: 40px; border-radius: 999px; background-color: var(--hoodi-graa) !important;
  padding: 0 !important; display: flex; align-items: center; justify-content: center;
}
body #wg-panel .wg-topbar-menu > a.symbol:hover .symbol-label { background-color: var(--hoodi-lysgroen) !important; }
body #wg-panel .wg-topbar-menu > a.symbol .symbol-label .fi { color: var(--hoodi-petrol) !important; font-size: 16px !important; line-height: 1; }   /* 16 px glyf som modalernes runde knapper (20 var for stor, Patrick 02-11-2026) */
/* Kun én knap i hovedet som i mockup'en: luk-krydset (før en chevron). Prik-menuen (Udvid, Indstillinger, Afslut chat) skjules; dens funktioner
   mangler et nyt hjem (beslutning) */
body #wg-panel .wg-topbar-menu > a.symbol[data-kt-menu-trigger], body #wg-panel .wg-topbar-menu > a.symbol:has(.fi-rr-menu-dots) { display: none !important; }
body #wg-panel .wg-topbar-menu .menu-sub-dropdown { border-radius: var(--hoodi-r-minimenu); padding: 8px !important; min-width: 240px; }
body #wg-panel .wg-topbar-menu .menu-sub-dropdown .btn {
  border-radius: var(--hoodi-r-menu) !important; font-size: 15px !important; font-weight: 500 !important; color: var(--hoodi-petrol) !important;
}
body #wg-panel .wg-topbar-menu .menu-sub-dropdown .btn:hover { background: var(--hoodi-hover) !important; }
body #wg-panel .wg-topbar-menu .menu-sub-dropdown .btn.text-danger { color: var(--hoodi-fejl) !important; }
body #wg-panel .wg-topbar-menu .menu-sub-dropdown .btn .fi { font-size: 18px !important; }

/* Tråden: 24 px luft, brugerboble petrol med hvid tekst, svarboble grå i fuld bredde, brødtekst 15/400 */
body #wg-panel .wg-chat-thread { padding: 24px 20px 8px; }
body #wg-panel .wg-msg-user { margin-bottom: 16px; }
/* Talebobler som mockup (2x målt): brugerens boble 18 px runding med 6 px i nederste højre hjørne, svaret 16 px med 4 px i nederste
   venstre hjørne; forslag (wg-starter, wg-suggestion) er hvide brugerbobler med stiplet kant (Patrick 04-11-2026) */
body #wg-panel .wg-msg-user > div { border-radius: 18px 18px 6px 18px !important; padding: 9px 18px !important; font-size: 15px !important; line-height: 1.5; max-width: 85%; }
body #wg-panel .wg-msg-ai { margin-bottom: 16px; font-size: 15px !important; line-height: 1.5; color: var(--hoodi-petrol); }
body #wg-panel .wg-msg-ai .ai-text:not(:empty) { border-radius: 16px 16px 16px 4px !important; padding: 16px 18px !important; max-width: 100% !important; }
body #wg-panel .wg-msg-ai .ai-text a { color: var(--hoodi-petrol); font-weight: 600; text-decoration: underline; }
body #wg-panel .wg-msg-ai .ai-text ul { padding-left: 20px; margin: 8px 0; }
/* Forslag ligner brugerens egne beskeder, som de ville se ud, hvis man valgte dem: højrestillet under hinanden med brugerboblens
   runding, tekst og største bredde, men hvide med stiplet kant (Patrick 04-11-2026; før lyse piller). Luften er 1 px mindre end
   brugerboblens 9/18 px, så kanten giver samme ydre mål */
body #wg-panel .wg-starters { gap: 8px; margin-bottom: 16px; align-items: flex-end; }
body #wg-panel .wg-starter, body #wg-panel .wg-suggestion { font-size: 15px !important; padding: 8px 17px !important; line-height: 1.5; border-radius: 18px 18px 6px 18px !important; max-width: 85%; background: var(--hoodi-hvid) !important; color: var(--hoodi-petrol) !important; border: 1px dashed var(--hoodi-linje) !important; text-align: left; }
body #wg-panel .wg-starter:hover, body #wg-panel .wg-suggestion:hover { background: var(--hoodi-hover) !important; }
body #wg-panel .wg-support-btn { font-size: 14px !important; padding: 10px 16px !important; line-height: 1.4; border-radius: 999px !important; background: var(--hoodi-hover) !important; color: var(--hoodi-petrol) !important; border: 0 !important; text-align: left; }
body #wg-panel .wg-suggestions { margin: -4px 0 16px; flex-direction: column; align-items: flex-end; }
body #wg-panel .ai-response-pending { padding: 0 18px; }
body #wg-panel .ai-response-dot { background: var(--hoodi-petrol); }
body #wg-panel .ai-response-status-text { color: var(--hoodi-tekst2); font-size: 14px; }

/* Inputfeltet: rund grå pille 46 px med petrol sendeknap (pil op). Luften om knappen følger Energi-fanens plus i boligens
   fanelinje (Patrick 05-11-2026: "god balance"): dér 30 px knap i 40 px pille = 5 px over og under, 6 px til kanten. Samme
   forhold i den 46 px pille giver 34 px knap, 6 px over og under og 7 px til kanten (mockup og før: 38 px med 4 px hele vejen
   rundt). Pilen 16 px (18 ved 38). Kommentarfelterne (hoodi-theme.css) har samme mål. */
body #wg-panel .wg-chat-inputbar {
  padding: 16px 16px max(16px, env(safe-area-inset-bottom, 0px), var(--safe-bottom, 0px)) 16px !important;   /* mockup (2x): 16 px i siderne, 22 px under pillen; Patrick 02-11-2026: samme som siderne -> 16 */
  border-top: 1px solid var(--hoodi-skillelinje) !important;
}
/* Bundens sikre zone: env() er 0 i appen, så appens safe-bottom-cookie (--safe-bottom på panelet, som --safe-top i hovedet) tæller
   også; ellers lå pillen helt nede ved hjemmelinjen (Patrick 06-11-2026). Zonen afløser de 16 px i stedet for at lægges oveni:
   pillen står lige over hjemmelinjens zone som fanelinjens tekst (16 px + zonen lagde den 50 px oppe på iPhone, Patrick
   06-11-2026: "lidt for højt"). Mens tastaturet er fremme (wg-keyboard), dækker det zonen, og luften under pillen er 16 px */
body #wg-panel.wg-keyboard .wg-chat-inputbar { padding-bottom: 16px !important; }
/* "Start en ny samtale" sidst i tråden under nyeste besked, centreret; ruller med samtalen (Patrick 04-11-2026) */
body #wg-panel .wg-newchat { padding: 0 0 8px; line-height: 1; }
body #wg-panel .wg-newchat-link { font-size: 13px !important; color: var(--hoodi-tekst2) !important; }
body #wg-panel .wg-newchat-link:hover { color: var(--hoodi-petrol) !important; text-decoration: underline; }
body #wg-panel .wg-chat-inputrow { border-radius: 23px !important; padding: 6px 7px 6px 20px !important; min-height: 46px; gap: 10px; }   /* pille 46 px, 34 px sendeknap 6 px over og under, 7 px fra kanten (se ovenfor) */
/* Runding 23 px = halvdelen af de 46 px: på én linje er feltet stadig en pille, med flere linjer en afrundet firkant med samme
   hjørner i stedet for en oval, der skærer teksten. Sendeknappen står ved nederste linje (Patrick 05-11-2026) */
body #wg-panel #wg-chat-send { align-self: flex-end; }
body #wg-panel #wg-chat-input { font-size: 15px !important; color: var(--hoodi-petrol) !important; padding: 5px 0 !important; line-height: 1.5; }
body #wg-panel #wg-chat-input::placeholder { color: var(--hoodi-tekst2); opacity: 1; }
body #wg-panel #wg-chat-send { width: 34px !important; height: 34px !important; }
body #wg-panel #wg-chat-send:hover { background: #1D3640 !important; }
body #wg-panel #wg-chat-send i { font-size: 16px !important; line-height: 1; display: inline-flex; }

/* Engangsvelkomsten: titel 20/700, tekst 15 grå, rund petrol knap */
body #wg-panel .wg-disclaimer { padding: 32px; }
body #wg-panel .wg-disclaimer .fs-3 { font-size: 20px !important; font-weight: 700 !important; color: var(--hoodi-petrol); margin-bottom: 16px !important; }
body #wg-panel .wg-disclaimer .text-muted { font-size: 15px !important; color: var(--hoodi-tekst2) !important; line-height: 1.5; margin-bottom: 24px !important; }
body #wg-panel .wg-disclaimer-ok { min-height: 48px; padding: 0 24px; font-size: 15px; font-weight: 600; }

/* Felter i indstillingsmodalen (Personlige oplysninger m.fl., form-floating i tablebank-rækker), mockup 2x målt: rækker 64 px,
   etiket "Fulde navn" 126 px bred = 13/700 17 px inde, værdi 16/400, hængelås-blæk 22x28 = 16 px glyf 19 px fra kanten,
   knappen 888 x 104 = 444 x 52 px med 23 px runding (Patrick 02-11-2026: afstande, hængelås og runding) */
#showNeighbor_content .form-floating > label > span.fs-7, #showNeighbor_content .form-floating > label { font-size: 13px !important; font-weight: 400 !important; color: var(--hoodi-tekst2) !important; }   /* som listernes undertekst (Patrick 02-11-2026; før 13/700 petrol) */
#showNeighbor_content .form-floating > .form-control { font-size: 15px !important; font-weight: 600 !important; color: var(--hoodi-petrol) !important; }   /* som rækketitler (02-11-2026) */
#showNeighbor_content table.tablebank td .fi-rr-lock, #showNeighbor_content .fi-rr-lock { font-size: 16px !important; color: var(--hoodi-petrol) !important; }   /* mere specifik end modalens 20 px-ikonregel */
#showNeighbor_content td:has(> .fi-rr-lock), #showNeighbor_content td:has(> i.fi-rr-lock) { padding-right: 17px !important; }
/* Knapperne (Gem ændringer m.fl.) har modalernes fælles mål fra hovedfilen (44 px, 15/700) og opmærkningens runding
   var(--bs-border-radius) som medlemssiden; de egne 52 px og 22 px er fjernet (Patrick 04-11-2026) */