.service-purchase-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);z-index:1000}.service-purchase-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background-color:white;border-radius:8px;box-shadow:0 4px 20px rgba(0,0,0,.15);z-index:1001;width:90%;max-width:568px;max-height:90vh;overflow-y:auto;display:flex;flex-direction:column}.service-purchase-modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 32px;border-bottom:1px solid #d9d9d9;background-color:white;flex-shrink:0}.header-left{display:flex;gap:16px;align-items:center}.header-left svg{width:24px;height:24px;color:#000}.service-purchase-modal-title{font-family:Sora,sans-serif;font-size:16px;font-weight:700;color:#000;margin:0}.service-purchase-modal-close{background:none;border:none;cursor:pointer;padding:8px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:background-color .2s}.service-purchase-modal-close:hover{background-color:#f5f5f5}.service-purchase-modal-close svg{width:24px;height:24px;color:#666}.service-purchase-modal-body{display:flex;flex-direction:column;gap:16px;padding:32px;overflow-y:auto}.service-info-section{display:flex;gap:24px;align-items:flex-start;justify-content:space-between}.service-info-text{flex:1}.service-type{font-family:Sora,sans-serif;font-size:12px;font-weight:300;color:#999194;margin:0 0 4px}.service-name{font-family:Sora,sans-serif;font-size:20px;font-weight:700;color:#000;margin:0}.service-info-image{flex-shrink:0}.provider-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover}.selection-row{display:flex;gap:16px;width:100%}.selection-group{flex:1;display:flex;flex-direction:column;gap:8px}.selection-label{font-family:Sora,sans-serif;font-size:12px;font-weight:700;color:#000}.selection-input{border:1px solid #d9d9d9;border-radius:8px;font-size:14px;font-family:Sora,sans-serif;color:#999194;background-color:white;cursor:pointer;transition:border-color .2s;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;background-size:24px;padding:12px 40px 12px 16px}.selection-input:focus{outline:none;border-color:#58ad47}.price-section{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px dashed #d9d9d9}.price-label{font-size:14px;font-weight:400;color:#000}.price-label,.price-value{font-family:Sora,sans-serif}.price-value{font-size:16px;font-weight:700;color:#999194}.calendar-section{display:flex;flex-direction:column;gap:16px}.month-selector{justify-content:space-between;gap:12px;width:100%}.month-nav-btn,.month-selector{display:flex;align-items:center}.month-nav-btn{background-color:transparent;border:1px solid #d9d9d9;border-radius:8px;padding:8px 12px;font-size:18px;font-family:Sora,sans-serif;color:#000;cursor:pointer;transition:all .2s;justify-content:center;min-width:40px;height:40px;flex-shrink:0}.month-nav-btn:hover{border-color:#999194;background-color:#f9f9f9}.month-nav-btn:active{background-color:#efefef}.month-display{flex:1;text-align:center;font-size:14px;font-family:Sora,sans-serif;font-weight:600;color:#000;text-transform:capitalize}.calendar{display:flex;flex-direction:column;gap:8px;width:100%}.calendar-week-header{display:grid;grid-template-columns:repeat(7,1fr);gap:0;width:100%}.calendar-day-header{display:flex;align-items:center;justify-content:center;height:24px;font-family:Sora,sans-serif;font-size:10px;font-weight:700;color:#000}.calendar-days{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;width:100%}.calendar-day{display:flex;align-items:center;justify-content:center;height:40px;border:1px solid #d9d9d9;border-radius:16px;font-family:Sora,sans-serif;font-size:12px;font-weight:400;color:#d9d9d9;cursor:pointer;background-color:white;transition:all .2s}.calendar-day:not(.empty){color:#000}.calendar-day.empty{border:none;cursor:default;background-color:transparent}.calendar-day.selected{border-color:#000;color:#000;font-weight:700}.calendar-day:not(.empty):hover:not(:disabled){border-color:#999194;color:#999194}.calendar-day.disabled{color:#d9d9d9;cursor:not-allowed;background-color:#fafafa}.calendar-day.disabled:hover{border-color:#d9d9d9;color:#d9d9d9}.time-section{display:flex;flex-direction:column;gap:8px}.time-label{font-family:Sora,sans-serif;font-size:12px;font-weight:700;color:#000}.times-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}.time-box{padding:10px 8px;border:1px solid #d9d9d9;border-radius:6px;background:white;font-size:12px;font-weight:500;color:#333;font-family:Sora,sans-serif;cursor:pointer;transition:all .2s;text-align:center;white-space:nowrap}.time-box:hover{border-color:#999194;background-color:rgba(153,145,148,.05)}.time-box.selected{background-color:#000;color:white;border-color:#000;font-weight:700}.action-section{display:flex;gap:16px;align-items:flex-end;padding-top:16px;border-top:1px dashed #d9d9d9;margin-top:auto}.disclaimer{flex:1;font-family:Sora,sans-serif;font-size:10px;font-weight:400;color:#999194;line-height:1.4;margin:0}.btn-add-purchase{background-color:#58ad47;color:white;border:none;border-radius:8px;padding:12px 24px;font-size:12px;font-weight:700;font-family:Sora,sans-serif;cursor:pointer;transition:all .2s;white-space:nowrap}.btn-add-purchase:hover:not(:disabled){background-color:#4a9539}.btn-add-purchase:active:not(:disabled){opacity:.9}.btn-add-purchase:disabled{background-color:#cccccc;color:#666666;cursor:not-allowed;opacity:.6}.service-purchase-modal::-webkit-scrollbar{width:4px}.service-purchase-modal::-webkit-scrollbar-track{background:transparent}.service-purchase-modal::-webkit-scrollbar-thumb{background:#d9d9d9;border-radius:2px}.service-purchase-modal::-webkit-scrollbar-thumb:hover{background:#999194}@media (max-width:768px){.service-purchase-modal{width:95%;max-width:100%}.service-purchase-modal-header{padding:16px}.service-purchase-modal-body{padding:16px;gap:12px}.selection-row{flex-direction:column}.selection-group{width:100%}.times-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:6px}.time-box{padding:8px 6px;font-size:11px}.month-selector{gap:8px}.month-nav-btn{min-width:36px;height:36px;padding:6px 10px;font-size:16px}.month-display{font-size:13px}}