/* Kvali Ordreflow - kundens rettelser paa "Vis ordre" i Min konto */
.kvof { background: #fff; border: 1px solid var(--k-gray-light, #e5e5e5); border-radius: var(--k-radius, 14px); padding: 20px 22px; margin: 0 0 18px; box-shadow: var(--k-shadow-card, var(--k-shadow, 0 2px 12px rgba(0,0,0,.05))); }
.kvof__head { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 6px; }
.kvof__head .kvs-ico { width: 40px; height: 40px; flex: 0 0 40px; padding: 9px; box-sizing: border-box; border-radius: 10px; background: #fde9c8; color: #7a4b00; }
.kvof__head strong { display: block; font-size: 17px; margin: 3px 0 4px; }
.kvof__head p { margin: 0; color: #555; line-height: 1.5; }
.kvof__msg { margin: 10px 0 0; padding: 10px 14px; border-radius: 8px; font-weight: 600; font-size: 14px; }
.kvof__msg.is-ok { background: #e6f6ee; color: #0a6b3d; }
.kvof__msg.is-err { background: #fde8e8; color: #a11; }
.kvof__sec { border-top: 1px solid var(--k-gray-light, #e5e5e5); padding: 16px 0 4px; margin-top: 14px; }
.kvof__sec h3 { margin: 0 0 10px; font-size: 15px; text-transform: uppercase; letter-spacing: -.01em; }
.kvof__sec h4 { margin: 0 0 8px; font-size: 13px; color: #666; text-transform: uppercase; letter-spacing: .06em; }
.kvof__items { list-style: none; margin: 0; padding: 0; }
.kvof__item { display: flex; gap: 14px; align-items: flex-start; padding: 10px 0; border-top: 1px solid #f0f0f0; flex-wrap: wrap; }
.kvof__item:first-child { border-top: 0; }
.kvof__img img { width: 56px; height: 56px; object-fit: contain; border-radius: 8px; background: var(--k-bg, #f5f5f5); }
.kvof__body { flex: 1 1 260px; min-width: 0; }
.kvof__body strong { display: block; font-size: 14px; margin-bottom: 4px; }
.kvof__color { font-size: 13.5px; color: #333; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.kvof__color b { color: var(--k-dark, #17181c); }
.kvof__colorpick { flex-basis: 100%; margin-top: 8px; }
.kvof__cp { background: #fff; border: 1.5px solid var(--k-gray-light, #e2e2e0); border-radius: 12px; padding: 12px; box-shadow: 0 6px 20px rgba(23, 24, 28, .08); }
.kvof__cp-search { display: flex; align-items: center; gap: 8px; border: 1.5px solid var(--k-gray-light, #ddd); border-radius: 10px; padding: 0 12px; background: #fff; color: #8a8d94; transition: border-color .15s, box-shadow .15s; }
.kvof__cp-search:focus-within { border-color: var(--k-red, #d0121a); box-shadow: 0 0 0 3px rgba(208, 18, 26, .12); }
.kvof__cp-search input { flex: 1 1 auto; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 15px; padding: 11px 0; color: var(--k-dark, #17181c); }
.kvof__cp-charts { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; }
.kvof__cp-chip { font: inherit; font-size: 12.5px; font-weight: 700; border: 1.5px solid var(--k-gray-light, #ddd); background: #fff; color: #3d3f45; border-radius: 999px; padding: 5px 11px; cursor: pointer; }
.kvof__cp-chip:hover { border-color: #bbb; }
.kvof__cp-chip.is-on { background: var(--k-dark, #17181c); border-color: var(--k-dark, #17181c); color: #fff; }
.kvof__cp-list { list-style: none; margin: 10px 0 0; padding: 2px; max-height: 300px; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 6px; overscroll-behavior: contain; }
.kvof__cp-opt { display: flex; align-items: center; gap: 10px; padding: 7px 9px; border: 1.5px solid transparent; border-radius: 10px; cursor: pointer; background: var(--k-bg, #f7f7f6); min-width: 0; }
.kvof__cp-opt:hover, .kvof__cp-opt:focus-visible { border-color: #cfcfcc; outline: 0; background: #fff; }
.kvof__cp-opt.is-on { border-color: var(--k-red, #d0121a); background: #fff5f5; box-shadow: 0 0 0 2px rgba(208, 18, 26, .12); }
.kvof__cp-sw { flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .12); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .6); }
.kvof__cp-sw.is-none { background: repeating-linear-gradient(45deg, #eee 0 4px, #fff 4px 8px); }
.kvof__cp-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.kvof__cp-txt b { font-size: 13.5px; font-weight: 700; color: var(--k-dark, #17181c); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kvof__cp-txt small { font-size: 11.5px; color: #8a8d94; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kvof__cp-cur { margin-left: auto; flex: 0 0 auto; font-style: normal; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #8a8d94; }
.kvof__cp-more { font-size: 12.5px; color: #8a8d94; margin: 8px 2px 0; }
.kvof__cp-none { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; font-size: 13.5px; color: #55585f; margin: 10px 2px 0; }
.kvof__cp-none[hidden], .kvof__cp-more[hidden], .kvof__cp-list[hidden] { display: none; }
.kvof__cp-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--k-gray-light, #eee); }
.kvof__cp-sel { font-size: 13.5px; color: #55585f; }
.kvof__cp-sel b { color: var(--k-dark, #17181c); }
.kvof__cp-btns { display: flex; align-items: center; gap: 12px; }
.kvof__cp-btns .kvali-btn[disabled] { opacity: .45; cursor: not-allowed; }
@media (max-width: 600px) { .kvof__cp-list { grid-template-columns: 1fr; max-height: 260px; } .kvof__cp-foot { flex-direction: column; align-items: stretch; } .kvof__cp-btns { justify-content: space-between; } }
.kvof__qty { display: flex; gap: 12px; align-items: center; }
.kvof__qty label { display: flex; gap: 6px; align-items: center; font-size: 13px; font-weight: 700; }
.kvof__qty select { font: inherit; font-size: 14px; padding: 6px 8px; border: 1.5px solid var(--k-gray-light, #ddd); border-radius: 8px; background: #fff; }
.kvof__link { background: none; border: 0; padding: 0; font: inherit; font-size: 13px; font-weight: 700; color: var(--k-red, #d7141a); text-decoration: underline; cursor: pointer; }
.kvof__remove { color: #777; }
.kvof__remove:hover { color: var(--k-red, #d7141a); }
.kvof__hint { font-size: 13px; color: #666; margin: 10px 0 0; line-height: 1.5; }
.kvof__addr { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.kvof__addract { grid-column: 1 / -1; margin: 0; }
.kvof__f { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; font-weight: 700; margin: 0 0 8px; }
.kvof__f input { font: inherit; font-weight: 400; font-size: 14px; padding: 8px 10px; border: 1.5px solid var(--k-gray-light, #ddd); border-radius: 8px; }
.kvof__f--postcode, .kvof__f--city { display: inline-flex; width: calc(50% - 5px); }
.kvof__f--postcode { margin-right: 10px; }
.kvof__same { display: flex; gap: 8px; align-items: center; font-size: 13.5px; font-weight: 600; margin: 0 0 10px; }
.kvof__same input { width: 16px; height: 16px; accent-color: var(--k-red, #d7141a); margin: 0; }
.kvof__sec--cancel { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.kvof__sec--cancel h3 { margin-bottom: 4px; }
.kvof__sec--cancel .kvof__hint { margin: 0; }
.kvof__cancel { color: var(--k-red, #d7141a) !important; box-shadow: inset 0 0 0 1.5px var(--k-red, #d7141a) !important; white-space: nowrap; }
.kvof.is-busy { opacity: .6; pointer-events: none; }
.kvof-locked { display: flex; gap: 12px; align-items: center; background: var(--k-bg, #f7f7f7); border-radius: 10px; padding: 12px 16px; margin: 0 0 18px; color: #444; font-size: 14px; }
.kvof-locked .kvs-ico { width: 22px; height: 22px; flex: 0 0 22px; color: var(--k-red, #d7141a); }
.kvof-locked p { margin: 0; }
@media (max-width: 700px) { .kvof__addr { grid-template-columns: 1fr; } .kvof { padding: 16px; } }
.kvof [hidden] { display: none !important; }
.kvof__qtytxt { font-size: 13px; } .kvof__qtytxt small { color: #777; font-weight: 400; }
