@font-face {
	font-family: "Shamyli Cairo";
	src: url("../fonts/cairo-arabic-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

.shamyli-wvm [hidden] {
	display: none !important;
}

@font-face {
	font-family: "Shamyli Cairo";
	src: url("../fonts/cairo-arabic-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Amiri";
	src: url("../fonts/amiri-arabic-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Amiri";
	src: url("../fonts/amiri-arabic-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Ruqaa";
	src: url("../fonts/aref-ruqaa-arabic-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Ruqaa";
	src: url("../fonts/aref-ruqaa-arabic-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Kufi";
	src: url("../fonts/noto-kufi-arabic-arabic-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Naskh";
	src: url("../fonts/noto-naskh-arabic-arabic-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Naskh";
	src: url("../fonts/noto-naskh-arabic-arabic-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Scheherazade";
	src: url("../fonts/scheherazade-new-arabic-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Scheherazade";
	src: url("../fonts/scheherazade-new-arabic-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Lateef";
	src: url("../fonts/lateef-arabic-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Lateef";
	src: url("../fonts/lateef-arabic-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Shamyli Kufi";
	src: url("../fonts/noto-kufi-arabic-arabic-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

.shamyli-wvm {
	--wvm-gold: #d5ad57;
	--wvm-deep: #071711;
	--wvm-panel: #ffffff;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 430px);
	gap: 32px;
	align-items: start;
	max-width: 1180px;
	margin: 32px auto;
	padding: 24px;
	color: #17201c;
	font-family: "Shamyli Cairo", Cairo, Tahoma, Arial, sans-serif;
}

.shamyli-wvm * {
	box-sizing: border-box;
}

.shamyli-wvm__editor {
	padding: 30px;
	border: 1px solid #e6e9e7;
	border-radius: 24px;
	background: var(--wvm-panel);
	box-shadow: 0 18px 55px rgba(15, 42, 29, 0.08);
}

.shamyli-wvm__eyebrow {
	color: #93722e;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 1.4px;
	text-transform: uppercase;
}

.shamyli-wvm__header h2 {
	margin: 8px 0 6px;
	font-size: clamp(26px, 4vw, 38px);
	line-height: 1.2;
}

.shamyli-wvm__header p {
	margin: 0 0 24px;
	color: #607068;
}

.shamyli-wvm__fields {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.shamyli-wvm__projects {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 12px;
	margin: 0 0 22px;
	padding: 16px;
	border: 1px solid #eadfbf;
	border-radius: 16px;
	background: #fffcf3;
}

.shamyli-wvm__projects select {
	width: 100%;
	min-height: 48px;
	padding: 9px 34px 9px 12px;
	border: 1px solid #d7ddd9;
	border-radius: 12px;
	background: #fff;
	color: #17201c;
	font: inherit;
}

.shamyli-wvm__project-actions {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.shamyli-wvm__project-actions button {
	min-height: 38px;
	padding: 7px 15px;
	border: 1px solid #b89a56;
	border-radius: 10px;
	background: #fff;
	color: #493b1e;
	font: 700 13px/1.2 "Shamyli Cairo", Cairo, Tahoma, Arial, sans-serif;
	cursor: pointer;
}

.shamyli-wvm__project-actions button:hover {
	background: #f7edcf;
}

.shamyli-wvm__project-actions .is-danger {
	margin-inline-start: auto;
	border-color: #d7a6a6;
	color: #a52626;
}

.shamyli-wvm__project-actions button:disabled {
	cursor: not-allowed;
	opacity: 0.45;
}

.shamyli-wvm label {
	display: grid;
	gap: 7px;
	font-weight: 700;
}

.shamyli-wvm label span {
	font-size: 14px;
}

.shamyli-wvm input,
.shamyli-wvm textarea,
.shamyli-wvm__fields select {
	width: 100%;
	min-height: 48px;
	padding: 10px 13px;
	border: 1px solid #d7ddd9;
	border-radius: 12px;
	background: #fbfcfb;
	color: #17201c;
	font: inherit;
}

.shamyli-wvm input:focus,
.shamyli-wvm textarea:focus,
.shamyli-wvm__fields select:focus {
	border-color: #9c7b35;
	outline: 3px solid rgba(213, 173, 87, 0.18);
}

.shamyli-wvm textarea {
	min-height: 130px;
	resize: vertical;
	line-height: 1.8;
}

.shamyli-wvm__guests {
	display: grid;
	gap: 14px;
	padding: 16px;
	border: 1px solid #d7c89f;
	border-radius: 16px;
	background: linear-gradient(145deg, #fffdf8, #f7f1e2);
}

.shamyli-wvm__guests legend {
	padding: 0 7px;
	font-size: 15px;
	font-weight: 800;
}

.shamyli-wvm__guest-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.shamyli-wvm__guest-protection {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	padding: 12px;
	border: 1px solid rgba(184, 154, 86, 0.28);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.72);
}

.shamyli-wvm__guest-protection label {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 13px;
}

.shamyli-wvm__guest-protection input[type="checkbox"] {
	width: 19px;
	min-height: 19px;
	margin: 0;
	accent-color: #9c7b35;
}

.shamyli-wvm__button--batch {
	border-color: #9c7b35;
	background: #9c7b35;
}

.shamyli-wvm__effects {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	padding: 13px 15px 15px;
	border: 1px solid #d7ddd9;
	border-radius: 14px;
	background: #fbfcfb;
}

.shamyli-wvm__effects legend {
	padding: 0 7px;
	font-size: 14px;
	font-weight: 800;
}

.shamyli-wvm__effects label {
	display: flex;
	grid-gap: 7px;
	align-items: center;
	font-size: 13px;
}

.shamyli-wvm__effects input[type="checkbox"] {
	width: 19px;
	min-height: 19px;
	margin: 0;
	accent-color: #9c7b35;
}

.shamyli-wvm__content-options {
	display: grid;
	gap: 14px;
	padding: 16px;
	border: 1px solid #d7c89f;
	border-radius: 16px;
	background: linear-gradient(145deg, #fffdf7, #fff8ec);
}

.shamyli-wvm__content-options legend {
	padding: 0 7px;
	font-size: 15px;
	font-weight: 800;
}

.shamyli-wvm__content-options > p {
	margin: 0;
	color: #6d6250;
	font-size: 12px;
}

.shamyli-wvm__content-group {
	display: grid;
	gap: 9px;
	padding: 12px;
	border: 1px solid rgba(184, 154, 86, 0.25);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.78);
}

.shamyli-wvm__content-group strong {
	color: #806426;
	font-size: 13px;
}

.shamyli-wvm__content-group label {
	display: grid;
	grid-template-columns: 20px minmax(0, 1fr);
	gap: 9px;
	align-items: start;
	font-weight: 500;
	line-height: 1.7;
}

.shamyli-wvm__content-group input[type="checkbox"] {
	width: 18px;
	min-height: 18px;
	margin-top: 3px;
	accent-color: #9c7b35;
}

.shamyli-wvm__content-group label span {
	font-size: 13px;
}

.shamyli-wvm input[type="file"] {
	padding: 7px;
	font-size: 13px;
}

.shamyli-wvm input[type="date"] {
	direction: rtl;
	color-scheme: light;
}

.shamyli-wvm small {
	color: #6d7a73;
	font-size: 11px;
	font-weight: 400;
}

.shamyli-wvm__wide {
	grid-column: 1 / -1;
}

.shamyli-wvm__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 22px;
}

.shamyli-wvm__terms {
	margin-top: 22px;
	padding: 14px 16px;
	border: 1px solid #d9c8a5;
	border-radius: 14px;
	background: #fffaf0;
	color: #3c463f;
}

.shamyli-wvm__terms summary {
	cursor: pointer;
	font-weight: 800;
}

.shamyli-wvm__terms ul {
	margin: 12px 0 0;
	padding-right: 20px;
	line-height: 1.9;
}

.shamyli-wvm__terms-accept {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin-top: 12px;
	font-weight: 700;
}

.shamyli-wvm__terms-accept input {
	width: 18px;
	height: 18px;
	margin-top: 2px;
	accent-color: #173e2b;
}

.shamyli-wvm__button {
	min-height: 48px;
	padding: 10px 20px;
	border: 1px solid #173e2b;
	border-radius: 12px;
	background: #173e2b;
	color: #fff;
	font: 700 15px/1.2 "Shamyli Cairo", Cairo, Tahoma, Arial, sans-serif;
	cursor: pointer;
}

.shamyli-wvm__button--ghost {
	background: #fff;
	color: #173e2b;
}

.shamyli-wvm__button:disabled {
	cursor: wait;
	opacity: 0.55;
}

.shamyli-wvm__status {
	min-height: 24px;
	margin-top: 13px;
	color: #4c5d54;
	font-size: 13px;
}

.shamyli-wvm__stage-wrap {
	position: sticky;
	top: 24px;
	display: grid;
	place-items: center;
}

.shamyli-wvm__phone {
	width: min(100%, 390px);
	overflow: hidden;
	border: 7px solid #111814;
	border-radius: 36px;
	background: #071711;
	box-shadow: 0 28px 70px rgba(0, 0, 0, 0.22);
	aspect-ratio: 9 / 16;
}

.shamyli-wvm canvas {
	display: block;
	width: 100%;
	height: 100%;
}

.shamyli-wvm__share-box {
	margin: 22px 0 12px;
	padding: 18px;
	border: 1px solid #d7b56f;
	border-radius: 18px;
	background: #fffaf0;
}

.shamyli-wvm__share-box legend {
	padding: 0 8px;
	font-weight: 800;
	color: #6b431d;
}

.shamyli-wvm__share-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.shamyli-wvm__share-grid label,
.shamyli-wvm__share-url {
	display: grid;
	gap: 6px;
}

.shamyli-wvm__share-grid input,
.shamyli-wvm__share-copy input {
	width: 100%;
	min-width: 0;
	padding: 10px 12px;
	border: 1px solid #d8c7aa;
	border-radius: 10px;
	background: #fff;
}

.shamyli-wvm__share-check {
	display: flex;
	gap: 8px;
	align-items: center;
	margin: 14px 0;
}

.shamyli-wvm__share-actions,
.shamyli-wvm__share-copy {
	display: flex;
	gap: 10px;
}

.shamyli-wvm__share-actions {
	margin-bottom: 14px;
	flex-wrap: wrap;
}

.shamyli-wvm__share-copy button {
	padding: 8px 16px;
	border: 0;
	border-radius: 10px;
	background: #0b5b38;
	color: #fff;
	cursor: pointer;
}

.shamyli-wvm__share-copy button:disabled {
	opacity: .45;
	cursor: not-allowed;
}

.shamyli-wvm-notice {
	padding: 15px;
	border-right: 4px solid #b88627;
	background: #fff8e7;
}

@media (max-width: 820px) {
	.shamyli-wvm {
		grid-template-columns: 1fr;
		padding: 14px;
	}

	.shamyli-wvm__stage-wrap {
		position: static;
		grid-row: 1;
	}
}

@media (max-width: 520px) {
	.shamyli-wvm__editor {
		padding: 20px 16px;
	}

	.shamyli-wvm__fields {
		grid-template-columns: 1fr;
	}

	.shamyli-wvm__projects {
		grid-template-columns: 1fr;
	}

	.shamyli-wvm__project-actions {
		grid-column: auto;
	}

	.shamyli-wvm__wide {
		grid-column: auto;
	}

	.shamyli-wvm__guest-grid {
		grid-template-columns: 1fr;
	}

	.shamyli-wvm__share-grid {
		grid-template-columns: 1fr;
	}
}

.shamyli-wvm-login {
	direction: rtl;
	max-width: 560px;
	margin: 48px auto;
	padding: 42px 28px;
	text-align: center;
	border: 1px solid #d9b56d;
	border-radius: 28px;
	background: radial-gradient(circle at top, #fffefb, #f8ead0);
	box-shadow: 0 24px 70px rgba(66, 44, 25, .15);
	color: #173f32;
}
.shamyli-wvm-login__icon { display:grid;place-items:center;width:76px;height:76px;margin:0 auto 15px;border-radius:50%;background:#173f32;color:#f4d38b;font-size:34px; }
.shamyli-wvm-login__brand { margin:0;color:#a27628;font-weight:800;letter-spacing:2px; }
.shamyli-wvm-login h2 { margin:8px 0 10px;font-size:32px;color:#173f32; }
.shamyli-wvm-login > p:not(.shamyli-wvm-login__brand) { color:#685b4d;font-size:17px; }
.shamyli-wvm-login__button { display:block;max-width:300px;margin:24px auto 14px;padding:14px 24px;border-radius:999px;background:#17613f;color:#fff!important;text-decoration:none!important;font-weight:800;font-size:18px;box-shadow:0 10px 24px rgba(23,97,63,.2); }
.shamyli-wvm-login__button:hover { background:#104b30;transform:translateY(-1px); }
.shamyli-wvm-login__forgot { color:#8c692d;text-decoration:none; }

/* Studio preview player controls: editor-only UI, never rendered into exported video. */
.shamyli-wvm__preview-shell {
	width: min(100%, 390px);
}

.shamyli-wvm__player {
	direction: ltr;
	display: grid;
	grid-template-columns: auto auto minmax(90px, 1fr) auto 78px auto;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
	padding: 10px 12px;
	border: 1px solid #d8dedb;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 10px 28px rgba(17, 24, 20, 0.10);
}

.shamyli-wvm__player-button {
	width: 34px;
	height: 34px;
	padding: 0;
	border: 1px solid #d6ddd9;
	border-radius: 50%;
	background: #f7faf8;
	color: #173e2b;
	font: inherit;
	font-size: 16px;
	cursor: pointer;
}

.shamyli-wvm__player-time {
	font-size: 12px;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	color: #53635a;
}

.shamyli-wvm__player-seek,
.shamyli-wvm__player-volume {
	width: 100%;
	min-width: 0;
	accent-color: #b88945;
	cursor: pointer;
}

@media (max-width: 480px) {
	.shamyli-wvm__player {
		grid-template-columns: auto 1fr auto auto;
	}
	.shamyli-wvm__player-time { grid-column: 2 / 3; }
	.shamyli-wvm__player-seek { grid-column: 1 / -1; grid-row: 2; }
	.shamyli-wvm__player-volume { display: none; }
}

.shamyli-wvm__brand-lock{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid rgba(180,140,55,.28);border-radius:12px;background:rgba(244,197,66,.08)}.shamyli-wvm__brand-lock small{opacity:.78;line-height:1.7}