/* Base Styles */

/* Layout tokens — shared by core + Pro (wide shells on XL; padding scales by breakpoint). */
:root {
	--ikbase-layout-shell-max: 1400px;
	--ikbase-layout-narrow-max: 1100px;
	--ikbase-layout-shell-pad-x: 20px;
	--ikbase-r12-container: 960px;
	--ikbase-r992-container: 720px;
	--ikbase-r768-container: 540px;
}

@media (min-width: 1440px) {
	:root {
		--ikbase-layout-shell-max: min(96vw, 1720px);
		--ikbase-layout-narrow-max: min(88vw, 1240px);
	}
}

@media (max-width: 1024px) {
	:root {
		--ikbase-layout-shell-pad-x: 16px;
	}
}

@media (max-width: 768px) {
	:root {
		--ikbase-layout-shell-pad-x: 15px;
	}
}

@media (max-width: 576px) {
	:root {
		--ikbase-layout-shell-pad-x: 10px;
	}
}

.ikbase-plugin {
    width: 100%;
    /* font-family: 'Poppins', sans-serif; */
}

/* Common Animations */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Common Elements */
.ikbase-centered-title {
    /* font-size: use --ikbase-h1-size from typography.css */
    margin-bottom: 20px;
    text-align: center;
    font-weight: 700;
    animation: fadeInDown 1s ease-in-out;
}

.ikbase-back-button {
    margin: 20px 0;
}

.ikbase-back-button a {
    display: inline-flex;
    align-items: center;
    color: #1e73be;
    text-decoration: none;
    font-weight: 500;
}

.ikbase-back-button a:hover {
    color: #0056b3;
}

.ikbase-breadcrumb {
    margin: 20px 0;
    padding: 10px 0;
}

.ikbase-breadcrumb a {
    color: #1e73be;
    text-decoration: none;
}

.ikbase-breadcrumb a:hover {
    color: #0056b3;
} 