/* ==========================================================================
   ACCESSTRADE MEGA MENU — nội dung dropdown Giải pháp & Ngành hàng
   Markup: template-parts/header/mega-menu-*.php
   Khung dropdown (vị trí, hover) nằm trong style.css.
   ========================================================================== */

@media (min-width: 850px) {
	.at-mm {
		--at-mm-accent: #E04F16;
		--at-mm-ink: #101828;
		--at-mm-muted: #667085;
		--at-mm-line: #EAECF0;
		--at-mm-side-bg: #FAFAF9;

		display: grid;
		grid-template-columns: minmax(0, 1fr) 300px;
		text-align: left;
		border-radius: 12px;
		overflow: hidden;
		background: #fff;
	}

	.at-mm a {
		text-decoration: none !important;
	}

	.at-mm ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	.at-mm li {
		margin: 0 !important;
	}

	.at-mm p {
		margin: 0;
	}

	/* --- Cột chính --- */
	.at-mm-main {
		padding: 28px 24px 24px 28px;
	}

	.at-mm--solutions .at-mm-main {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 0 20px;
	}

	.at-mm-col + .at-mm-col {
		border-left: 1px solid var(--at-mm-line);
		padding-left: 20px;
	}

	.at-mm-col-title {
		font-size: 12px;
		font-weight: 500;
		letter-spacing: 0.01em;
		color: #98A2B3;
		margin-bottom: 10px !important;
		padding-left: 10px;
		text-transform: none;
	}

	/* --- Link dạng danh sách (Giải pháp) --- */
	.at-mm-link,
	.at-mm-tile {
		display: block;
		padding: 9px 10px;
		border-radius: 8px;
		transition: background-color 0.15s ease;
	}

	.at-mm-link:hover,
	.at-mm-tile:hover {
		background: #F9FAFB;
	}

	.at-mm-link-title {
		display: flex;
		align-items: center;
		gap: 6px;
		font-size: 14.5px;
		font-weight: 600;
		line-height: 1.35;
		color: var(--at-mm-ink);
		transition: color 0.15s ease;
	}

	.at-mm-link-title::after {
		content: "";
		width: 6px;
		height: 6px;
		border-top: 1.5px solid currentColor;
		border-right: 1.5px solid currentColor;
		transform: rotate(45deg) translateX(-3px);
		opacity: 0;
		transition: opacity 0.15s ease, transform 0.15s ease;
	}

	.at-mm-link:hover .at-mm-link-title,
	.at-mm-tile:hover .at-mm-link-title {
		color: var(--at-mm-accent);
	}

	.at-mm-link:hover .at-mm-link-title::after,
	.at-mm-tile:hover .at-mm-link-title::after {
		opacity: 1;
		transform: rotate(45deg) translateX(0);
	}

	.at-mm-link-desc {
		display: block;
		margin-top: 2px;
		font-size: 13px;
		line-height: 1.45;
		color: var(--at-mm-muted);
	}

	/* --- Thẻ ngành (Ngành hàng) --- */
	.at-mm-main-head {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		margin-bottom: 4px;
	}

	.at-mm-all {
		font-size: 13px;
		font-weight: 500;
		color: var(--at-mm-muted) !important;
		padding-right: 10px;
	}

	.at-mm-all:hover {
		color: var(--at-mm-accent) !important;
	}

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

	.at-mm--industries .at-mm-main {
		display: flex;
		flex-direction: column;
	}

	.at-mm-tile {
		display: flex;
		align-items: flex-start;
		gap: 12px;
		padding: 14px 10px;
	}

	.at-mm-main-foot {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		margin-top: auto;
		padding: 14px 0 0 10px;
		border-top: 1px solid var(--at-mm-line);
		font-size: 13px;
		color: var(--at-mm-muted);
	}

	.at-mm--industries .at-mm-grid {
		margin-bottom: 16px;
	}

	.at-mm-tile-icon {
		flex-shrink: 0;
		display: flex;
		margin-top: 1px;
		color: #98A2B3;
		transition: color 0.15s ease;
	}

	.at-mm-tile:hover .at-mm-tile-icon {
		color: var(--at-mm-accent);
	}

	.at-mm-tile-body {
		min-width: 0;
	}

	/* --- Cột phụ bên phải --- */
	.at-mm-side {
		display: flex;
		flex-direction: column;
		padding: 28px 24px 24px;
		background: var(--at-mm-side-bg);
		border-left: 1px solid var(--at-mm-line);
	}

	.at-mm-side .at-mm-col-title {
		padding-left: 0;
		margin-bottom: 4px !important;
	}

	.at-mm-side-note {
		font-size: 13px;
		line-height: 1.45;
		color: var(--at-mm-muted);
		margin-bottom: 10px !important;
	}

	/* Case study nổi bật */
	.at-mm-case {
		display: block;
		color: var(--at-mm-ink) !important;
	}

	.at-mm-eyebrow {
		display: block;
		font-size: 12px;
		font-weight: 600;
		color: var(--at-mm-accent);
		margin-bottom: 6px;
	}

	.at-mm-case-title {
		display: block;
		font-size: 16px;
		font-weight: 600;
		line-height: 1.4;
		letter-spacing: -0.01em;
	}

	.at-mm-stats {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 12px;
		margin: 16px 0 14px;
		padding-top: 14px;
		border-top: 1px solid var(--at-mm-line);
	}

	.at-mm-stat {
		font-size: 12px;
		line-height: 1.4;
		color: var(--at-mm-muted);
	}

	.at-mm-stat strong {
		display: block;
		font-size: 20px;
		font-weight: 700;
		line-height: 1.2;
		letter-spacing: -0.02em;
		color: var(--at-mm-ink);
		margin-bottom: 2px;
	}

	.at-mm-more {
		font-size: 13px;
		font-weight: 600;
		color: var(--at-mm-ink);
		border-bottom: 1px solid currentColor;
		padding-bottom: 1px;
		transition: color 0.15s ease;
	}

	.at-mm-case:hover .at-mm-more,
	.at-mm-case:hover .at-mm-case-title {
		color: var(--at-mm-accent);
	}

	/* Danh sách ngành chưa có trang riêng */
	.at-mm-other {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 8px 0;
		font-size: 14px;
		font-weight: 500;
		color: #344054 !important;
		border-bottom: 1px dashed var(--at-mm-line);
		transition: color 0.15s ease;
	}

	.at-mm-others li:last-child .at-mm-other {
		border-bottom: 0;
	}

	.at-mm-other::after {
		content: "Tư vấn";
		font-size: 12px;
		font-weight: 500;
		color: #98A2B3;
		transition: color 0.15s ease;
	}

	.at-mm-other:hover,
	.at-mm-other:hover::after {
		color: var(--at-mm-accent) !important;
	}

	/* CTA cuối cột phụ */
	.at-mm-cta {
		margin-top: auto;
		padding-top: 18px;
	}

	.at-mm-cta p {
		font-size: 13px;
		color: var(--at-mm-muted);
		margin-bottom: 8px !important;
	}

	.at-mm-cta-btn {
		display: block;
		text-align: center;
		padding: 10px 14px;
		border-radius: 8px;
		background: var(--at-mm-ink);
		color: #fff !important;
		font-size: 13.5px;
		font-weight: 600;
		transition: background-color 0.15s ease;
	}

	.at-mm-cta-btn:hover {
		background: var(--at-mm-accent);
	}
}

/* Laptop nhỏ / tablet ngang: thu hẹp cột phụ để 3 cột giải pháp không bị chật */
@media (min-width: 850px) and (max-width: 1099px) {
	.at-mm {
		grid-template-columns: minmax(0, 1fr) 240px;
	}

	.at-mm-main {
		padding: 22px 16px 18px 18px;
	}

	.at-mm--solutions .at-mm-main {
		gap: 0 12px;
	}

	.at-mm-col + .at-mm-col {
		padding-left: 12px;
	}

	.at-mm-side {
		padding: 22px 18px 18px;
	}

	.at-mm-link-title {
		font-size: 14px;
	}

	/* Tên giải pháp dài, tự đủ nghĩa: ẩn mô tả và nới cột cho đỡ chật */
	.at-mm--solutions {
		grid-template-columns: minmax(0, 1fr) 220px;
	}

	.at-mm--solutions .at-mm-link-desc {
		display: none;
	}
}
