@charset "utf-8";

:root { --primary-blue: #3b82f6; --primary-green: #22c55e; --dark-text: #1f2937; --white: #ffffff; }

html { scroll-behavior: smooth; }

body { font-family: Inter, sans-serif; background-color: rgb(243, 244, 246); color: var(--dark-text); overflow-x: hidden; overflow-y: auto; }

body::before { content: ""; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: -1; background-image: url("https://images.pexels.com/photos/3938022/pexels-photo-3938022.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2"); background-size: cover; background-position: center center; opacity: 0.1; }

h1, h2 { font-family: Poppins, sans-serif; }

.card { background-color: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); border: 1px solid rgba(229, 231, 235, 0.8); box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 30px -15px; }

.radio-button-group label { cursor: pointer; padding: 0.75rem 1rem; border: 1px solid rgb(209, 213, 219); border-radius: 0.5rem; transition: 0.2s ease-in-out; text-align: center; background-color: var(--white); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.3rem; min-height: 70px; }

.radio-button-group input[type="radio"]:checked + label { background-color: var(--primary-blue); color: var(--white); border-color: rgb(37, 99, 235); box-shadow: rgba(59, 130, 246, 0.4) 0px 4px 12px -2px; transform: translateY(-2px); }

.radio-button-group input[type="radio"]:checked + label svg { fill: var(--white); }

.radio-button-group input[type="radio"] { display: none; }

.syringe-icon { width: 24px; height: 24px; fill: rgb(107, 114, 128); transition: fill 0.2s ease-in-out; }

.hidden-input { display: none; margin-top: 0.75rem; }

.visible-input { display: block; }

.syringe-progress-bar { background-color: rgb(229, 231, 235); border-radius: 0.5rem; overflow: hidden; height: 2.5rem; border: 2px solid rgb(156, 163, 175); position: relative; box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 4px 0px inset; }

.syringe-progress-fill { background: linear-gradient(to right, rgb(96, 165, 250), rgb(59, 130, 246)); height: 100%; transition: width 0.5s ease-in-out; display: flex; align-items: center; justify-content: center; color: white; font-weight: 700; font-size: 0.875rem; white-space: nowrap; }

.lang-btn { position: absolute; top: 1rem; right: 1rem; z-index: 10; background-color: rgba(255, 255, 255, 0.9); border: 1px solid rgb(221, 227, 234); padding: 6px 12px; border-radius: 8px; font-weight: 500; cursor: pointer; box-shadow: rgba(26, 42, 76, 0.1) 0px 2px 10px -3px; font-size: 0.875rem; }
@charset "utf-8";

html { scroll-behavior: smooth; }

body { font-family: sans-serif; margin: 0px; overflow-x: hidden; overflow-y: auto; }

@keyframes fade-in { 
  0% { opacity: 0; transform: translateY(-10px); }
  100% { opacity: 1; transform: translateY(0px); }
}

.animate-fade-in { animation: 0.3s ease-out 0s 1 normal forwards running fade-in; }

.pdf-preview-container { font-family: Arial, sans-serif; color: rgb(51, 51, 51); }

.pdf-header { display: flex; justify-content: space-between; align-items: flex-start; padding-bottom: 1rem; border-bottom: 2px solid rgb(0, 174, 240); margin-bottom: 1.5rem; }

.pdf-logo-container { display: flex; align-items: center; }

.pdf-logo { height: 50px; margin-right: 1rem; }

.pdf-clinic-info h1 { font-size: 24px; font-weight: bold; color: rgb(26, 42, 76); margin: 0px; }

.pdf-clinic-info p { font-size: 12px; color: rgb(85, 85, 85); margin: 0px; }

.pdf-client-info { text-align: right; font-size: 11px; line-height: 1.6; }

.pdf-client-info span { font-weight: bold; color: rgb(26, 42, 76); }

.pdf-table { width: 100%; border-collapse: collapse; font-size: 10px; }

.pdf-table th, .pdf-table td { padding: 8px 10px; border: 1px solid rgb(226, 232, 240); text-align: left; }

.pdf-table th { background-color: rgb(241, 245, 249); font-weight: bold; color: rgb(26, 42, 76); text-transform: uppercase; font-size: 9px; }

.pdf-table tbody tr:nth-child(2n) { background-color: rgb(248, 250, 252); }

.pdf-table .text-center { text-align: center; }

.pdf-table .font-bold { font-weight: bold; }

.pdf-table .text-cyan-700 { color: rgb(14, 116, 144); }

.pdf-note-row td { padding: 10px; background-color: rgb(240, 249, 255) !important; }

.pdf-note-content { font-style: italic; color: rgb(3, 105, 161); white-space: pre-wrap; }

.pdf-footer { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid rgb(203, 213, 225); text-align: center; font-size: 10px; color: rgb(100, 116, 139); }