/**
 * ENRFO Dashboard — responsive behaviour.
 *
 * Desktop: expanded sidebar. Tablet: collapsible. Mobile: drawer navigation.
 */

@media (max-width: 1240px) {
	.enrfo-columns { grid-template-columns: minmax(0, 1fr); }
	.enrfo-content { padding: 22px 20px 36px; }
	.enrfo-header { padding: 10px 20px; }
	.enrfo-footer { padding: 14px 20px 22px; }
}

@media (max-width: 1080px) {
	.enrfo-search { flex-basis: 260px; }
	.enrfo-avatar-btn__name { display: none; }
	.enrfo-columns--even { grid-template-columns: minmax(0, 1fr); }
}

/*
 * Tablet and below: the sidebar leaves the layout and becomes a drawer that
 * slides in over the page. The breakpoint below must match the media query the
 * shell script uses to decide between drawer and collapse behaviour.
 */
@media (max-width: 1100px) {
	.enrfo-shell { grid-template-columns: minmax(0, 1fr); }

	.enrfo-sidebar {
		position: fixed; top: 0; left: 0; bottom: 0;
		width: 288px; max-width: 86vw;
		height: 100%;
		transform: translateX(-100%);
		visibility: hidden;
		transition: transform .26s cubic-bezier(.32, .72, 0, 1), visibility 0s linear .26s;
		box-shadow: 0 0 44px rgba(4, 22, 48, .3);
	}

	.enrfo-shell.is-sidebar-open .enrfo-sidebar {
		transform: translateX(0);
		visibility: visible;
		transition: transform .26s cubic-bezier(.32, .72, 0, 1), visibility 0s;
	}

	/* Collapsed-to-icons is a desktop idea; the drawer always shows labels. */
	.enrfo-shell[data-compact="true"] { --enrfo-sidebar-w: 288px; }
	.enrfo-shell[data-compact="true"] .enrfo-sidebar { width: 288px; }
	.enrfo-shell[data-compact="true"] .enrfo-nav__label,
	.enrfo-shell[data-compact="true"] .enrfo-nav__badge,
	.enrfo-shell[data-compact="true"] .enrfo-brand__text,
	.enrfo-shell[data-compact="true"] .enrfo-nav__toggle,
	.enrfo-shell[data-compact="true"] .enrfo-sidebar__foot { display: revert; }
	.enrfo-shell[data-compact="true"] .enrfo-nav__link { justify-content: flex-start; }
	.enrfo-shell[data-compact="true"] .enrfo-nav__heading { font-size: 11px; text-align: left; }
	.enrfo-shell[data-compact="true"] .enrfo-nav__heading::after { content: ""; }

	.enrfo-sidebar__close { display: inline-flex; }
}

@media (min-width: 1101px) {
	/* The scrim belongs to the drawer, and there is no drawer on desktop. */
	.enrfo-scrim { display: none !important; }
	.enrfo-sidebar__close { display: none; }
}

@media (max-width: 782px) {
	.enrfo-search { display: none; }
	.enrfo-welcome { padding: 20px; gap: 16px; }
	.enrfo-welcome h2 { font-size: 19px; }
	.enrfo-welcome__cta { width: 100%; }
	.enrfo-grid--stats { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
	.enrfo-header__title h1 { font-size: 17px; }
	.enrfo-chip span { display: none; }
	.enrfo-chip { padding: 0 9px; }
}

@media (max-width: 640px) {
	.enrfo-content { padding: 18px 14px 32px; }
	.enrfo-header { padding: 8px 14px; gap: 8px; }
	.enrfo-footer { padding: 14px; flex-direction: column; gap: 4px; }
	.enrfo-card--pad, .enrfo-card__pad { padding: 16px; }
	.enrfo-card__head { padding: 14px 16px; }

	.enrfo-grid--stats, .enrfo-grid--cards { grid-template-columns: minmax(0, 1fr); }
	.enrfo-form-grid { grid-template-columns: minmax(0, 1fr); }

	.enrfo-dropdown__panel { position: fixed; left: 10px; right: 10px; top: auto; min-width: 0; }
	.enrfo-dropdown__panel--wide { left: 10px; right: 10px; }

	.enrfo-notification { flex-wrap: wrap; }
	.enrfo-notification__actions { width: 100%; padding-left: 46px; }

	/* Tables become stacked cards. */
	.enrfo-table thead { display: none; }
	.enrfo-table, .enrfo-table tbody, .enrfo-table tr, .enrfo-table td { display: block; width: 100%; }
	.enrfo-table tr {
		margin: 0 12px 12px; padding: 6px 0;
		border: 1px solid var(--enrfo-border); border-radius: var(--enrfo-radius-sm);
		background: var(--enrfo-surface);
	}
	.enrfo-table td {
		display: flex; justify-content: space-between; gap: 14px;
		padding: 9px 14px; border-bottom: 1px dashed var(--enrfo-border);
		text-align: right;
	}
	.enrfo-table td:last-child { border-bottom: 0; }
	.enrfo-table td::before {
		content: attr(data-label);
		color: var(--enrfo-muted); font-size: 12px; font-weight: 700;
		text-transform: uppercase; letter-spacing: .04em; text-align: left;
	}
	.enrfo-table td[data-label=""]::before { content: ""; }
}

@media (prefers-reduced-motion: reduce) {
	.enrfo-sidebar, .enrfo-module-card, .enrfo-btn { transition: none; }
	.enrfo-skeleton, .enrfo-btn.is-loading::before { animation: none; }
}

@media print {
	.enrfo-sidebar, .enrfo-header, .enrfo-footer, .enrfo-scrim { display: none !important; }
	.enrfo-shell { grid-template-columns: minmax(0, 1fr); }
	.enrfo-card { box-shadow: none; }
}