/**
 * Admin Toolbar Live Clock: Analog clock styles.
 *
 * Provides styles for analog clock themes (including Tomanify), sizing,
 * and optional date layout within the analog face.
 *
 * @since   1.1.0
 * @package AdminToolbarLiveClock
 * @author  Amin Raoufi
 * @license GPL-2.0-or-later
 */


.atlc-analog-shell{
	display:inline-flex;
	align-items:center;
	gap:10px;
}

.atlc-analog-face{
	position:relative;
	width:var(--atlc-analog-size, 40px);
	height:var(--atlc-analog-size, 40px);
	border-radius:50%;
	background:var(--atlc-face-bg, #ffffff);
	box-shadow:0 2px 10px rgba(0,0,0,.12);
	overflow:hidden;
	flex:0 0 auto;
}

.atlc-analog-face::before{
	content:"";
	position:absolute;
	inset:0;
	border-radius:50%;
	background:
		repeating-conic-gradient(
			from -90deg,
			rgba(0,0,0,.22) 0 1deg,
			transparent 1deg 6deg
		);
	opacity:.45;
}

.atlc-analog-face::after{
	content:"";
	position:absolute;
	inset:8%;
	border-radius:50%;
	border:1px solid rgba(0,0,0,.08);
}

.atlc-analog-center{
	position:absolute;
	left:50%;
	top:50%;
	width:10%;
	height:10%;
	transform:translate(-50%, -50%);
	border-radius:50%;
	background:rgba(0,0,0,.75);
	z-index:5;
}

.atlc-hand{
	position:absolute;
	left:50%;
	top:50%;
	transform-origin:50% 100%;
	transform:translate(-50%, -100%) rotate(0deg);
	border-radius:999px;
	z-index:4;
	background:var(--atlc-accent, #2ECC71);
}

.atlc-hand.atlc-hour{
	width:10%;
	height:30%;
}

.atlc-hand.atlc-minute{
	width:7%;
	height:40%;
	opacity:.95;
}

.atlc-hand.atlc-second{
	width:3%;
	height:46%;
	background:var(--atlc-date-color, #E74C3C);
}

.atlc-analog-date{
	position:absolute;
	left:50%;
	top:65%;
	transform:translate(-50%, -50%);
	z-index:7;

	width:100%;
	padding:0 18%;
	text-align:center;

	font-weight:500;
	line-height:1;
	letter-spacing:0.06em;

	font-size:clamp(7px, calc(var(--atlc-analog-size, 40px) * 0.10), 18px);
	color:#E74C3C;

	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;

	pointer-events:none;
	text-shadow:0 1px 2px rgba(0,0,0,.35);
}


/* Theme: Modern (iOS-like) */
.atlc-theme-modern .atlc-analog-face{
	background:
		radial-gradient(circle at 30% 25%, rgba(255,255,255,.95), rgba(255,255,255,.65) 40%, rgba(240,240,240,.92) 100%);
}

/* Theme: Material */
.atlc-theme-material .atlc-analog-face{
	box-shadow:0 3px 0 rgba(0,0,0,.10), 0 8px 18px rgba(0,0,0,.16);
}
.atlc-theme-material .atlc-analog-face::before{
	opacity:.60;
}

/* Admin bar sizing */
#wpadminbar .atlc-analog-shell{
	--atlc-analog-size: 34px;
	gap:8px;
}

/* Floating clock sizing */
#atlc-floating-clock .atlc-analog-shell{
	flex-direction:column;
	align-items:center;
	gap:8px;
	--atlc-analog-size: clamp(72px, 12vw, 150px);
}

/* Hide date (Analog) */
.atlc-analog-shell.atlc-hide-date .atlc-analog-date{
	display:none;
}

/* Size (Analog) */
#atlc-floating-clock .atlc-analog-shell.atlc-size-small{
	--atlc-analog-size: clamp(36px, 6vw, 75px);
}


/* Theme: Tomanify */
.atlc-theme-tomanify .atlc-analog-face{
	/* Gradient frame + black face */
	--atlc-ring-size: clamp(7px, calc(var(--atlc-analog-size, 40px) * 0.10), 22px);

	border: var(--atlc-ring-size) solid transparent;
	background:
		linear-gradient(#000, #000) padding-box,
		linear-gradient(0deg, #ff4fd8, #3b82f6) border-box;

	box-shadow:none;
	overflow:hidden;
}
/* Remove tick marks for a clean look */
.atlc-theme-tomanify .atlc-analog-face::before,
.atlc-theme-tomanify .atlc-analog-face::after{
	opacity:0;
}

/* Hands: hour uses clock color, minute uses date color, second is fixed red */
.atlc-theme-tomanify .atlc-hand.atlc-hour{
	background:var(--atlc-accent, #2ECC71);
}
.atlc-theme-tomanify .atlc-hand.atlc-minute{
	background:var(--atlc-date-color, #E74C3C);
}
.atlc-theme-tomanify .atlc-hand.atlc-second{
	background:#ff3b30;
	width:2%;
	height:48%;
}

/* Center dot */
.atlc-theme-tomanify .atlc-analog-center{
	background:rgba(255,255,255,1);
}

/* Numbers 1–12 (Tomanify) */
.atlc-theme-tomanify .atlc-analog-num{
	position:absolute;
	transform:translate(-50%, -50%);
	display:flex;
	align-items:center;
	justify-content:center;

	/* Equal box size for 1–9 and 10–12 */
	width:1.9em;
	height:1.9em;

	font-weight:800;
	line-height:1;
	font-variant-numeric: tabular-nums;

	color:var(--atlc-accent, #2ECC71);
	user-select:none;
	-webkit-user-select:none;
	pointer-events:none;

	/* Responsive size with safe limits */
	font-size: clamp(10px, calc(var(--atlc-analog-size, 40px) * 0.16), 30px);
}
/* Hide numbers by default; only show in Tomanify theme */
.atlc-theme-modern .atlc-analog-num,
.atlc-theme-material .atlc-analog-num{
	display:none;
}