/* DVHubs Watermark & Brand Kit */
.dvh-bk {
	--bk-primary: #4F46E5; --bk-primary-dark: #4338CA; --bk-dark: #111827; --bk-text: #374151;
	--bk-muted: #6B7280; --bk-line: #E5E7EB; --bk-soft: #F9FAFB; --bk-ok: #10B981; --bk-bad: #EF4444;
	max-width: 1180px; margin: 2rem auto; padding: 2rem; background: #fff; border: 1px solid var(--bk-line);
	border-radius: 1rem; box-shadow: 0 10px 15px -3px rgba(0,0,0,.08); color: var(--bk-text); box-sizing: border-box;
}
.dvh-bk *, .dvh-bk *::before, .dvh-bk *::after { box-sizing: border-box; }
.dvh-bk [hidden] { display: none !important; }
.dvh-bk-title { font-size: 1.75rem; font-weight: 800; color: var(--bk-dark); margin: 0 0 .25rem; }
.dvh-bk-sub { margin: 0 0 1.5rem; color: var(--bk-muted); }

.dvh-bk-layout { display: grid; grid-template-columns: 320px 1fr; gap: 1.5rem; align-items: start; }
@media (max-width: 860px) { .dvh-bk { padding: 1.25rem; } .dvh-bk-layout { grid-template-columns: 1fr; } }

.dvh-bk-panel { background: var(--bk-soft); border: 1px solid var(--bk-line); border-radius: .75rem; padding: 1.25rem; }
.dvh-bk-group { padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--bk-line); }
.dvh-bk-group:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.dvh-bk-label { display: flex; justify-content: space-between; gap: .5rem; font-weight: 700; color: var(--bk-dark); margin: .5rem 0 .4rem; font-size: .9rem; }
.dvh-bk-label span { font-weight: 400; color: var(--bk-muted); }
.dvh-bk input[type="text"], .dvh-bk select { width: 100%; padding: .6rem .75rem; border: 2px solid var(--bk-line); border-radius: .5rem; font: inherit; background: #fff; }
.dvh-bk input[type="text"]:focus, .dvh-bk select:focus { outline: none; border-color: var(--bk-primary); }
.dvh-bk input[type="range"] { width: 100%; accent-color: var(--bk-primary); }
.dvh-bk input[type="color"] { width: 100%; height: 2.4rem; border: 2px solid var(--bk-line); border-radius: .5rem; padding: 2px; background: #fff; }
.dvh-bk input[type="file"] { width: 100%; font-size: .85rem; }
.dvh-bk-inline { display: flex; gap: .5rem; }
.dvh-bk-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.dvh-bk-check { display: flex; align-items: center; gap: .5rem; font-size: .88rem; margin-top: .6rem; }
.dvh-bk-check select { width: auto; }

.dvh-bk-tabs { display: grid; grid-template-columns: 1fr 1fr; background: #fff; border: 1px solid var(--bk-line); border-radius: .5rem; padding: 3px; }
.dvh-bk-tab { border: 0; background: transparent; padding: .5rem; border-radius: .4rem; font-weight: 600; cursor: pointer; color: var(--bk-text); }
.dvh-bk-tab.is-active { background: var(--bk-primary); color: #fff; }

.dvh-bk-grid { display: grid; grid-template-columns: repeat(3, 2.4rem); gap: 4px; }
.dvh-bk-grid.is-disabled { opacity: .4; }
.dvh-bk-pos { width: 2.4rem; height: 1.8rem; border: 1px solid var(--bk-line); background: #fff; border-radius: .3rem; cursor: pointer; position: relative; }
.dvh-bk-pos.is-active { background: var(--bk-primary); border-color: var(--bk-primary); }

.dvh-bk-mini { border: 1px solid var(--bk-line); background: #fff; color: var(--bk-text); border-radius: .5rem; padding: .5rem .8rem; font-weight: 600; cursor: pointer; white-space: nowrap; font-size: .85rem; }
.dvh-bk-mini:hover { border-color: var(--bk-primary); color: var(--bk-primary); }
.dvh-bk-btn { display: inline-block; padding: .9rem 1.6rem; border: 0; border-radius: .6rem; background: linear-gradient(135deg, var(--bk-primary), var(--bk-primary-dark)); color: #fff !important; font-weight: 700; cursor: pointer; text-decoration: none; }
.dvh-bk-btn:disabled { opacity: .6; cursor: wait; }
.dvh-bk-msg { margin-top: .5rem; font-size: .88rem; font-weight: 600; color: var(--bk-ok); }
.dvh-bk-msg.is-error { color: var(--bk-bad); }

.dvh-bk-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; text-align: center; padding: 2rem 1rem; border: 2px dashed #C7D2FE; border-radius: .75rem; background: #EEF2FF; cursor: pointer; }
.dvh-bk-drop.is-over { background: #E0E7FF; border-color: var(--bk-primary); }
.dvh-bk-drop input { display: none; }
.dvh-bk-drop strong { color: var(--bk-primary-dark); font-size: 1.05rem; }
.dvh-bk-drop span { color: var(--bk-muted); font-size: .88rem; }

.dvh-bk-preview { margin-top: 1rem; background: repeating-conic-gradient(#F3F4F6 0% 25%, #fff 0% 50%) 50% / 20px 20px; border: 1px solid var(--bk-line); border-radius: .75rem; padding: .75rem; text-align: center; }
.dvh-bk-preview canvas { max-width: 100%; height: auto; max-height: 520px; border-radius: .4rem; }
.dvh-bk-hint { font-size: .82rem; color: var(--bk-muted); margin: .5rem 0 0; }

.dvh-bk-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: .5rem; margin-top: 1rem; }
.dvh-bk-thumb { position: relative; aspect-ratio: 1; border: 2px solid var(--bk-line); border-radius: .5rem; overflow: hidden; cursor: pointer; background: var(--bk-soft); }
.dvh-bk-thumb.is-active { border-color: var(--bk-primary); }
.dvh-bk-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dvh-bk-x { position: absolute; top: 3px; right: 3px; width: 1.4rem; height: 1.4rem; border: 0; border-radius: 50%; background: rgba(17,24,39,.75); color: #fff; cursor: pointer; line-height: 1; font-size: 1rem; }

.dvh-bk-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 1.25rem; }
.dvh-bk-actions .dvh-bk-check { margin: 0; }
.dvh-bk-actions .dvh-bk-msg { flex-basis: 100%; margin: 0; }
.dvh-bk-legal { font-size: .8rem; color: var(--bk-muted); margin-top: 1rem; }
.dvh-bk-locked { text-align: center; }
.dvh-bk-locked p { color: var(--bk-muted); }
