"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ButtonWrapper = exports.ButtonSection = exports.MiniButtonSection = exports.GradientSection = exports.Wrapper = exports.FloatButtonWrapper = void 0;
const styled_1 = __importDefault(require("@emotion/styled"));
const style_constants_1 = require("../../../constants/style.constants");
const Colors_1 = require("../../../core/Colors");
exports.FloatButtonWrapper = styled_1.default.div `
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	z-index: ${style_constants_1.zIndex.gnb};
`;
exports.Wrapper = styled_1.default.div `
	width: 100%;
	box-sizing: border-box;
	position: relative;
`;
exports.GradientSection = styled_1.default.div `
	width: 100%;
	height: 55px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.01) 0%, rgba(255, 255, 255, 1) 100%);
`;
exports.MiniButtonSection = styled_1.default.div `
	background-color: ${Colors_1.basicColors.white};
	width: 100%;
	height: 48px;
	display: flex;
	justify-content: center;
	position: relative;

	& > * {
		position: relative;
		top: -2px;
	}
`;
exports.ButtonSection = styled_1.default.div `
	background-color: ${Colors_1.basicColors.white};
	width: 100%;
	height: 65px;
`;
exports.ButtonWrapper = styled_1.default.div `
	width: 100%;
	display: flex;
	padding: 0 20px;
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translate(-50%, 0%);
`;
