/* Flammepunkt Kunder - formularer og kort på kundesiderne. Farver og skrift kommer fra temaet (theme.json). */
.fpk { --fpk-kant: var(--wp--preset--color--roeg, #D6C9B8); --fpk-gloed: var(--wp--preset--color--gloed, #B93A0E); }
.fpk-top { color: var(--wp--preset--color--aske, #57534E); font-size: var(--wp--preset--font-size--small, .9375rem); margin-bottom: 1.5rem; }

.fpk-kort { background: var(--wp--preset--color--hvid, #FFFDF9); border: 1px solid var(--fpk-kant); border-radius: 6px; padding: 1.75rem; margin: 0 0 1.5rem; }
.fpk-kort > :first-child { margin-top: 0; }
.fpk-kort > :last-child, .fpk-kort form > :last-child { margin-bottom: 0; }
.fpk-kort h2 { font-size: var(--wp--preset--font-size--x-large, 1.5rem); margin: 0 0 .75rem; }
.fpk-kort--stille { background: transparent; }
.fpk-trin { font-family: var(--wp--preset--font-family--mono, monospace); color: var(--fpk-gloed); font-weight: 600; margin: 0 0 .25rem; }

.fpk-form p, .fpk-kort form p { margin: 0 0 1.1rem; }
.fpk label { display: block; font-weight: 600; margin-bottom: .35rem; }
.fpk-tjek label { font-weight: 400; display: flex; gap: .6rem; align-items: flex-start; }
.fpk-tjek input { margin-top: .3rem; }
.fpk input[type="text"], .fpk input[type="email"], .fpk input[type="password"], .fpk textarea {
  width: 100%; box-sizing: border-box; padding: .7rem .85rem; font: inherit; color: inherit;
  background: var(--wp--preset--color--hvid, #FFFDF9); border: 1px solid var(--fpk-kant); border-radius: 4px;
}
.fpk input.fp-mono { font-family: var(--wp--preset--font-family--mono, monospace); font-size: .875rem; }
.fpk input:focus, .fpk textarea:focus, .fpk summary:focus-visible { outline: 3px solid var(--wp--preset--color--gnist, #F08A5D); outline-offset: 2px; }
.fpk input[readonly] { background: var(--wp--preset--color--papir, #F7F3EC); }
.fpk-hjaelp, .fpk-valgfri { display: block; color: var(--wp--preset--color--aske, #57534E); font-size: var(--wp--preset--font-size--small, .9375rem); font-weight: 400; margin-top: .35rem; }
.fpk-valgfri { display: inline; margin: 0; }
.fpk-skjult { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.fpk button.wp-element-button { cursor: pointer; border: 0; }
.fpk .fpk-knap--lys { background: transparent; color: var(--wp--preset--color--kul, #1C1917); box-shadow: inset 0 0 0 1px var(--wp--preset--color--kul, #1C1917); }
.fpk .fpk-knap--lys:hover { background: var(--wp--preset--color--kul, #1C1917); color: var(--wp--preset--color--papir, #F7F3EC); }
.fpk-link { margin-left: 1rem; }

.fpk-besked { border: 1px solid var(--fpk-kant); background: var(--wp--preset--color--hvid, #FFFDF9); padding: .9rem 1.1rem; margin: 0 0 1.5rem; border-radius: 4px; }
.fpk-besked--ok { border-color: #B9D4B6; background: #E4F0E3; color: #1F4A27; }
.fpk-besked--fejl { border-color: var(--wp--preset--color--gnist, #F08A5D); background: var(--wp--preset--color--emmer, #FBE6DA); }

.fpk-maerke { display: inline-block; font-size: var(--wp--preset--font-size--small, .9375rem); font-weight: 600; padding: .2rem .7rem; border-radius: 999px; border: 1px solid var(--fpk-kant); }
.fpk-maerke--til { background: #E4F0E3; border-color: #B9D4B6; color: #1F4A27; }
.fpk-maerke--fra { background: var(--wp--preset--color--emmer, #FBE6DA); border-color: var(--wp--preset--color--gnist, #F08A5D); }

.fpk-liste { padding-left: 1.25rem; margin: 1rem 0; }
.fpk-liste li { margin-bottom: .4rem; }
.fpk-detaljer { margin-top: 1rem; }
.fpk-detaljer summary { cursor: pointer; font-weight: 600; margin-bottom: 1rem; }

/* 0.8.0: personer og licenser på kundens administratorside */
.fpk-kort h3 { font-size: var(--wp--preset--font-size--large, 1.25rem); margin: 1.75rem 0 .75rem; }
.fpk-personer { list-style: none; padding: 0; margin: 1.25rem 0; border-top: 1px solid var(--fpk-kant); }
.fpk-person { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: .6rem 1.25rem; align-items: start; padding: .9rem 0; border-bottom: 1px solid var(--fpk-kant); }
.fpk-person__hvem strong { display: block; }
.fpk-person__hvem span { color: var(--wp--preset--color--aske, #57534E); font-size: var(--wp--preset--font-size--small, .9375rem); overflow-wrap: anywhere; }
.fpk-person__stand .fpk-hjaelp { font-size: .8125rem; }
.fpk-person__valg { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; }
.fpk-person__valg form, .fpk-person__adgang { margin: 0; }
.fpk-person__adgang { grid-column: 1 / -1; }
.fpk-person__adgang, .fpk-valgrad { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; font-size: var(--wp--preset--font-size--small, .9375rem); }
.fpk .fpk-person__adgang label, .fpk .fpk-valgrad label { display: inline-flex; gap: .4rem; align-items: center; font-weight: 400; margin: 0; }
.fpk select { font: inherit; color: inherit; padding: .35rem .5rem; background: var(--wp--preset--color--hvid, #FFFDF9); border: 1px solid var(--fpk-kant); border-radius: 4px; }
.fpk select:focus { outline: 3px solid var(--wp--preset--color--gnist, #F08A5D); outline-offset: 2px; }
.fpk .fpk-knap--lille { padding: .35rem .85rem; font-size: var(--wp--preset--font-size--small, .9375rem); }
.fpk button[disabled], .fpk input[disabled] { opacity: .55; cursor: not-allowed; }
.fpk-to { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.fpk-detaljer .fpk-personer { margin-top: 0; }

@media (max-width: 600px) {
  .fpk-kort { padding: 1.25rem; }
  .fpk-link { display: block; margin: .75rem 0 0; }
  .fpk-person { grid-template-columns: 1fr; }
  .fpk-person__valg { justify-content: flex-start; }
  .fpk-to { grid-template-columns: 1fr; }
}
.fpk-liste li { margin-bottom: .6rem; }
.fpk code { font-family: var(--wp--preset--font-family--mono, ui-monospace, Consolas, monospace); font-size: .875rem; background: var(--wp--preset--color--papir, #F7F3EC); border: 1px solid var(--fpk-kant); border-radius: 3px; padding: .1rem .35rem; overflow-wrap: anywhere; }
