@aaravpos/appointment-barber-booking 1.0.5 → 1.0.8

package/dist/styles.css

@@ -798,11 +798,11 @@
 .success-pulse {
   animation: pulseBrand 2s ease infinite;
 }
-.arravpos-error-box {
+.aaravpos-barber-error-box {
   padding: 16px;
   color: #ef4444;
 }
-.arravpos-m0 {
+.aaravpos-barber-m0 {
   margin: 0px !important;
 }
 .aaravpos-barber-overflow-hidden {
@@ -820,7 +820,7 @@
   opacity: 0.5;
   pointer-events: none;
 }
-.arravpos-container {
+.aaravpos-barber-container {
   background-color: #fff;
   padding: 16px;
   width: 100%;
@@ -837,6 +837,10 @@
 .aaravpos-barber-mt-auto {
   margin-top: auto;
 }
+.aaravpos-barber-btn-position-relative {
+  position: relative !important;
+  bottom: auto !important;
+}
 .aaravpos-barber-btn {
   gap: 8px;
   padding: 8px 16px;
@@ -889,6 +893,36 @@
 .aaravpos-barber-padding-btn {
   padding: 9px 8px !important;
 }
+.aaravpos-barber-cart-btn {
+  position: absolute;
+  left: -36px;
+  padding: 9px;
+  top: 0px;
+  background: var(--btn-bg);
+  color: var(--btn-text, #ffffff);
+  border: 0px;
+  outline: none;
+  border-top-left-radius: 8px;
+  border-bottom-left-radius: 8px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.aaravpos-barber-count {
+  position: absolute;
+  top: -5px;
+  left: -14px;
+  background: var(--btn-bg, #000);
+  color: var(--btn-text, #fff);
+  border-radius: 50%;
+  height: 22px;
+  width: 22px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 12px;
+}
 .aaravpos-barber-layout {
   height: 700px;
   display: flex;
@@ -948,7 +982,6 @@
   background: var(--surface-bg, #ffffff);
   border: 1px solid rgba(0, 0, 0, 0.1);
   padding: 16px 16px 14px;
-  overflow: hidden;
   position: fixed;
   top: 10px;
   right: 10px;
@@ -967,7 +1000,7 @@
 .aaravpos-barber-sidebar-mobile {
   position: fixed;
   inset: 0;
-  z-index: 9999;
+  z-index: 999;
   background: #fff;
   display: flex;
   flex-direction: column;
@@ -1842,7 +1875,7 @@
   transition: all 0.2s ease;
   border-radius: 6px;
 }
-.aaravpos-barber-common-btn:hover {
+.aaravpos-barber-common-btn:hover, .aaravpos-barber-cart-btn:hover {
   background: var(--btn-bg-hover);
   color: var(--btn-text-hover, #ffffff);
 }
@@ -1988,7 +2021,7 @@
   margin-bottom: 8px;
 }
 .aaravpos-barber-tip-btn {
-  padding: 6px 8px;
+  padding: 5px 6px;
   border: 1px solid var(--btn-bg-hover);
   border-radius: 4px;
   background: #fff;
@@ -2204,13 +2237,13 @@
   position: relative;
   z-index: 2;
 }
-.arravpos-date-card-disabled {
+.aaravpos-barber-date-card-disabled {
   position: relative;
   opacity: 0.6;
   cursor: not-allowed;
   overflow: hidden;
 }
-.arravpos-date-disabled-slash {
+.aaravpos-barber-date-disabled-slash {
   position: absolute;
   top: 50%;
   left: -20%;
@@ -2220,7 +2253,7 @@
   transform: rotate(-45deg);
   z-index: 1;
 }
-.arravpos-date-unavailable {
+.aaravpos-barber-date-unavailable {
   font-size: 8px;
   font-weight: 700;
   margin-top: 2px;
@@ -2293,29 +2326,29 @@
   line-height: 1.5;
   color: rgba(0, 0, 0, 0.5);
 }
-.arravpos-details-section {
+.aaravpos-barber-details-section {
   margin-top: 20px;
 }
-.arravpos-details-scroll {
+.aaravpos-barber-details-scroll {
   overflow-y: auto;
   padding-bottom: 30px;
   scrollbar-width: none;
   height: 565px;
 }
-.arravpos-details-scroll::-webkit-scrollbar {
+.aaravpos-barber-details-scroll::-webkit-scrollbar {
   display: none;
 }
-.arravpos-details-grid {
+.aaravpos-barber-details-grid {
   display: grid;
   grid-template-columns: 1fr;
   gap: 16px;
 }
-.arravpos-form-group {
+.aaravpos-barber-form-group {
   display: flex;
   flex-direction: column;
   width: 100%;
 }
-.arravpos-form-label {
+.aaravpos-barber-form-label {
   font-size: 12px;
   font-weight: 600;
   color: #4b5563;
@@ -2324,14 +2357,14 @@
   align-items: center;
   gap: 4px;
 }
-.arravpos-required {
+.aaravpos-barber-required {
   color: #ef4444;
 }
-.arravpos-input-wrapper {
+.aaravpos-barber-input-wrapper {
   position: relative;
   width: 100%;
 }
-.arravpos-custom-input {
+.aaravpos-barber-custom-input {
   border: 1px solid #d1d5db;
   border-radius: 4px;
   padding: 10px 12px;
@@ -2340,15 +2373,15 @@
   transition: all 0.3s ease;
   background-color: #ffffff;
 }
-.arravpos-custom-input:focus, .arravpos-custom-input input:focus {
+.aaravpos-barber-custom-input:focus, .aaravpos-barber-custom-input input:focus {
   border-color: black;
 }
-.arravpos-error-text {
+.aaravpos-barber-error-text {
   margin-top: 6px;
   font-size: 13px;
   color: #ef4444;
 }
-.arravpos-autofill-text {
+.aaravpos-barber-autofill-text {
   margin-top: 6px;
   font-size: 12px;
   color: #6b7280;
@@ -2356,31 +2389,31 @@
   align-items: center;
   gap: 4px;
 }
-.arravpos-clear-text {
+.aaravpos-barber-clear-text {
   color: #dc2626;
   cursor: pointer;
   font-weight: 500;
 }
-.arravpos-loader-wrapper {
+.aaravpos-barber-loader-wrapper {
   position: absolute;
   right: 10px;
   top: 50%;
   transform: translateY(-50%);
   z-index: 999;
 }
-.arravpos-loader {
+.aaravpos-barber-loader {
   width: 16px;
   height: 16px;
   border: 2px solid #d1d5db;
   border-top-color: #000000;
   border-radius: 50%;
-  animation: arravpos-spin 0.8s linear infinite;
+  animation: aaravpos-barber-spin 0.8s linear infinite;
 }
-.arravpos-booking-wrapper {
+.aaravpos-barber-booking-wrapper {
   width: 100%;
   max-width: 100%;
 }
-.arravpos-outlet-info {
+.aaravpos-barber-outlet-info {
   display: flex;
   align-items: center;
   gap: 12px;
@@ -2389,7 +2422,7 @@
   margin-bottom: 4px;
   border: 1px solid #e5e7eb;
 }
-.arravpos-outlet-logo {
+.aaravpos-barber-outlet-logo {
   width: 40px;
   height: 40px;
   border-radius: 4px;
@@ -2399,63 +2432,63 @@
   align-items: center;
   justify-content: center;
 }
-.arravpos-outlet-logo-img {
+.aaravpos-barber-outlet-logo-img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }
-.arravpos-outlet-content {
+.aaravpos-barber-outlet-content {
   flex: 1;
   min-width: 0;
 }
-.arravpos-outlet-name {
+.aaravpos-barber-outlet-name {
   font-size: 14px;
   font-weight: 600;
   color: #111827;
   margin: 0;
   line-height: 1.4;
 }
-.arravpos-outlet-address {
+.aaravpos-barber-outlet-address {
   font-size: 12px;
   color: rgba(0, 0, 0, 0.7);
   margin-top: 2px;
   line-height: 1.5;
   word-break: break-word;
 }
-.arravpos-booking-scroll {
+.aaravpos-barber-booking-scroll {
   overflow-y: auto;
   scrollbar-width: none;
   height: 495px;
   padding-bottom: 15px;
 }
-.arravpos-booking-scroll::-webkit-scrollbar {
+.aaravpos-barber-booking-scroll::-webkit-scrollbar {
   display: none;
 }
-.arravpos-booking-grid {
+.aaravpos-barber-booking-grid {
   display: flex;
   gap: 28px;
   justify-content: space-between;
 }
-.arravpos-booking-column {
+.aaravpos-barber-booking-column {
   width: 100%;
   min-width: 0;
 }
-.arravpos-appointment-header {
+.aaravpos-barber-appointment-header {
   display: flex;
   align-items: center;
   gap: 12px;
 }
-.arravpos-appointment-content {
+.aaravpos-barber-appointment-content {
   flex: 1;
   min-width: 0;
 }
-.arravpos-appointment-name {
+.aaravpos-barber-appointment-name {
   font-size: 14px;
   font-weight: 600;
   color: #111827;
   margin: 0;
 }
-.arravpos-appointment-services {
+.aaravpos-barber-appointment-services {
   font-size: 12px;
   color: #6b7280;
   margin-top: 2px;
@@ -2464,7 +2497,7 @@
   white-space: nowrap;
   margin-bottom: 0px;
 }
-.arravpos-appointment-price {
+.aaravpos-barber-appointment-price {
   font-family: monospace;
   font-weight: 600;
   font-size: 15px;
@@ -2474,7 +2507,7 @@
   display: flex;
   flex-direction: row;
 }
-.arravpos-appointment-date {
+.aaravpos-barber-appointment-date {
   display: flex;
   align-items: center;
   gap: 8px;
@@ -2482,20 +2515,20 @@
   padding-top: 12px;
   border-top: 1px solid #e5e7eb;
 }
-.arravpos-appointment-date-text {
+.aaravpos-barber-appointment-date-text {
   font-size: 14px;
   font-weight: 600;
   color: #111827;
 }
-.arravpos-success-wrapper {
+.aaravpos-barber-success-wrapper {
   overflow-y: auto;
   scrollbar-width: none;
   height: 700px;
 }
-.arravpos-success-wrapper::-webkit-scrollbar {
+.aaravpos-barber-success-wrapper::-webkit-scrollbar {
   display: none;
 }
-.arravpos-success-motion {
+.aaravpos-barber-success-motion {
   display: flex;
   flex-direction: column;
   height: 668px;
@@ -2505,7 +2538,7 @@
   text-align: center;
   padding: 16px;
 }
-.arravpos-success-icon {
+.aaravpos-barber-success-icon {
   width: 34px;
   height: 34px;
   background: var(--btn-bg);
@@ -2518,23 +2551,23 @@
   font-size: 36px;
   margin-bottom: 24px;
 }
-.arravpos-success-title {
+.aaravpos-barber-success-title {
   font-family: "Bebas Neue", sans-serif;
   font-size: 20px;
   margin-bottom: 8px;
 }
-.arravpos-success-description {
+.aaravpos-barber-success-description {
   font-size: 14px;
   color: var(--muted);
   margin-bottom: 10px;
   line-height: 1.625;
   margin-top: 0px;
 }
-.arravpos-success-content {
+.aaravpos-barber-success-content {
   width: 100%;
   max-width: 570px;
 }
-.arravpos-success-card {
+.aaravpos-barber-success-card {
   background: #ffffff;
   border-radius: 6px;
   text-align: left;
@@ -2546,55 +2579,55 @@
   scrollbar-width: none;
   -ms-overflow-style: none;
 }
-.arravpos-success-row {
+.aaravpos-barber-success-row {
   display: flex;
   justify-content: space-between;
   padding-top: 8px;
   padding-bottom: 8px;
   border-bottom: 1px solid #f3f4f6;
 }
-.arravpos-success-row-first {
+.aaravpos-barber-success-row-first {
   padding-top: 0;
 }
-.arravpos-total-row {
+.aaravpos-barber-total-row {
   display: flex;
   justify-content: space-between;
   padding-top: 16px;
   padding-bottom: 0;
 }
-.arravpos-label {
+.aaravpos-barber-label {
   color: #4b5563;
   font-size: 14px;
   font-weight: 700;
 }
-.arravpos-services-label {
+.aaravpos-barber-services-label {
   color: #6b7280;
   font-size: 14px;
   font-weight: 700;
 }
-.arravpos-value {
+.aaravpos-barber-value {
   font-size: 14px;
   font-weight: 500;
   color: #1f2937;
 }
-.arravpos-price {
+.aaravpos-barber-price {
   display: flex;
   flex-direction: row;
   align-items: center;
   color: #1f2937;
   font-weight: 600;
 }
-.arravpos-total-price {
+.aaravpos-barber-total-price {
   display: flex;
   flex-direction: row;
   align-items: center;
   color: var(--red);
   font-weight: 600;
 }
-.arravpos-services-header {
+.aaravpos-barber-services-header {
   align-items: center;
 }
-.arravpos-services-list {
+.aaravpos-barber-services-list {
   padding-top: 8px;
   padding-bottom: 8px;
   border-bottom: 1px solid #f3f4f6;
@@ -2605,23 +2638,23 @@
   overflow-y: auto;
   max-height: 23vh;
 }
-.arravpos-service-row {
+.aaravpos-barber-service-row {
   display: flex;
   justify-content: space-between;
   font-size: 14px;
   padding-top: 6px;
   padding-bottom: 6px;
 }
-.arravpos-service-name {
+.aaravpos-barber-service-name {
   color: #374151;
 }
-.arravpos-service-price {
+.aaravpos-barber-service-price {
   color: #111827;
   display: flex;
   flex-direction: row;
   align-items: center;
 }
-.arravpos-more-services {
+.aaravpos-barber-more-services {
   text-align: center;
   font-size: 12px;
   color: #6b7280;
@@ -2632,7 +2665,7 @@
   justify-content: center;
   gap: 4px;
 }
-.arravpos-show-btn {
+.aaravpos-barber-show-btn {
   color: #2563eb;
   font-size: 12px;
   font-weight: 500;
@@ -2640,13 +2673,13 @@
   background: transparent;
   border: none;
 }
-.arravpos-show-btn-inner {
+.aaravpos-barber-show-btn-inner {
   display: flex;
   flex-direction: row;
   align-items: center;
   gap: 4px;
 }
-.arravpos-book-btn {
+.aaravpos-barber-book-btn {
   background: var(--btn-bg);
   color: var(--btn-text);
   border: 1px solid var(--btn-bg);
@@ -2664,12 +2697,12 @@
   border-radius: 4px;
   transition: all 0.3s ease;
 }
-.arravpos-book-btn:hover {
+.aaravpos-barber-book-btn:hover {
   color: var(--btn-text-hover);
   border-color: var(--btn-bg-hover);
   background: var(--btn-bg-hover);
 }
-.arravpos-payment-overlay {
+.aaravpos-barber-payment-overlay {
   position: fixed;
   inset: 0;
   display: flex;
@@ -2679,7 +2712,7 @@
   z-index: 1025;
   padding: 16px;
 }
-.arravpos-payment-form {
+.aaravpos-barber-payment-form {
   width: 100%;
   margin: auto;
   display: flex;
@@ -2695,40 +2728,40 @@
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
   box-sizing: border-box;
 }
-.arravpos-payment-header {
+.aaravpos-barber-payment-header {
   display: flex;
   justify-content: space-between;
   margin-bottom: 20px;
 }
-.arravpos-payment-title {
+.aaravpos-barber-payment-title {
   font-size: 18px;
   font-weight: 600;
   color: #111827;
   margin: 0px;
 }
-.arravpos-payment-amount {
+.aaravpos-barber-payment-amount {
   display: flex;
   flex-direction: row;
   align-items: center;
   font-weight: 600;
   color: #111827;
 }
-.arravpos-payment-fields {
+.aaravpos-barber-payment-fields {
   display: flex;
   flex-direction: column;
   gap: 16px;
 }
-.arravpos-payment-label {
+.aaravpos-barber-payment-label {
   font-size: 12px;
   font-weight: 600;
   color: #4b5563;
   display: flex;
   margin-bottom: 4px;
 }
-.arravpos-payment-required {
+.aaravpos-barber-payment-required {
   color: #ef4444;
 }
-.arravpos-payment-input {
+.aaravpos-barber-payment-input {
   width: 100%;
   padding: 10px 12px;
   border: 1px solid red;
@@ -2737,26 +2770,26 @@
   outline: none;
   transition: border-color 0.2s ease;
 }
-.arravpos-payment-input:focus {
+.aaravpos-barber-payment-input:focus {
   border-color: var(--red);
 }
-.arravpos-payment-error {
+.aaravpos-barber-payment-error {
   color: #ef4444;
   font-size: 14px;
   margin-top: 4px;
 }
-.arravpos-payment-grid {
+.aaravpos-barber-payment-grid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 16px;
 }
-.arravpos-payment-btn-grid {
+.aaravpos-barber-payment-btn-grid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 16px;
   margin-top: 20px;
 }
-.arravpos-payment-cancel-btn {
+.aaravpos-barber-payment-cancel-btn {
   padding: 10px 16px;
   cursor: pointer;
   border-radius: 6px;
@@ -2764,7 +2797,7 @@
   background: linear-gradient(to right, #ef4444, #dc2626);
   color: #ffffff;
 }
-.arravpos-payment-submit-btn {
+.aaravpos-barber-payment-submit-btn {
   padding: 8px 16px;
   border-radius: 6px;
   cursor: pointer;
@@ -2773,11 +2806,11 @@
   color: #ffffff;
   transition: opacity 0.2s ease;
 }
-.arravpos-payment-submit-btn:disabled {
+.aaravpos-barber-payment-submit-btn:disabled {
   opacity: 0.5;
   cursor: not-allowed;
 }
-.arravpos-consent-overlay {
+.aaravpos-barber-consent-overlay {
   position: fixed;
   inset: 0;
   z-index: 1025;
@@ -2787,12 +2820,12 @@
   background-color: rgba(0, 0, 0, 0.4);
   padding: 16px;
 }
-.arravpos-consent-backdrop {
+.aaravpos-barber-consent-backdrop {
   position: fixed;
   inset: 0;
   background-color: rgba(0, 0, 0, 0.6);
 }
-.arravpos-consent-modal {
+.aaravpos-barber-consent-modal {
   position: relative;
   z-index: 10;
   width: 90%;
@@ -2802,50 +2835,50 @@
   border-radius: 12px;
   padding: 16px;
 }
-.arravpos-consent-header {
+.aaravpos-barber-consent-header {
   display: flex;
   justify-content: space-between;
   margin-bottom: 10px;
 }
-.arravpos-consent-title {
+.aaravpos-barber-consent-title {
   font-size: 16px;
   font-weight: 600;
   color: #111827;
   margin: 0px;
 }
-.arravpos-consent-close-btn {
+.aaravpos-barber-consent-close-btn {
   color: #9ca3af;
   cursor: pointer;
   border: none;
   background: transparent;
   transition: color 0.2s ease;
 }
-.arravpos-consent-close-btn:hover {
+.aaravpos-barber-consent-close-btn:hover {
   color: #4b5563;
 }
-.arravpos-consent-content-wrapper {
+.aaravpos-barber-consent-content-wrapper {
   max-height: 42vh;
 }
-.arravpos-consent-content-box {
+.aaravpos-barber-consent-content-box {
   border: 1px solid #e5e7eb;
   border-radius: 6px;
   padding: 16px;
   background-color: #f9fafb;
 }
-.arravpos-consent-content {
+.aaravpos-barber-consent-content {
   color: #374151;
   white-space: pre-wrap;
   overflow-y: auto;
   max-height: 30vh;
 }
-.arravpos-consent-checkbox-label {
+.aaravpos-barber-consent-checkbox-label {
   display: flex;
   gap: 8px;
   align-items: center;
   margin-top: 12px;
   border-color: #e5e7eb;
 }
-.arravpos-consent-checkbox {
+.aaravpos-barber-consent-checkbox {
   width: 18px;
   height: 18px;
   color: #ef4444;
@@ -2853,49 +2886,49 @@
   border: 1px solid #d1d5db;
   border-radius: 4px;
 }
-.arravpos-consent-checkbox-text {
+.aaravpos-barber-consent-checkbox-text {
   font-size: 14px;
   font-weight: 500;
   color: #374151;
 }
-.arravpos-consent-typed-wrapper {
+.aaravpos-barber-consent-typed-wrapper {
   margin-top: 16px;
 }
-.arravpos-consent-input-label {
+.aaravpos-barber-consent-input-label {
   display: block;
   margin-bottom: 8px;
   font-size: 14px;
   font-weight: 500;
   color: #374151;
 }
-.arravpos-consent-required {
+.aaravpos-barber-consent-required {
   color: #ef4444;
 }
-.arravpos-consent-input {
+.aaravpos-barber-consent-input {
   width: 100%;
   padding: 8px 12px;
   border-radius: 6px;
   outline: none;
 }
-.arravpos-consent-input-normal {
+.aaravpos-barber-consent-input-normal {
   border: 1px solid #d1d5db;
 }
-.arravpos-consent-input-error {
+.aaravpos-barber-consent-input-error {
   border: 1px solid #ef4444;
 }
-.arravpos-consent-helper-text {
+.aaravpos-barber-consent-helper-text {
   margin-top: 4px;
   font-size: 12px;
   color: #6b7280;
 }
-.arravpos-consent-error {
+.aaravpos-barber-consent-error {
   font-size: 14px;
   color: #ef4444;
 }
-.arravpos-consent-signature-wrapper {
+.aaravpos-barber-consent-signature-wrapper {
   margin-top: 16px;
 }
-.arravpos-consent-signature-canvas {
+.aaravpos-barber-consent-signature-canvas {
   width: 100%;
   height: 136px;
   overflow: hidden;
@@ -2903,16 +2936,16 @@
   border-radius: 6px;
   background-color: #ffffff;
 }
-.arravpos-consent-error-signature {
+.aaravpos-barber-consent-error-signature {
   margin-top: 4px;
   margin-bottom: 4px;
 }
-.arravpos-consent-signature-actions {
+.aaravpos-barber-consent-signature-actions {
   display: flex;
   justify-content: space-between;
   margin-top: 8px;
 }
-.arravpos-consent-clear-btn {
+.aaravpos-barber-consent-clear-btn {
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -2925,17 +2958,17 @@
   border-radius: 6px;
   background: transparent;
 }
-.arravpos-consent-clear-btn:hover {
+.aaravpos-barber-consent-clear-btn:hover {
   color: #1f2937;
 }
-.arravpos-consent-email-label {
+.aaravpos-barber-consent-email-label {
   display: flex;
   gap: 8px;
   align-items: center;
   cursor: pointer;
   font-size: 14px;
 }
-.arravpos-consent-email-checkbox {
+.aaravpos-barber-consent-email-checkbox {
   width: 16px;
   height: 16px;
   accent-color: var(--btn-bg);
@@ -2943,17 +2976,17 @@
   border: 1px solid #d1d5db;
   border-radius: 4px;
 }
-.arravpos-consent-email-text {
+.aaravpos-barber-consent-email-text {
   font-size: 14px;
   color: #374151;
 }
-.arravpos-consent-footer {
+.aaravpos-barber-consent-footer {
   display: flex;
   justify-content: flex-end;
   gap: 12px;
   margin-top: 20px;
 }
-.arravpos-consent-cancel-btn {
+.aaravpos-barber-consent-cancel-btn {
   padding: 8px 16px;
   border: 1px solid #d1d5db;
   border-radius: 6px;
@@ -2962,10 +2995,10 @@
   cursor: pointer;
   transition: color 0.2s ease;
 }
-.arravpos-consent-cancel-btn:hover {
+.aaravpos-barber-consent-cancel-btn:hover {
   color: #111827;
 }
-.arravpos-consent-submit-btn {
+.aaravpos-barber-consent-submit-btn {
   display: flex;
   align-items: center;
   gap: 8px;
@@ -2974,27 +3007,27 @@
   border-radius: 6px;
   transition: all 0.2s ease;
 }
-.arravpos-consent-submit-disabled {
+.aaravpos-barber-consent-submit-disabled {
   background-color: #d1d5db;
   color: #4b5563;
   cursor: not-allowed;
 }
-.arravpos-consent-submit-active {
+.aaravpos-barber-consent-submit-active {
   background-color: var(--btn-bg);
   color: #ffffff;
   cursor: pointer;
 }
-.arravpos-consent-submit-active:hover {
+.aaravpos-barber-consent-submit-active:hover {
   background-color: var(--btn-bg-hover);
 }
-.arravpos-date-wrapper {
+.aaravpos-barber-date-wrapper {
   margin-top: 8px;
   margin-bottom: 14px;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
 }
-.arravpos-date-strip {
+.aaravpos-barber-date-strip {
   display: flex;
   align-items: stretch;
   gap: 6px;
@@ -3004,10 +3037,10 @@
   -webkit-overflow-scrolling: touch;
   scroll-behavior: smooth;
 }
-.arravpos-date-strip::-webkit-scrollbar {
+.aaravpos-barber-date-strip::-webkit-scrollbar {
   display: none;
 }
-.arravpos-date-card {
+.aaravpos-barber-date-card {
   flex-shrink: 0;
   display: flex;
   flex-direction: column;
@@ -3021,37 +3054,37 @@
   user-select: none;
   border: 1px solid transparent;
 }
-.arravpos-date-card-active {
+.aaravpos-barber-date-card-active {
   background-color: var(--btn-bg);
   color: var(--btn-text);
   border-color: var(--btn-bg);
 }
-.arravpos-date-card-default:hover {
+.aaravpos-barber-date-card-default:hover {
   color: var(--btn-text-hover);
   border-color: var(--btn-bg-hover);
   background-color: var(--btn-bg-hover);
 }
-.arravpos-date-week {
+.aaravpos-barber-date-week {
   font-size: 10px;
   text-transform: uppercase;
   margin-bottom: 4px;
   line-height: 1;
   font-weight: 500;
 }
-.arravpos-date-day {
+.aaravpos-barber-date-day {
   font-family: monospace;
   font-size: 18px;
   line-height: 1;
   font-weight: 500;
 }
-.arravpos-date-today {
+.aaravpos-barber-date-today {
   margin-top: 6px;
   font-size: 8px;
   color: var(--red);
   font-weight: 700;
   line-height: 1;
 }
-.arravpos-calendar-btn {
+.aaravpos-barber-calendar-btn {
   margin-left: 16px;
   padding: 8px;
   font-size: 14px;
@@ -3070,7 +3103,7 @@
   color: #ffffff;
   border: none;
 }
-.arravpos-selected-professional {
+.aaravpos-barber-selected-professional {
   display: flex;
   align-items: center;
   gap: 12px;
@@ -3081,14 +3114,14 @@
   border-radius: 2px;
   flex-wrap: wrap;
 }
-.arravpos-selected-professional-image {
+.aaravpos-barber-selected-professional-image {
   width: 40px;
   height: 40px;
   border-radius: 9999px;
   object-fit: cover;
   flex-shrink: 0;
 }
-.arravpos-selected-professional-avatar {
+.aaravpos-barber-selected-professional-avatar {
   width: 40px;
   height: 40px;
   border-radius: 9999px;
@@ -3099,16 +3132,16 @@
   justify-content: center;
   flex-shrink: 0;
 }
-.arravpos-selected-professional-content {
+.aaravpos-barber-selected-professional-content {
   flex: 1;
   min-width: 0;
 }
-.arravpos-selected-professional-name {
+.aaravpos-barber-selected-professional-name {
   font-size: 14px;
   font-weight: 600;
   margin: 0px 0px 4px;
 }
-.arravpos-selected-professional-services {
+.aaravpos-barber-selected-professional-services {
   font-size: 12px;
   color: var(--muted);
   overflow: hidden;
@@ -3116,41 +3149,41 @@
   white-space: nowrap;
   margin: 0px;
 }
-.arravpos-scroll-area {
+.aaravpos-barber-scroll-area {
   overflow-y: auto;
   padding-bottom: 80px;
   scrollbar-width: none;
   max-height: 362px;
   position: relative;
 }
-.arravpos-scroll-area::-webkit-scrollbar {
+.aaravpos-barber-scroll-area::-webkit-scrollbar {
   display: none;
 }
-.arravpos-loader-wrapper {
+.aaravpos-barber-loader-wrapper {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   height: 100%;
 }
-.arravpos-loader {
+.aaravpos-barber-loader {
   width: 32px;
   height: 32px;
   border-radius: 9999px;
   border: 3px solid var(--btn-bg);
   border-top-color: transparent;
-  animation: arravpos-spin 1s linear infinite;
+  animation: aaravpos-barber-spin 1s linear infinite;
 }
-.arravpos-slot-icon {
+.aaravpos-barber-slot-icon {
   color: #fb923c;
 }
-.arravpos-slot-section {
+.aaravpos-barber-slot-section {
   margin-bottom: 16px;
   border: 1px solid rgb(0 0 0 / 10%);
   border-radius: 2px;
   overflow: hidden;
 }
-.arravpos-slot-section-header {
+.aaravpos-barber-slot-section-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -3159,10 +3192,10 @@
   background-color: var(--surface);
   transition: background-color 0.2s ease;
 }
-.arravpos-slot-section-header:hover {
+.aaravpos-barber-slot-section-header:hover {
   background-color: rgba(var(--btn-bg), 0.08);
 }
-.arravpos-slot-section-title {
+.aaravpos-barber-slot-section-title {
   display: flex;
   align-items: center;
   gap: 8px;
@@ -3172,23 +3205,23 @@
   letter-spacing: 1.2px;
   color: rgba(0, 0, 0, 0.8);
 }
-.arravpos-slot-section-arrow {
+.aaravpos-barber-slot-section-arrow {
   transition: transform 0.2s ease;
 }
-.arravpos-slot-section-arrow-open {
+.aaravpos-barber-slot-section-arrow-open {
   transform: rotate(180deg);
 }
-.arravpos-slot-section-content {
+.aaravpos-barber-slot-section-content {
   padding: 12px;
   border-top: 1px solid rgb(0 0 0 / 10%);
   background-color: #ffffff;
 }
-.arravpos-slot-grid {
+.aaravpos-barber-slot-grid {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
   gap: 8px;
 }
-.arravpos-slot-card {
+.aaravpos-barber-slot-card {
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -3199,30 +3232,30 @@
   border-radius: 2px;
   transition: all 0.2s ease;
 }
-.arravpos-slot-card-default {
+.aaravpos-barber-slot-card-default {
   background-color: #ffffff;
   cursor: pointer;
 }
-.arravpos-slot-card-default:hover {
+.aaravpos-barber-slot-card-default:hover {
   color: var(--btn-bg);
   border-color: var(--btn-bg);
 }
-.arravpos-slot-card-selected {
+.aaravpos-barber-slot-card-selected {
   background-color: #fff8f8;
   color: var(--btn-bg);
   border-color: rgb(0 0 0 / 10%);
   cursor: pointer;
 }
-.arravpos-slot-card-disabled {
+.aaravpos-barber-slot-card-disabled {
   background-color: #f3f4f6;
   color: #9ca3af;
   cursor: not-allowed;
 }
-.arravpos-slot-time {
+.aaravpos-barber-slot-time {
   font-family: monospace;
   font-size: 14px;
 }
-.arravpos-slot-status {
+.aaravpos-barber-slot-status {
   font-size: 10px;
 }
 .aaravpos-barber-staff-wrapper {
@@ -3235,14 +3268,14 @@
 .aaravpos-barber-staff-wrapper::-webkit-scrollbar {
   display: none;
 }
-.arravpos-profile-image {
+.aaravpos-barber-profile-image {
   width: 40px;
   height: 40px;
   border-radius: 9999px;
   object-fit: cover;
   flex-shrink: 0;
 }
-.arravpos-profile-avatar {
+.aaravpos-barber-profile-avatar {
   width: 40px;
   height: 40px;
   border-radius: 9999px;
@@ -3253,7 +3286,7 @@
   justify-content: center;
   flex-shrink: 0;
 }
-.arravpos-card-box {
+.aaravpos-barber-card-box {
   background-color: #ffffff;
   border: 1px solid var(--btn-bg);
   border-radius: 2px;
@@ -3261,7 +3294,7 @@
   margin-bottom: 8px;
   font-size: 14px;
 }
-.arravpos-section-label {
+.aaravpos-barber-section-label {
   margin-top: 20px;
   margin-bottom: 8px;
   font-size: 10px;
@@ -3270,7 +3303,7 @@
   letter-spacing: 1.5px;
   color: rgba(0, 0, 0, 0.7);
 }
-.arravpos-select-card {
+.aaravpos-barber-select-card {
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -3281,22 +3314,22 @@
   margin-bottom: 8px;
   border: 1px solid;
 }
-.arravpos-select-card-default {
+.aaravpos-barber-select-card-default {
   border-color: var(--border);
   background-color: transparent;
 }
-.arravpos-select-card-active {
+.aaravpos-barber-select-card-active {
   border-color: var(--red);
   background-color: rgba(255, 0, 0, 0.05);
 }
-.arravpos-select-check {
+.aaravpos-barber-select-check {
   margin-left: auto;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
 }
-.arravpos-date-nav-btn {
+.aaravpos-barber-date-nav-btn {
   flex-shrink: 0;
   width: 34px;
   background-color: rgb(242, 240, 236);
@@ -3312,7 +3345,7 @@
   align-self: stretch;
   transition: all 150ms ease;
 }
-.arravpos-date-nav-btn:hover {
+.aaravpos-barber-date-nav-btn:hover {
   border-color: var(--red);
   color: var(--red);
   background-color: rgba(215, 38, 61, 0.12);
@@ -3396,7 +3429,7 @@
   }
 }
 @media (max-width: 768px) {
-  .arravpos-select-card {
+  .aaravpos-barber-select-card {
     gap: 10px;
     padding: 10px;
   }
@@ -3414,47 +3447,47 @@
   .aaravpos-barber-calendar-grid {
     gap: 8px;
   }
-  .arravpos-date-nav-btn svg {
+  .aaravpos-barber-date-nav-btn svg {
     width: 18px;
     height: 18px;
   }
-  .arravpos-date-strip {
+  .aaravpos-barber-date-strip {
     gap: 5px;
   }
-  .arravpos-date-week {
+  .aaravpos-barber-date-week {
     font-size: 9px;
   }
-  .arravpos-date-day {
+  .aaravpos-barber-date-day {
     font-size: 20px;
   }
-  .arravpos-date-today {
+  .aaravpos-barber-date-today {
     font-size: 7px;
   }
-  .arravpos-select-check svg {
+  .aaravpos-barber-select-check svg {
     width: 18px;
     height: 18px;
   }
-  .arravpos-card-box {
+  .aaravpos-barber-card-box {
     padding: 14px;
     font-size: 13px;
   }
-  .arravpos-calendar-btn {
+  .aaravpos-barber-calendar-btn {
     font-size: 12px;
   }
-  .arravpos-outlet-info {
+  .aaravpos-barber-outlet-info {
     padding: 10px;
   }
-  .arravpos-outlet-logo {
+  .aaravpos-barber-outlet-logo {
     width: 36px;
     height: 36px;
   }
-  .arravpos-appointment-header {
+  .aaravpos-barber-appointment-header {
     align-items: flex-start;
   }
-  .arravpos-appointment-price {
+  .aaravpos-barber-appointment-price {
     font-size: 14px;
   }
-  .arravpos-appointment-services {
+  .aaravpos-barber-appointment-services {
     white-space: normal;
     display: -webkit-box;
     -webkit-line-clamp: 2;
@@ -3487,17 +3520,17 @@
   }
 }
 @media (min-width: 768px) {
-  .arravpos-section-label {
+  .aaravpos-barber-section-label {
     margin-top: 18px;
     font-size: 9px;
     letter-spacing: 1.3px;
   }
-  .arravpos-profile-avatar {
+  .aaravpos-barber-profile-avatar {
     width: 36px;
     height: 36px;
     font-size: 14px;
   }
-  .arravpos-profile-image {
+  .aaravpos-barber-profile-image {
     width: 36px;
     height: 36px;
   }
@@ -3526,7 +3559,7 @@
   .aaravpos-barber-pro-order-list {
     height: calc(100dvh - 380px);
   }
-  .arravpos-details-grid {
+  .aaravpos-barber-details-grid {
     grid-template-columns: repeat(2, 1fr);
     gap: 20px;
   }
@@ -3535,73 +3568,73 @@
   }
 }
 @media (max-width: 480px) {
-  .arravpos-date-nav-btn {
+  .aaravpos-barber-date-nav-btn {
     width: 23px;
     padding: 6px;
   }
-  .arravpos-date-nav-btn svg {
+  .aaravpos-barber-date-nav-btn svg {
     width: 16px;
     height: 16px;
   }
-  .arravpos-date-strip {
+  .aaravpos-barber-date-strip {
     gap: 4px;
   }
-  .arravpos-date-card {
+  .aaravpos-barber-date-card {
     min-width: 24px;
     min-height: 38px;
     padding: 8px 4px;
   }
-  .arravpos-calendar-btn {
+  .aaravpos-barber-calendar-btn {
     margin-left: 2px;
     padding: 6px;
   }
-  .arravpos-date-week {
+  .aaravpos-barber-date-week {
     font-size: 8px;
     margin-bottom: 3px;
   }
-  .arravpos-date-day {
+  .aaravpos-barber-date-day {
     font-size: 18px;
   }
-  .arravpos-date-today {
+  .aaravpos-barber-date-today {
     margin-top: 4px;
     font-size: 6px;
   }
-  .arravpos-select-check svg {
+  .aaravpos-barber-select-check svg {
     width: 16px;
     height: 16px;
   }
-  .arravpos-select-card {
+  .aaravpos-barber-select-card {
     gap: 8px;
     padding: 8px;
   }
-  .arravpos-section-label {
+  .aaravpos-barber-section-label {
     margin-top: 16px;
     font-size: 8px;
     letter-spacing: 1.1px;
   }
-  .arravpos-card-box {
+  .aaravpos-barber-card-box {
     padding: 12px;
     font-size: 12px;
   }
-  .arravpos-profile-image {
+  .aaravpos-barber-profile-image {
     width: 32px;
     height: 32px;
   }
-  .arravpos-profile-avatar {
+  .aaravpos-barber-profile-avatar {
     width: 32px;
     height: 32px;
     font-size: 12px;
   }
-  .arravpos-outlet-name {
+  .aaravpos-barber-outlet-name {
     font-size: 13px;
   }
-  .arravpos-outlet-address {
+  .aaravpos-barber-outlet-address {
     font-size: 11px;
   }
-  .arravpos-appointment-name {
+  .aaravpos-barber-appointment-name {
     font-size: 13px;
   }
-  .arravpos-appointment-date-text {
+  .aaravpos-barber-appointment-date-text {
     font-size: 13px;
   }
   .aaravpos-barber-date-modal {
@@ -3613,7 +3646,7 @@
   }
 }
 @media (max-width: 543px) {
-  .arravpos-date-wrapper {
+  .aaravpos-barber-date-wrapper {
     justify-content: space-between;
   }
   .aaravpos-barber-services-grid {
@@ -3624,7 +3657,7 @@
   .aaravpos-barber-sidebar {
     display: block;
   }
-  .aaravpos-barber-sidebar-close-btn {
+  .aaravpos-barber-sidebar-mobile {
     display: none;
   }
   .aaravpos-barber-layout-wrapper {
@@ -3640,20 +3673,20 @@
   }
 }
 @media (min-width: 1024px) {
-  .arravpos-date-strip {
+  .aaravpos-barber-date-strip {
     gap: 6px;
   }
   .custom-container {
     padding-left: 64px;
     padding-right: 64px;
   }
-  .arravpos-consent-modal {
+  .aaravpos-barber-consent-modal {
     width: 60%;
   }
-  .arravpos-scroll-area {
+  .aaravpos-barber-scroll-area {
     padding-bottom: 16px;
   }
-  .arravpos-consent-title {
+  .aaravpos-barber-consent-title {
     font-size: 20px;
   }
   .aaravpos-barber-header {
@@ -3679,7 +3712,7 @@
     align-items: flex-end;
     gap: 32px;
   }
-  .arravpos-details-scroll {
+  .aaravpos-barber-details-scroll {
     padding-bottom: 16px;
   }
 }
@@ -3691,7 +3724,7 @@
   .aaravpos-barber-sidebar {
     display: none;
   }
-  .arravpos-booking-grid {
+  .aaravpos-barber-booking-grid {
     flex-direction: column;
     gap: 20px;
   }
@@ -3812,12 +3845,12 @@
     transform: rotate(360deg);
   }
 }
-@keyframes arravpos-spin {
+@keyframes aaravpos-barber-spin {
   to {
     transform: rotate(360deg);
   }
 }
-@keyframes arravpos-spin {
+@keyframes aaravpos-barber-spin {
   to {
     transform: rotate(360deg);
   }