/* PARTEM-X BOS — custom color picker widget (shared: wp-admin + tenant dashboard) */

.ptx-color-field{ position:relative; display:inline-block; vertical-align:middle; }

.ptx-color-hidden-input{
	position:absolute !important; width:1px !important; height:1px !important;
	padding:0 !important; margin:-1px !important; overflow:hidden !important;
	clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important;
}

.ptx-color-swatch{
	width:34px; height:34px; border-radius:9px; border:2px solid #fff;
	box-shadow:0 0 0 1px rgba(0,0,0,.15), 0 2px 6px rgba(0,0,0,.12);
	cursor:pointer; padding:0; vertical-align:middle;
}
.ptx-color-swatch:hover{ box-shadow:0 0 0 1px rgba(0,0,0,.25), 0 3px 8px rgba(0,0,0,.18); }

.ptx-color-popover{
	position:absolute; top:calc(100% + 8px); left:0; z-index:5000;
	background:#fff; border-radius:14px; padding:14px;
	box-shadow:0 18px 40px rgba(20,10,45,.28); border:1px solid #ece7f7;
	width:208px;
}

.ptx-color-sv{ display:block; width:180px; height:130px; border-radius:8px; cursor:crosshair; touch-action:none; }
.ptx-color-sv-handle{
	position:absolute; width:20px; height:20px; border-radius:50%;
	border:3px solid #fff; box-shadow:0 0 0 1px rgba(0,0,0,.45), 0 2px 6px rgba(0,0,0,.25);
	transform:translate(-10px,-10px); pointer-events:none;
	top:14px; left:14px; /* overwritten by JS */
}

.ptx-color-hue-track{
	position:relative; height:22px; border-radius:99px; margin-top:14px;
	background:linear-gradient(90deg,#f00 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,#f00 100%);
	cursor:pointer; touch-action:none;
}
.ptx-color-hue-handle{
	position:absolute; top:50%; width:24px; height:24px; border-radius:50%;
	background:#fff; border:3px solid #fff; box-shadow:0 0 0 1px rgba(0,0,0,.4), 0 2px 6px rgba(0,0,0,.2);
	transform:translate(-12px,-50%); pointer-events:none;
}

@media (max-width:480px){
	.ptx-color-popover{ width:min(240px, calc(100vw - 40px)); }
	.ptx-color-sv{ width:100%; height:150px; }
}

.ptx-color-bottom-row{ display:flex; align-items:center; gap:8px; margin-top:12px; }
.ptx-color-preview{ width:28px; height:28px; border-radius:7px; flex-shrink:0; border:1px solid rgba(0,0,0,.1); }
.ptx-color-hex-input{
	flex:1; min-width:0; border:1px solid #e4dffa; border-radius:7px; padding:6px 8px; font-size:12.5px;
	text-transform:uppercase;
}
.ptx-color-done{
	border:0; background:#6d28d9; color:#fff; font-size:11.5px; font-weight:700;
	padding:7px 12px; border-radius:7px; cursor:pointer; flex-shrink:0;
}
.ptx-color-done:hover{ filter:brightness(1.08); }

.ptx-color-gradient-preview{
	display:inline-flex; align-items:center; gap:10px; margin-left:10px; vertical-align:middle;
}
.ptx-color-gradient-swatch{
	width:64px; height:34px; border-radius:9px; border:1px solid rgba(0,0,0,.12);
	box-shadow:0 2px 6px rgba(0,0,0,.1);
}
.ptx-color-gradient-label{ font-size:11.5px; color:#8a7fa8; font-weight:600; }