export const authNoticeClass =
    'rounded-lg border border-[#d5ddca] bg-[#eef2e8] px-4 py-3 text-sm font-medium text-[#315f42]';

export const authLabelClass =
    'text-[11px] font-bold uppercase tracking-[0.18em] text-[#7d826f]';

export const authInputClass =
    'h-12 rounded-lg border-[#d9d2c3] bg-white px-4 text-sm font-medium text-[#394039] shadow-[0_10px_30px_rgba(30,35,28,0.05)] placeholder:text-[#a1a49a] focus-visible:border-[#adc2a0] focus-visible:ring-[#adc2a0]/30 read-only:bg-[#f4f0e8]';

export const authPrimaryButtonClass =
    'h-12 rounded-md bg-[#173f2c] px-5 text-sm font-bold text-[#f7f4ec] shadow-[0_12px_24px_rgba(23,63,44,0.14)] hover:bg-[#123322] hover:text-[#f7f4ec]';

export const authLinkClass =
    'font-semibold text-[#315f42] underline decoration-[#c5d0b9] underline-offset-4 transition-colors duration-200 hover:text-[#173f2c] hover:decoration-[#173f2c]';

export const authHelperTextClass =
    'text-sm leading-6 font-medium text-[#6a7164]';

export const authCheckboxClass =
    'size-4 rounded-[4px] border-[#cfd8c2] bg-white data-[state=checked]:border-[#173f2c] data-[state=checked]:bg-[#173f2c]';

export const authOtpSlotClass =
    'h-12 w-12 rounded-lg border border-[#d9d2c3] bg-white text-base font-semibold text-[#253129] shadow-[0_10px_24px_rgba(30,35,28,0.05)] first:rounded-lg first:border-s last:rounded-lg';