/**
 * Image Block — Styles
 *
 * PHASE 4 — BLOCK SYSTEM (ATOMS ONLY). TOKEN-ONLY STYLING.
 *
 * Only radius and shadow tokens apply to a plain <img> atom — color
 * and typography tokens are not relevant to this block and are
 * correctly absent. No [data-atb-section="..."] selector appears
 * anywhere in this file.
 */

.atb-image {
	display: block;
	max-width: 100%;
	height: auto;
}

/* Object-fit (relevant when width/height are constrained by the
   caller's own wrapper — this block does not impose its own
   width/height, only fit behavior if one is later applied) */

.atb-image--fit-cover {
	object-fit: cover;
}

.atb-image--fit-contain {
	object-fit: contain;
}

/* Radius */

.atb-image--radius-none {
	border-radius: var(--atb-radius-none, 0);
}

.atb-image--radius-sm {
	border-radius: var(--atb-radius-sm, 0.25rem);
}

.atb-image--radius-md {
	border-radius: var(--atb-radius-md, 0.5rem);
}

.atb-image--radius-lg {
	border-radius: var(--atb-radius-lg, 0.75rem);
}

.atb-image--radius-xl {
	border-radius: var(--atb-radius-xl, 1rem);
}

.atb-image--radius-2xl {
	border-radius: var(--atb-radius-2xl, 1.5rem);
}

.atb-image--radius-full {
	border-radius: var(--atb-radius-full, 9999px);
}

/* Shadow */

.atb-image--shadow-none {
	box-shadow: var(--atb-shadow-none, none);
}

.atb-image--shadow-sm {
	box-shadow: var(--atb-shadow-sm, 0 1px 2px rgb(0 0 0 / 0.05));
}

.atb-image--shadow-md {
	box-shadow: var(--atb-shadow-md, 0 4px 6px rgb(0 0 0 / 0.1));
}

.atb-image--shadow-lg {
	box-shadow: var(--atb-shadow-lg, 0 10px 15px rgb(0 0 0 / 0.1));
}

.atb-image--shadow-xl {
	box-shadow: var(--atb-shadow-xl, 0 20px 25px rgb(0 0 0 / 0.1));
}