/* Hallmark · component: panel-home-support · genre: modern-minimal · theme: HizliOnay purple
 * States: default, hover, focus-visible, active, disabled, loading, error, success
 * Contrast: explicit light and dark surfaces, text, borders, and status colors
 */
.panel-home-support {
	--phs-accent: #7048e8;
	--phs-accent-strong: #5b35d5;
	--phs-ink: #211d2b;
	--phs-muted: #777384;
	--phs-surface: #ffffff;
	--phs-soft: #f7f6fa;
	--phs-border: #e9e6ef;
	--phs-shadow: 0 12px 34px rgba(35, 24, 64, .055);
}

.panel-home-support__surface {
	background: var(--phs-surface);
	border: 1px solid var(--phs-border);
	border-radius: 20px;
	box-shadow: var(--phs-shadow);
	overflow: hidden;
}

.panel-home-support__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 25px 28px;
	border-bottom: 1px solid var(--phs-border);
}

.panel-home-support__heading,
.panel-home-support__actions,
.panel-home-ticket__top,
.panel-home-ticket__bottom {
	display: flex;
	align-items: center;
}

.panel-home-support__heading {
	min-width: 0;
	gap: 16px;
}

.panel-home-support__icon,
.panel-home-ticket__mark,
.panel-home-support__empty-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--phs-accent);
	background: rgba(112, 72, 232, .10);
}

.panel-home-support__icon {
	width: 48px;
	height: 48px;
	border-radius: 15px;
	font-size: 19px;
}

.panel-home-support__copy { min-width: 0; }

.panel-home-support__eyebrow {
	margin: 0 0 4px;
	color: var(--phs-accent);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	line-height: 1.35;
	text-transform: uppercase;
}

.panel-home-support__title {
	margin: 0;
	color: var(--phs-ink);
	font-size: clamp(18px, 1.5vw, 21px);
	font-weight: 700;
	letter-spacing: -.025em;
	line-height: 1.3;
}

.panel-home-support__subtitle {
	margin: 4px 0 0;
	color: var(--phs-muted);
	font-size: 13px;
	line-height: 1.5;
}

.panel-home-support__actions {
	flex: 0 0 auto;
	gap: 10px;
}

.panel-home-support__button,
.panel-home-support__empty-action,
.panel-home-ticket__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 42px;
	border: 1px solid transparent;
	border-radius: 11px;
	font: inherit;
	font-size: 12px;
	font-weight: 650;
	line-height: 1.25;
	text-decoration: none;
	transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.panel-home-support__button {
	padding: 0 15px;
	cursor: pointer;
}

.panel-home-support__button--primary {
	color: #fff;
	background: var(--phs-accent);
}

.panel-home-support__button--primary:hover {
	color: #fff;
	background: var(--phs-accent-strong);
	box-shadow: 0 5px 14px rgba(91, 53, 213, .20);
}

.panel-home-support__button--secondary {
	color: var(--phs-ink);
	background: var(--phs-surface);
	border-color: var(--phs-border);
}

.panel-home-support__button--secondary:hover {
	color: var(--phs-accent-strong);
	background: var(--phs-soft);
	border-color: rgba(112, 72, 232, .35);
}

.panel-home-support__button:focus-visible,
.panel-home-support__empty-action:focus-visible,
.panel-home-ticket a:focus-visible {
	outline: 3px solid rgba(112, 72, 232, .32);
	outline-offset: 3px;
}

.panel-home-support__button:active,
.panel-home-support__empty-action:active,
.panel-home-ticket__link:active { transform: translateY(1px); }

.panel-home-support__button:disabled,
.panel-home-support__button[aria-disabled="true"] {
	cursor: not-allowed;
	opacity: .55;
	box-shadow: none;
}

.panel-home-support__button[aria-busy="true"] { cursor: progress; }
.panel-home-support__button[aria-busy="true"] i { animation: phs-spin .9s linear infinite; }

.panel-home-support__content { padding: 22px 28px 28px; }

.panel-home-support__empty {
	display: flex;
	align-items: center;
	gap: 18px;
	min-height: 112px;
	padding: 20px 22px;
	background: var(--phs-soft);
	border: 1px solid var(--phs-border);
	border-radius: 15px;
}

.panel-home-support__empty-icon {
	width: 46px;
	height: 46px;
	border-radius: 14px;
	font-size: 18px;
}

.panel-home-support__empty-copy { min-width: 0; flex: 1 1 auto; }
.panel-home-support__empty-copy h3 { margin: 0; color: var(--phs-ink); font-size: 14px; font-weight: 700; line-height: 1.4; }
.panel-home-support__empty-copy p { margin: 5px 0 0; color: var(--phs-muted); font-size: 12px; line-height: 1.55; }

.panel-home-support__empty-action {
	flex: 0 0 auto;
	min-height: 40px;
	padding: 0 13px;
	color: var(--phs-accent-strong);
	background: var(--phs-surface);
	border-color: var(--phs-border);
}

.panel-home-support__empty-action:hover {
	color: #fff;
	background: var(--phs-accent);
	border-color: var(--phs-accent);
}

.panel-home-support__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.panel-home-ticket {
	min-width: 0;
	padding: 18px;
	background: var(--phs-surface);
	border: 1px solid var(--phs-border);
	border-radius: 15px;
	transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.panel-home-ticket:hover {
	border-color: rgba(112, 72, 232, .42);
	box-shadow: 0 8px 24px rgba(35, 24, 64, .075);
	transform: translateY(-2px);
}

.panel-home-ticket__top { justify-content: space-between; gap: 10px; }
.panel-home-ticket__mark { width: 38px; height: 38px; border-radius: 12px; font-size: 15px; }
.panel-home-ticket__status { display: inline-flex; align-items: center; min-height: 26px; padding: 0 10px; border-radius: 999px; font-size: 10px; font-weight: 700; line-height: 1.3; }
.panel-home-ticket__status.is-waiting { color: #956000; background: #fff4d8; }
.panel-home-ticket__status.is-replied { color: #13734e; background: #e3f6ed; }
.panel-home-ticket__status.is-closed { color: #696574; background: #eeedf1; }

.panel-home-ticket__title {
	margin: 15px 0 17px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

.panel-home-ticket__title a { color: var(--phs-ink); text-decoration: none; }
.panel-home-ticket__title a:hover { color: var(--phs-accent-strong); }

.panel-home-ticket__bottom {
	justify-content: space-between;
	gap: 12px;
	padding-top: 13px;
	border-top: 1px solid var(--phs-border);
}

.panel-home-ticket__bottom time {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-width: 0;
	color: var(--phs-muted);
	font-size: 11px;
	line-height: 1.4;
}

.panel-home-ticket__link { min-height: 34px; padding: 0 10px; color: var(--phs-accent-strong); background: var(--phs-soft); font-size: 11px; }
.panel-home-ticket__link:hover { color: #fff; background: var(--phs-accent); }

html.dark-mode .panel-home-support,
body.dark-mode .panel-home-support {
	--phs-ink: #f2eff9;
	--phs-muted: #aaa4b8;
	--phs-surface: #24212d;
	--phs-soft: #2d2938;
	--phs-border: #3c3748;
	--phs-shadow: 0 12px 34px rgba(0, 0, 0, .16);
}

html.dark-mode .panel-home-ticket__status.is-waiting,
body.dark-mode .panel-home-ticket__status.is-waiting { color: #f5cc78; background: #493a22; }
html.dark-mode .panel-home-ticket__status.is-replied,
body.dark-mode .panel-home-ticket__status.is-replied { color: #8de0ba; background: #203b32; }
html.dark-mode .panel-home-ticket__status.is-closed,
body.dark-mode .panel-home-ticket__status.is-closed { color: #c1bdcb; background: #3a3643; }

@keyframes phs-spin { to { transform: rotate(360deg); } }

@media (max-width: 767.98px) {
	.panel-home-support { margin-top: 20px !important; }
	.panel-home-support__surface { border-radius: 16px; }
	.panel-home-support__header { align-items: flex-start; flex-direction: column; gap: 17px; padding: 19px 17px; }
	.panel-home-support__heading { align-items: flex-start; gap: 12px; }
	.panel-home-support__icon { width: 42px; height: 42px; border-radius: 13px; font-size: 17px; }
	.panel-home-support__title { font-size: 18px; }
	.panel-home-support__subtitle { max-width: 34ch; font-size: 12px; }
	.panel-home-support__actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: 8px; }
	.panel-home-support__button { min-width: 0; min-height: 43px; padding: 0 9px; gap: 7px; font-size: 11px; white-space: nowrap; }
	.panel-home-support__content { padding: 15px 14px 17px; }
	.panel-home-support__empty { align-items: flex-start; flex-wrap: wrap; gap: 12px; padding: 16px; }
	.panel-home-support__empty-icon { width: 40px; height: 40px; border-radius: 12px; }
	.panel-home-support__empty-copy { flex: 1 1 calc(100% - 54px); padding-top: 1px; }
	.panel-home-support__empty-copy p { font-size: 11px; }
	.panel-home-support__empty-action { width: 100%; min-height: 42px; }
	.panel-home-support__grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.panel-home-ticket { padding: 15px; border-radius: 13px; }
	.panel-home-ticket__title { margin: 12px 0 14px; font-size: 13px; }
}

@media (max-width: 360px) {
	.panel-home-support__button { font-size: 10px; }
	.panel-home-support__button i { font-size: 10px; }
	.panel-home-ticket__bottom { align-items: flex-start; }
	.panel-home-ticket__bottom time { font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
	.panel-home-support *,
	.panel-home-support *::before,
	.panel-home-support *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}