tas-uell-sdk 0.3.1 → 0.3.2

package/fesm2020/tas-uell-sdk.mjs

@@ -1,16 +1,16 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Injectable, Inject, Component, Input, ChangeDetectionStrategy, ViewChild, EventEmitter, Output, NgModule } from '@angular/core';
+import { InjectionToken, Injectable, Inject, Component, Input, ChangeDetectionStrategy, ViewChild, NgModule } from '@angular/core';
 import { BehaviorSubject, Observable, Subscription } from 'rxjs';
 import { map, catchError, finalize, shareReplay } from 'rxjs/operators';
 import * as OT from '@opentok/client';
 import * as i1 from '@ng-bootstrap/ng-bootstrap';
 import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
-import * as i4 from '@angular/common';
+import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i4$1 from '@angular/forms';
+import * as i4 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import interact from 'interactjs';
-import * as i4$2 from '@angular/platform-browser';
+import * as i4$1 from '@angular/platform-browser';
 
 /**
  * Injection token for TAS configuration
@@ -1142,7 +1142,7 @@ class TasFeedbackModalComponent {
     }
 }
 TasFeedbackModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasFeedbackModalComponent, deps: [{ token: i1.NgbActiveModal }, { token: TasService }], target: i0.ɵɵFactoryTarget.Component });
-TasFeedbackModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: TasFeedbackModalComponent, selector: "tas-feedback-modal", inputs: { videoCallId: "videoCallId", tenant: "tenant", businessRole: "businessRole" }, ngImport: i0, template: "<div class=\"tas-feedback-modal\">\n  <!-- Header with subtitle -->\n  <div class=\"feedback-header\">\n    <div class=\"header-text\">\n      <span class=\"subtitle\">Cierre de la consulta</span>\n      <h2>Calidad de la videollamada</h2>\n    </div>\n    <button\n      type=\"button\"\n      class=\"close-btn\"\n      (click)=\"dismiss()\"\n      aria-label=\"Cerrar\"\n    >\n      <i class=\"fa fa-times\"></i>\n    </button>\n  </div>\n\n  <!-- Progress Divider -->\n  <div class=\"progress-divider\">\n    <div class=\"progress-fill\" [style.width.%]=\"feedbackProgress\"></div>\n  </div>\n  <div class=\"accent-line\"></div>\n\n  <div class=\"feedback-content\">\n    <!-- Star Rating with question -->\n    <div class=\"rating-section\">\n      <p class=\"rating-question\">\u00BFC\u00F3mo fue la calidad de la llamada?</p>\n      <div\n        class=\"stars-container\"\n        (mouseleave)=\"clearHoverRating()\"\n      >\n        <button\n          *ngFor=\"let star of [1, 2, 3, 4, 5]\"\n          type=\"button\"\n          class=\"star-btn\"\n          [class.filled]=\"star <= getDisplayRating()\"\n          (click)=\"setRating(star)\"\n          (mouseenter)=\"setHoverRating(star)\"\n          [attr.aria-label]=\"'Calificar ' + star + ' estrellas'\"\n        >\n          <i class=\"fa\" [class.fa-star]=\"star <= getDisplayRating()\" [class.fa-star-o]=\"star > getDisplayRating()\"></i>\n        </button>\n      </div>\n    </div>\n\n    <!-- Motive Dropdown -->\n    <div class=\"motive-section\">\n      <label class=\"motive-label\">Motivo (opcional)</label>\n      <div class=\"custom-dropdown\" [class.open]=\"isDropdownOpen\">\n        <button\n          type=\"button\"\n          class=\"dropdown-trigger\"\n          (click)=\"toggleDropdown()\"\n          [attr.aria-expanded]=\"isDropdownOpen\"\n          aria-haspopup=\"listbox\"\n        >\n          <span class=\"dropdown-text\">\n            {{ selectedMotive?.description || 'Seleccionar motivo' }}\n          </span>\n          <i class=\"fa fa-chevron-down dropdown-arrow\"></i>\n        </button>\n        <div\n          class=\"dropdown-menu\"\n          *ngIf=\"isDropdownOpen\"\n          role=\"listbox\"\n        >\n          <button\n            *ngFor=\"let motive of filteredMotives\"\n            type=\"button\"\n            class=\"dropdown-item\"\n            [class.selected]=\"selectedMotive?.id === motive.id\"\n            (click)=\"selectMotive(motive)\"\n            role=\"option\"\n            [attr.aria-selected]=\"selectedMotive?.id === motive.id\"\n          >\n            {{ motive.description }}\n          </button>\n        </div>\n      </div>\n    </div>\n\n    <!-- Observation Textarea -->\n    <div class=\"observation-section\">\n      <label class=\"observation-label\" [class.required]=\"isObservationRequired\">\n        {{ isObservationRequired ? 'Observacion (requerida)' : 'Observacion (opcional)' }}\n      </label>\n      <textarea\n        class=\"observation-textarea\"\n        [(ngModel)]=\"observation\"\n        [placeholder]=\"isObservationRequired ? 'Por favor, describe el problema...' : 'Escribe tu comentario...'\"\n        rows=\"3\"\n        [attr.aria-required]=\"isObservationRequired\"\n      ></textarea>\n    </div>\n  </div>\n\n  <div class=\"feedback-footer\">\n    <button\n      type=\"button\"\n      class=\"submit-btn\"\n      [disabled]=\"!canSubmit || isSubmitting\"\n      (click)=\"submit()\"\n    >\n      <span *ngIf=\"!isSubmitting\">Enviar</span>\n      <span *ngIf=\"isSubmitting\">\n        <i class=\"fa fa-spinner fa-spin\"></i>\n        Enviando...\n      </span>\n    </button>\n  </div>\n\n  <!-- Toast Notification -->\n  <div class=\"toast-notification\" *ngIf=\"showToast\" role=\"alert\" aria-live=\"polite\">\n    <i class=\"fa fa-check-circle\"></i>\n    <span>Gracias por tu feedback</span>\n  </div>\n</div>\n\n<!-- Backdrop to close dropdown when clicking outside -->\n<div\n  class=\"dropdown-backdrop\"\n  *ngIf=\"isDropdownOpen\"\n  (click)=\"closeDropdown()\"\n></div>\n", styles: [":host{display:block;width:100%}::ng-deep .tas-feedback-modal-wrapper .modal-content{overflow:visible!important;border:none;background:transparent}::ng-deep .tas-feedback-modal-wrapper .modal-dialog{max-width:450px}.tas-feedback-modal{width:100%;background:#fff;border-radius:16px;overflow:visible;position:relative;padding:.5rem;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.feedback-header{display:flex;justify-content:space-between;align-items:flex-start;padding:1.25rem 1.5rem 1rem;background:#fff;border-radius:16px 16px 0 0}.feedback-header .header-text{display:flex;flex-direction:column;gap:.25rem}.feedback-header .header-text .subtitle{font-size:.8125rem;color:#6b7280;font-weight:400}.feedback-header .header-text h2{margin:0;font-size:1.25rem;font-weight:600;color:#1f2937;letter-spacing:-.01em}.feedback-header .close-btn{background:transparent;border:none;padding:8px;cursor:pointer;color:#9ca3af;font-size:1.25rem;line-height:1;transition:all .2s ease;margin-top:-4px}.feedback-header .close-btn:hover{color:#4b5563}.feedback-header .close-btn:focus{outline:none;color:#4b5563}.progress-divider{height:4px;background:#e5e7eb;margin:0;position:relative;overflow:hidden}.progress-divider .progress-fill{height:100%;background:linear-gradient(90deg,var(--Primary-Uell, #1da4b1) 0%,#4fd1c5 100%);transition:width .4s cubic-bezier(.4,0,.2,1);border-radius:0 2px 2px 0}.feedback-content{padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem}.rating-section{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}.rating-section .rating-question{margin:0;font-size:.9375rem;color:#4b5563;font-weight:400;align-self:center}.rating-section .stars-container{display:flex;gap:8px;width:100%;justify-content:center}.rating-section .star-btn{background:transparent;border:none;padding:4px;cursor:pointer;font-size:2rem;color:#d1d5db;transition:all .15s ease;line-height:1}.rating-section .star-btn:hover{transform:scale(1.15)}.rating-section .star-btn.filled{color:#f5a623}.rating-section .star-btn.filled i.fa-star{text-shadow:0 2px 4px rgba(245,166,35,.3)}.rating-section .star-btn i.fa-star-o{color:#d1d5db}.rating-section .star-btn:focus{outline:none}.motive-section{display:flex;flex-direction:column;gap:.5rem;position:relative;overflow:visible}.motive-section .motive-label{font-size:.875rem;font-weight:500;color:#4b5563}.motive-section .custom-dropdown{position:relative;overflow:visible}.motive-section .custom-dropdown .dropdown-trigger{width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#fff;border:1px solid #d1d5db;border-radius:8px;cursor:pointer;font-size:.9375rem;color:#4b5563;transition:all .2s ease;min-height:52px}.motive-section .custom-dropdown .dropdown-trigger:hover{border-color:#9ca3af}.motive-section .custom-dropdown .dropdown-trigger:focus{outline:none;border-color:var(--Primary-Uell, #1da4b1)}.motive-section .custom-dropdown .dropdown-trigger .dropdown-text{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.motive-section .custom-dropdown .dropdown-trigger .dropdown-arrow{font-size:.875rem;color:#6b7280;transition:transform .2s ease;margin-left:.5rem}.motive-section .custom-dropdown.open .dropdown-trigger{border-color:var(--Primary-Uell, #1da4b1)}.motive-section .custom-dropdown.open .dropdown-trigger .dropdown-arrow{transform:rotate(180deg)}.motive-section .custom-dropdown .dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;display:block;min-height:40px;min-width:100%;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 4px 16px #0000001f;max-height:250px;overflow:hidden;overflow-y:auto;z-index:1050;visibility:visible;opacity:1;padding:0}.motive-section .custom-dropdown .dropdown-menu .dropdown-item{width:100%;padding:1rem 1.25rem;background:transparent;border:none;border-bottom:1px dashed #e5e7eb;text-align:left;font-size:.9375rem;color:#4b5563;cursor:pointer;transition:all .15s ease;position:relative}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:last-child{border-bottom:none}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:hover{background:rgba(29,164,177,.05);color:#374151}.motive-section .custom-dropdown .dropdown-menu .dropdown-item.selected{background:rgba(29,164,177,.08);color:var(--Primary-Uell, #1da4b1);border-left:3px solid var(--Primary-Uell, #1da4b1);padding-left:calc(1.25rem - 3px)}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:focus{outline:none;background:rgba(29,164,177,.05)}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:first-child{border-radius:8px 8px 0 0}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:last-child{border-radius:0 0 8px 8px}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:only-child{border-radius:8px}.motive-section .clear-motive-btn{position:absolute;right:40px;top:32px;background:#f3f4f6;border:none;padding:4px 6px;border-radius:4px;cursor:pointer;color:#6b7280;font-size:.625rem;transition:all .2s ease}.motive-section .clear-motive-btn:hover{background:#e5e7eb;color:#374151}.motive-section .clear-motive-btn:focus{outline:none}.observation-section{display:flex;flex-direction:column;gap:.5rem}.observation-section .observation-label{font-size:.875rem;font-weight:500;color:#4b5563}.observation-section .observation-label.required{color:#dc2626}.observation-section .observation-label.required:after{content:\" *\";font-weight:600}.observation-section .observation-textarea{width:100%;padding:.75rem 1rem;border:1px solid #d1d5db;border-radius:12px;font-size:.875rem;font-family:inherit;resize:vertical;min-height:80px;transition:all .2s ease;background:#fff}.observation-section .observation-textarea::placeholder{color:#9ca3af}.observation-section .observation-textarea:hover{border-color:#9ca3af}.observation-section .observation-textarea:focus{outline:none;border-color:var(--Primary-Uell, #1da4b1);box-shadow:0 0 0 3px #1da4b126}.feedback-footer{padding:1rem 1.5rem 1.5rem;display:flex;justify-content:flex-end}.feedback-footer .submit-btn{padding:.75rem 2rem;background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:24px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:120px}.feedback-footer .submit-btn:hover:not(:disabled){background:#178e99}.feedback-footer .submit-btn:disabled{background:rgba(29,164,177,.5);cursor:not-allowed}.feedback-footer .submit-btn:focus{outline:none;box-shadow:0 0 0 3px #1da4b126}.feedback-footer .submit-btn i.fa-spinner{margin-right:6px}.toast-notification{position:fixed;bottom:24px;left:24px;display:flex;align-items:center;gap:10px;padding:14px 20px;background:#383e52;color:#fff;border-radius:8px;box-shadow:0 4px 12px #00000040;font-size:.875rem;font-weight:500;z-index:1060;animation:slideIn .3s ease}.toast-notification i.fa-check-circle{color:#4ade80;font-size:1.125rem}@keyframes slideIn{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.dropdown-backdrop{position:fixed;inset:0;z-index:99}\n"], directives: [{ type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+TasFeedbackModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: TasFeedbackModalComponent, selector: "tas-feedback-modal", inputs: { videoCallId: "videoCallId", tenant: "tenant", businessRole: "businessRole" }, ngImport: i0, template: "<div class=\"tas-feedback-modal\">\n  <!-- Header with subtitle -->\n  <div class=\"feedback-header\">\n    <div class=\"header-text\">\n      <span class=\"subtitle\">Cierre de la consulta</span>\n      <h2>Calidad de la videollamada</h2>\n    </div>\n    <button\n      type=\"button\"\n      class=\"close-btn\"\n      (click)=\"dismiss()\"\n      aria-label=\"Cerrar\"\n    >\n      <i class=\"fa fa-times\"></i>\n    </button>\n  </div>\n\n  <!-- Progress Divider -->\n  <div class=\"progress-divider\">\n    <div class=\"progress-fill\" [style.width.%]=\"feedbackProgress\"></div>\n  </div>\n  <div class=\"accent-line\"></div>\n\n  <div class=\"feedback-content\">\n    <!-- Star Rating with question -->\n    <div class=\"rating-section\">\n      <p class=\"rating-question\">\u00BFC\u00F3mo fue la calidad de la llamada?</p>\n      <div\n        class=\"stars-container\"\n        (mouseleave)=\"clearHoverRating()\"\n      >\n        <button\n          *ngFor=\"let star of [1, 2, 3, 4, 5]\"\n          type=\"button\"\n          class=\"star-btn\"\n          [class.filled]=\"star <= getDisplayRating()\"\n          (click)=\"setRating(star)\"\n          (mouseenter)=\"setHoverRating(star)\"\n          [attr.aria-label]=\"'Calificar ' + star + ' estrellas'\"\n        >\n          <i class=\"fa\" [class.fa-star]=\"star <= getDisplayRating()\" [class.fa-star-o]=\"star > getDisplayRating()\"></i>\n        </button>\n      </div>\n    </div>\n\n    <!-- Motive Dropdown -->\n    <div class=\"motive-section\">\n      <label class=\"motive-label\">Motivo (opcional)</label>\n      <div class=\"custom-dropdown\" [class.open]=\"isDropdownOpen\">\n        <button\n          type=\"button\"\n          class=\"dropdown-trigger\"\n          (click)=\"toggleDropdown()\"\n          [attr.aria-expanded]=\"isDropdownOpen\"\n          aria-haspopup=\"listbox\"\n        >\n          <span class=\"dropdown-text\">\n            {{ selectedMotive?.description || 'Seleccionar motivo' }}\n          </span>\n          <i class=\"fa fa-chevron-down dropdown-arrow\"></i>\n        </button>\n        <div\n          class=\"dropdown-menu\"\n          *ngIf=\"isDropdownOpen\"\n          role=\"listbox\"\n        >\n          <button\n            *ngFor=\"let motive of filteredMotives\"\n            type=\"button\"\n            class=\"dropdown-item\"\n            [class.selected]=\"selectedMotive?.id === motive.id\"\n            (click)=\"selectMotive(motive)\"\n            role=\"option\"\n            [attr.aria-selected]=\"selectedMotive?.id === motive.id\"\n          >\n            {{ motive.description }}\n          </button>\n        </div>\n      </div>\n    </div>\n\n    <!-- Observation Textarea -->\n    <div class=\"observation-section\">\n      <label class=\"observation-label\" [class.required]=\"isObservationRequired\">\n        {{ isObservationRequired ? 'Observacion (requerida)' : 'Observacion (opcional)' }}\n      </label>\n      <textarea\n        class=\"observation-textarea\"\n        [(ngModel)]=\"observation\"\n        [placeholder]=\"isObservationRequired ? 'Por favor, describe el problema...' : 'Escribe tu comentario...'\"\n        rows=\"3\"\n        [attr.aria-required]=\"isObservationRequired\"\n      ></textarea>\n    </div>\n  </div>\n\n  <div class=\"feedback-footer\">\n    <button\n      type=\"button\"\n      class=\"submit-btn\"\n      [disabled]=\"!canSubmit || isSubmitting\"\n      (click)=\"submit()\"\n    >\n      <span *ngIf=\"!isSubmitting\">Enviar</span>\n      <span *ngIf=\"isSubmitting\">\n        <i class=\"fa fa-spinner fa-spin\"></i>\n        Enviando...\n      </span>\n    </button>\n  </div>\n\n  <!-- Toast Notification -->\n  <div class=\"toast-notification\" *ngIf=\"showToast\" role=\"alert\" aria-live=\"polite\">\n    <i class=\"fa fa-check-circle\"></i>\n    <span>Gracias por tu feedback</span>\n  </div>\n</div>\n\n<!-- Backdrop to close dropdown when clicking outside -->\n<div\n  class=\"dropdown-backdrop\"\n  *ngIf=\"isDropdownOpen\"\n  (click)=\"closeDropdown()\"\n></div>\n", styles: [":host{display:block;width:100%}::ng-deep .tas-feedback-modal-wrapper .modal-content{overflow:visible!important;border:none;background:transparent}::ng-deep .tas-feedback-modal-wrapper .modal-dialog{max-width:450px}.tas-feedback-modal{width:100%;background:#fff;border-radius:16px;overflow:visible;position:relative;padding:.5rem;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.feedback-header{display:flex;justify-content:space-between;align-items:flex-start;padding:1.25rem 1.5rem 1rem;background:#fff;border-radius:16px 16px 0 0}.feedback-header .header-text{display:flex;flex-direction:column;gap:.25rem}.feedback-header .header-text .subtitle{font-size:.8125rem;color:#6b7280;font-weight:400}.feedback-header .header-text h2{margin:0;font-size:1.25rem;font-weight:600;color:#1f2937;letter-spacing:-.01em}.feedback-header .close-btn{background:transparent;border:none;padding:8px;cursor:pointer;color:#9ca3af;font-size:1.25rem;line-height:1;transition:all .2s ease;margin-top:-4px}.feedback-header .close-btn:hover{color:#4b5563}.feedback-header .close-btn:focus{outline:none;color:#4b5563}.progress-divider{height:4px;background:#e5e7eb;margin:0;position:relative;overflow:hidden}.progress-divider .progress-fill{height:100%;background:linear-gradient(90deg,var(--Primary-Uell, #1da4b1) 0%,#4fd1c5 100%);transition:width .4s cubic-bezier(.4,0,.2,1);border-radius:0 2px 2px 0}.feedback-content{padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem}.rating-section{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}.rating-section .rating-question{margin:0;font-size:.9375rem;color:#4b5563;font-weight:400;align-self:center}.rating-section .stars-container{display:flex;gap:8px;width:100%;justify-content:center}.rating-section .star-btn{background:transparent;border:none;padding:4px;cursor:pointer;font-size:2rem;color:#d1d5db;transition:all .15s ease;line-height:1}.rating-section .star-btn:hover{transform:scale(1.15)}.rating-section .star-btn.filled{color:#f5a623}.rating-section .star-btn.filled i.fa-star{text-shadow:0 2px 4px rgba(245,166,35,.3)}.rating-section .star-btn i.fa-star-o{color:#d1d5db}.rating-section .star-btn:focus{outline:none}.motive-section{display:flex;flex-direction:column;gap:.5rem;position:relative;overflow:visible}.motive-section .motive-label{font-size:.875rem;font-weight:500;color:#4b5563}.motive-section .custom-dropdown{position:relative;overflow:visible}.motive-section .custom-dropdown .dropdown-trigger{width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#fff;border:1px solid #d1d5db;border-radius:8px;cursor:pointer;font-size:.9375rem;color:#4b5563;transition:all .2s ease;min-height:52px}.motive-section .custom-dropdown .dropdown-trigger:hover{border-color:#9ca3af}.motive-section .custom-dropdown .dropdown-trigger:focus{outline:none;border-color:var(--Primary-Uell, #1da4b1)}.motive-section .custom-dropdown .dropdown-trigger .dropdown-text{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.motive-section .custom-dropdown .dropdown-trigger .dropdown-arrow{font-size:.875rem;color:#6b7280;transition:transform .2s ease;margin-left:.5rem}.motive-section .custom-dropdown.open .dropdown-trigger{border-color:var(--Primary-Uell, #1da4b1)}.motive-section .custom-dropdown.open .dropdown-trigger .dropdown-arrow{transform:rotate(180deg)}.motive-section .custom-dropdown .dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;display:block;min-height:40px;min-width:100%;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 4px 16px #0000001f;max-height:250px;overflow:hidden;overflow-y:auto;z-index:1050;visibility:visible;opacity:1;padding:0}.motive-section .custom-dropdown .dropdown-menu .dropdown-item{width:100%;padding:1rem 1.25rem;background:transparent;border:none;border-bottom:1px dashed #e5e7eb;text-align:left;font-size:.9375rem;color:#4b5563;cursor:pointer;transition:all .15s ease;position:relative}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:last-child{border-bottom:none}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:hover{background:rgba(29,164,177,.05);color:#374151}.motive-section .custom-dropdown .dropdown-menu .dropdown-item.selected{background:rgba(29,164,177,.08);color:var(--Primary-Uell, #1da4b1);border-left:3px solid var(--Primary-Uell, #1da4b1);padding-left:calc(1.25rem - 3px)}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:focus{outline:none;background:rgba(29,164,177,.05)}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:first-child{border-radius:8px 8px 0 0}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:last-child{border-radius:0 0 8px 8px}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:only-child{border-radius:8px}.motive-section .clear-motive-btn{position:absolute;right:40px;top:32px;background:#f3f4f6;border:none;padding:4px 6px;border-radius:4px;cursor:pointer;color:#6b7280;font-size:.625rem;transition:all .2s ease}.motive-section .clear-motive-btn:hover{background:#e5e7eb;color:#374151}.motive-section .clear-motive-btn:focus{outline:none}.observation-section{display:flex;flex-direction:column;gap:.5rem}.observation-section .observation-label{font-size:.875rem;font-weight:500;color:#4b5563}.observation-section .observation-label.required{color:#dc2626}.observation-section .observation-label.required:after{content:\" *\";font-weight:600}.observation-section .observation-textarea{width:100%;padding:.75rem 1rem;border:1px solid #d1d5db;border-radius:12px;font-size:.875rem;font-family:inherit;resize:vertical;min-height:80px;transition:all .2s ease;background:#fff}.observation-section .observation-textarea::placeholder{color:#9ca3af}.observation-section .observation-textarea:hover{border-color:#9ca3af}.observation-section .observation-textarea:focus{outline:none;border-color:var(--Primary-Uell, #1da4b1);box-shadow:0 0 0 3px #1da4b126}.feedback-footer{padding:1rem 1.5rem 1.5rem;display:flex;justify-content:flex-end}.feedback-footer .submit-btn{padding:.75rem 2rem;background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:24px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:120px}.feedback-footer .submit-btn:hover:not(:disabled){background:#178e99}.feedback-footer .submit-btn:disabled{background:rgba(29,164,177,.5);cursor:not-allowed}.feedback-footer .submit-btn:focus{outline:none;box-shadow:0 0 0 3px #1da4b126}.feedback-footer .submit-btn i.fa-spinner{margin-right:6px}.toast-notification{position:fixed;bottom:24px;left:24px;display:flex;align-items:center;gap:10px;padding:14px 20px;background:#383e52;color:#fff;border-radius:8px;box-shadow:0 4px 12px #00000040;font-size:.875rem;font-weight:500;z-index:1060;animation:slideIn .3s ease}.toast-notification i.fa-check-circle{color:#4ade80;font-size:1.125rem}@keyframes slideIn{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.dropdown-backdrop{position:fixed;inset:0;z-index:99}\n"], directives: [{ type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasFeedbackModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tas-feedback-modal', template: "<div class=\"tas-feedback-modal\">\n  <!-- Header with subtitle -->\n  <div class=\"feedback-header\">\n    <div class=\"header-text\">\n      <span class=\"subtitle\">Cierre de la consulta</span>\n      <h2>Calidad de la videollamada</h2>\n    </div>\n    <button\n      type=\"button\"\n      class=\"close-btn\"\n      (click)=\"dismiss()\"\n      aria-label=\"Cerrar\"\n    >\n      <i class=\"fa fa-times\"></i>\n    </button>\n  </div>\n\n  <!-- Progress Divider -->\n  <div class=\"progress-divider\">\n    <div class=\"progress-fill\" [style.width.%]=\"feedbackProgress\"></div>\n  </div>\n  <div class=\"accent-line\"></div>\n\n  <div class=\"feedback-content\">\n    <!-- Star Rating with question -->\n    <div class=\"rating-section\">\n      <p class=\"rating-question\">\u00BFC\u00F3mo fue la calidad de la llamada?</p>\n      <div\n        class=\"stars-container\"\n        (mouseleave)=\"clearHoverRating()\"\n      >\n        <button\n          *ngFor=\"let star of [1, 2, 3, 4, 5]\"\n          type=\"button\"\n          class=\"star-btn\"\n          [class.filled]=\"star <= getDisplayRating()\"\n          (click)=\"setRating(star)\"\n          (mouseenter)=\"setHoverRating(star)\"\n          [attr.aria-label]=\"'Calificar ' + star + ' estrellas'\"\n        >\n          <i class=\"fa\" [class.fa-star]=\"star <= getDisplayRating()\" [class.fa-star-o]=\"star > getDisplayRating()\"></i>\n        </button>\n      </div>\n    </div>\n\n    <!-- Motive Dropdown -->\n    <div class=\"motive-section\">\n      <label class=\"motive-label\">Motivo (opcional)</label>\n      <div class=\"custom-dropdown\" [class.open]=\"isDropdownOpen\">\n        <button\n          type=\"button\"\n          class=\"dropdown-trigger\"\n          (click)=\"toggleDropdown()\"\n          [attr.aria-expanded]=\"isDropdownOpen\"\n          aria-haspopup=\"listbox\"\n        >\n          <span class=\"dropdown-text\">\n            {{ selectedMotive?.description || 'Seleccionar motivo' }}\n          </span>\n          <i class=\"fa fa-chevron-down dropdown-arrow\"></i>\n        </button>\n        <div\n          class=\"dropdown-menu\"\n          *ngIf=\"isDropdownOpen\"\n          role=\"listbox\"\n        >\n          <button\n            *ngFor=\"let motive of filteredMotives\"\n            type=\"button\"\n            class=\"dropdown-item\"\n            [class.selected]=\"selectedMotive?.id === motive.id\"\n            (click)=\"selectMotive(motive)\"\n            role=\"option\"\n            [attr.aria-selected]=\"selectedMotive?.id === motive.id\"\n          >\n            {{ motive.description }}\n          </button>\n        </div>\n      </div>\n    </div>\n\n    <!-- Observation Textarea -->\n    <div class=\"observation-section\">\n      <label class=\"observation-label\" [class.required]=\"isObservationRequired\">\n        {{ isObservationRequired ? 'Observacion (requerida)' : 'Observacion (opcional)' }}\n      </label>\n      <textarea\n        class=\"observation-textarea\"\n        [(ngModel)]=\"observation\"\n        [placeholder]=\"isObservationRequired ? 'Por favor, describe el problema...' : 'Escribe tu comentario...'\"\n        rows=\"3\"\n        [attr.aria-required]=\"isObservationRequired\"\n      ></textarea>\n    </div>\n  </div>\n\n  <div class=\"feedback-footer\">\n    <button\n      type=\"button\"\n      class=\"submit-btn\"\n      [disabled]=\"!canSubmit || isSubmitting\"\n      (click)=\"submit()\"\n    >\n      <span *ngIf=\"!isSubmitting\">Enviar</span>\n      <span *ngIf=\"isSubmitting\">\n        <i class=\"fa fa-spinner fa-spin\"></i>\n        Enviando...\n      </span>\n    </button>\n  </div>\n\n  <!-- Toast Notification -->\n  <div class=\"toast-notification\" *ngIf=\"showToast\" role=\"alert\" aria-live=\"polite\">\n    <i class=\"fa fa-check-circle\"></i>\n    <span>Gracias por tu feedback</span>\n  </div>\n</div>\n\n<!-- Backdrop to close dropdown when clicking outside -->\n<div\n  class=\"dropdown-backdrop\"\n  *ngIf=\"isDropdownOpen\"\n  (click)=\"closeDropdown()\"\n></div>\n", styles: [":host{display:block;width:100%}::ng-deep .tas-feedback-modal-wrapper .modal-content{overflow:visible!important;border:none;background:transparent}::ng-deep .tas-feedback-modal-wrapper .modal-dialog{max-width:450px}.tas-feedback-modal{width:100%;background:#fff;border-radius:16px;overflow:visible;position:relative;padding:.5rem;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.feedback-header{display:flex;justify-content:space-between;align-items:flex-start;padding:1.25rem 1.5rem 1rem;background:#fff;border-radius:16px 16px 0 0}.feedback-header .header-text{display:flex;flex-direction:column;gap:.25rem}.feedback-header .header-text .subtitle{font-size:.8125rem;color:#6b7280;font-weight:400}.feedback-header .header-text h2{margin:0;font-size:1.25rem;font-weight:600;color:#1f2937;letter-spacing:-.01em}.feedback-header .close-btn{background:transparent;border:none;padding:8px;cursor:pointer;color:#9ca3af;font-size:1.25rem;line-height:1;transition:all .2s ease;margin-top:-4px}.feedback-header .close-btn:hover{color:#4b5563}.feedback-header .close-btn:focus{outline:none;color:#4b5563}.progress-divider{height:4px;background:#e5e7eb;margin:0;position:relative;overflow:hidden}.progress-divider .progress-fill{height:100%;background:linear-gradient(90deg,var(--Primary-Uell, #1da4b1) 0%,#4fd1c5 100%);transition:width .4s cubic-bezier(.4,0,.2,1);border-radius:0 2px 2px 0}.feedback-content{padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem}.rating-section{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}.rating-section .rating-question{margin:0;font-size:.9375rem;color:#4b5563;font-weight:400;align-self:center}.rating-section .stars-container{display:flex;gap:8px;width:100%;justify-content:center}.rating-section .star-btn{background:transparent;border:none;padding:4px;cursor:pointer;font-size:2rem;color:#d1d5db;transition:all .15s ease;line-height:1}.rating-section .star-btn:hover{transform:scale(1.15)}.rating-section .star-btn.filled{color:#f5a623}.rating-section .star-btn.filled i.fa-star{text-shadow:0 2px 4px rgba(245,166,35,.3)}.rating-section .star-btn i.fa-star-o{color:#d1d5db}.rating-section .star-btn:focus{outline:none}.motive-section{display:flex;flex-direction:column;gap:.5rem;position:relative;overflow:visible}.motive-section .motive-label{font-size:.875rem;font-weight:500;color:#4b5563}.motive-section .custom-dropdown{position:relative;overflow:visible}.motive-section .custom-dropdown .dropdown-trigger{width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#fff;border:1px solid #d1d5db;border-radius:8px;cursor:pointer;font-size:.9375rem;color:#4b5563;transition:all .2s ease;min-height:52px}.motive-section .custom-dropdown .dropdown-trigger:hover{border-color:#9ca3af}.motive-section .custom-dropdown .dropdown-trigger:focus{outline:none;border-color:var(--Primary-Uell, #1da4b1)}.motive-section .custom-dropdown .dropdown-trigger .dropdown-text{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.motive-section .custom-dropdown .dropdown-trigger .dropdown-arrow{font-size:.875rem;color:#6b7280;transition:transform .2s ease;margin-left:.5rem}.motive-section .custom-dropdown.open .dropdown-trigger{border-color:var(--Primary-Uell, #1da4b1)}.motive-section .custom-dropdown.open .dropdown-trigger .dropdown-arrow{transform:rotate(180deg)}.motive-section .custom-dropdown .dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;display:block;min-height:40px;min-width:100%;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 4px 16px #0000001f;max-height:250px;overflow:hidden;overflow-y:auto;z-index:1050;visibility:visible;opacity:1;padding:0}.motive-section .custom-dropdown .dropdown-menu .dropdown-item{width:100%;padding:1rem 1.25rem;background:transparent;border:none;border-bottom:1px dashed #e5e7eb;text-align:left;font-size:.9375rem;color:#4b5563;cursor:pointer;transition:all .15s ease;position:relative}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:last-child{border-bottom:none}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:hover{background:rgba(29,164,177,.05);color:#374151}.motive-section .custom-dropdown .dropdown-menu .dropdown-item.selected{background:rgba(29,164,177,.08);color:var(--Primary-Uell, #1da4b1);border-left:3px solid var(--Primary-Uell, #1da4b1);padding-left:calc(1.25rem - 3px)}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:focus{outline:none;background:rgba(29,164,177,.05)}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:first-child{border-radius:8px 8px 0 0}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:last-child{border-radius:0 0 8px 8px}.motive-section .custom-dropdown .dropdown-menu .dropdown-item:only-child{border-radius:8px}.motive-section .clear-motive-btn{position:absolute;right:40px;top:32px;background:#f3f4f6;border:none;padding:4px 6px;border-radius:4px;cursor:pointer;color:#6b7280;font-size:.625rem;transition:all .2s ease}.motive-section .clear-motive-btn:hover{background:#e5e7eb;color:#374151}.motive-section .clear-motive-btn:focus{outline:none}.observation-section{display:flex;flex-direction:column;gap:.5rem}.observation-section .observation-label{font-size:.875rem;font-weight:500;color:#4b5563}.observation-section .observation-label.required{color:#dc2626}.observation-section .observation-label.required:after{content:\" *\";font-weight:600}.observation-section .observation-textarea{width:100%;padding:.75rem 1rem;border:1px solid #d1d5db;border-radius:12px;font-size:.875rem;font-family:inherit;resize:vertical;min-height:80px;transition:all .2s ease;background:#fff}.observation-section .observation-textarea::placeholder{color:#9ca3af}.observation-section .observation-textarea:hover{border-color:#9ca3af}.observation-section .observation-textarea:focus{outline:none;border-color:var(--Primary-Uell, #1da4b1);box-shadow:0 0 0 3px #1da4b126}.feedback-footer{padding:1rem 1.5rem 1.5rem;display:flex;justify-content:flex-end}.feedback-footer .submit-btn{padding:.75rem 2rem;background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:24px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:120px}.feedback-footer .submit-btn:hover:not(:disabled){background:#178e99}.feedback-footer .submit-btn:disabled{background:rgba(29,164,177,.5);cursor:not-allowed}.feedback-footer .submit-btn:focus{outline:none;box-shadow:0 0 0 3px #1da4b126}.feedback-footer .submit-btn i.fa-spinner{margin-right:6px}.toast-notification{position:fixed;bottom:24px;left:24px;display:flex;align-items:center;gap:10px;padding:14px 20px;background:#383e52;color:#fff;border-radius:8px;box-shadow:0 4px 12px #00000040;font-size:.875rem;font-weight:500;z-index:1060;animation:slideIn .3s ease}.toast-notification i.fa-check-circle{color:#4ade80;font-size:1.125rem}@keyframes slideIn{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.dropdown-backdrop{position:fixed;inset:0;z-index:99}\n"] }]
@@ -1270,6 +1270,7 @@ class TasVideocallComponent {
         this.waitingRoomUsers = [];
         this.ownerHasJoined = false;
         this.hasVideoStream = false;
+        this.hasSubscriberConnected = false; // Tracks if another user's video stream has actually connected
         this.dismissedUsers = [];
         this.showLocationPanel = true; // Show by default for owners, will be updated based on user's location status
         this.userHasLocation = false; // Tracks if the user has shared their location
@@ -1284,16 +1285,14 @@ class TasVideocallComponent {
         this.devModeEnabled = false; // Enable dev controls for testing
         this.geoPanelDismissed = false; // Track if owner manually closed the panel
         this.feedbackShown = false; // Track if feedback modal has been shown
+        this.previousAllGeoGranted = null; // Track previous value to detect changes
         this.subscriptions = new Subscription();
         this.homeIcon = this.sanitizer.bypassSecurityTrustHtml(TAS_ICONS.home);
     }
     ngOnInit() {
         this.setupSubscriptions();
         this.initializeCall();
-        // For owners: show the geo panel to request user location (unless dismissed)
-        if (this.canAdmitUsers && !this.geoPanelDismissed) {
-            this.userGeoViewState = UserGeoViewState.INITIAL;
-        }
+        // Panel will be shown when user joins (via userGeoInfo$ subscription)
     }
     ngAfterViewInit() {
         this.initInteract();
@@ -1391,9 +1390,19 @@ class TasVideocallComponent {
     get hasAnyDenied() {
         return this.deniedUsers.length > 0;
     }
-    /** Show user geo panel for owners when not hidden */
+    /** Show user geo panel for owners when:
+     * - User can admit (is owner/backoffice)
+     * - Panel was not manually dismissed by owner
+     * - Panel is not in hidden state
+     * - Another user has actually connected their video stream
+     * - Not all geo is granted
+     */
     get shouldShowUserGeoPanel() {
-        return this.canAdmitUsers && this.userGeoViewState !== UserGeoViewState.HIDDEN;
+        return (this.canAdmitUsers &&
+            !this.geoPanelDismissed &&
+            this.userGeoViewState !== UserGeoViewState.HIDDEN &&
+            this.hasSubscriberConnected &&
+            !this.allGeoGranted);
     }
     /** Set user geo view state (for dev controls or close button) */
     setUserGeoViewState(state) {
@@ -1511,17 +1520,34 @@ class TasVideocallComponent {
         }));
         // AllGeoGranted subscription - for owners to update panel state
         this.subscriptions.add(this.tasService.allGeoGranted$.subscribe((granted) => {
+            const previousValue = this.allGeoGranted;
             this.allGeoGranted = granted;
-            // For owners: update panel state based on geo status
+            // For owners: hide the panel when all geo is granted (including on meeting start)
             if (this.canAdmitUsers && granted) {
-                this.userGeoViewState = UserGeoViewState.VERIFIED;
+                this.userGeoViewState = UserGeoViewState.HIDDEN;
+            }
+            // If geo status changed from granted to not-granted, reset the dismissed flag
+            // so the panel can show again
+            if (this.previousAllGeoGranted === true && !granted) {
+                this.geoPanelDismissed = false;
             }
+            this.previousAllGeoGranted = granted;
         }));
         // UserGeoInfo subscription - for owner geo panel
         this.subscriptions.add(this.tasService.userGeoInfo$.subscribe((info) => {
             this.userGeoInfo = info;
-            // Note: We don't auto-switch to DENIED here - that only happens 
-            // after owner requests and user denies (via geoRequestActive flow)
+            // Check if we have actual video subscribers connected
+            // This happens when another user's video stream joins (via OpenTok)
+            const hasSubscribers = this.tasService.currentSubscribers.length > 0;
+            if (hasSubscribers && !this.hasSubscriberConnected) {
+                // First time a subscriber connected
+                this.hasSubscriberConnected = true;
+                // Show panel only when subscriber first connects, geo not granted, and not dismissed
+                if (this.canAdmitUsers && !this.allGeoGranted && !this.geoPanelDismissed) {
+                    this.userGeoViewState = UserGeoViewState.INITIAL;
+                }
+            }
+            // Panel visibility is controlled by the shouldShowUserGeoPanel getter
         }));
     }
     /**
@@ -1682,12 +1708,12 @@ class TasVideocallComponent {
         });
     }
 }
-TasVideocallComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasVideocallComponent, deps: [{ token: i1.NgbActiveModal }, { token: TasService }, { token: GeolocationService }, { token: i4$2.DomSanitizer }, { token: i1.NgbModal }], target: i0.ɵɵFactoryTarget.Component });
-TasVideocallComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: TasVideocallComponent, selector: "tas-videocall", inputs: { sessionId: "sessionId", token: "token", appointmentId: "appointmentId", videoCallId: "videoCallId", userId: "userId", participantName: "participantName", tenant: "tenant", businessRole: "businessRole", isReturningFromPip: "isReturningFromPip" }, viewQueries: [{ propertyName: "publisherContainer", first: true, predicate: ["publisherContainer"], descendants: true }, { propertyName: "subscriberContainer", first: true, predicate: ["subscriberContainer"], descendants: true }], ngImport: i0, template: "<div class=\"tas-videocall-wrapper\">\n  <div class=\"tas-videocall-container\">\n    <!-- Subscriber video (large, background) -->\n    <div\n      id=\"subscriber-container\"\n      [class.subscriber-view]=\"isPublisherSmall\"\n      [class.publisher-view]=\"!isPublisherSmall\"\n      #subscriberContainer\n      (dblclick)=\"onDoubleClick()\"\n    ></div>\n\n    <!-- Publisher video (small, overlay) -->\n    <div\n      id=\"publisher-container\"\n      [class.publisher-view]=\"isPublisherSmall\"\n      [class.subscriber-view]=\"!isPublisherSmall\"\n      #publisherContainer\n      (dblclick)=\"onDoubleClick()\"\n    ></div>\n\n    <!-- Centered avatar (shown when no video stream) -->\n    <div class=\"avatar-container\" *ngIf=\"!hasVideoStream\">\n      <tas-avatar [name]=\"participantName\" [size]=\"80\"></tas-avatar>\n    </div>\n\n    <!-- Controls -->\n    <div class=\"controls-container\">\n      <button\n        class=\"btn control-btn mute-btn\"\n        [class.muted]=\"isMuted\"\n        (click)=\"toggleMute()\"\n        [title]=\"isMuted ? 'Activar micr\u00F3fono' : 'Silenciar micr\u00F3fono'\"\n        [attr.aria-label]=\"isMuted ? 'Activar micr\u00F3fono' : 'Silenciar micr\u00F3fono'\"\n      >\n        <i\n          class=\"fa\"\n          [class.fa-microphone]=\"!isMuted\"\n          [class.fa-microphone-slash]=\"isMuted\"\n        ></i>\n      </button>\n      <button\n        class=\"btn control-btn swap-btn\"\n        (click)=\"toggleSwap()\"\n        title=\"Intercambiar vista\"\n        aria-label=\"Intercambiar vista\"\n      >\n        <i class=\"fa fa-refresh\"></i>\n      </button>\n      <button\n        class=\"btn control-btn pip-btn\"\n        (click)=\"minimize()\"\n        title=\"Minimizar (Picture in Picture)\"\n        aria-label=\"Minimizar videollamada\"\n      >\n        <i class=\"fa fa-compress\"></i>\n      </button>\n      <button\n        class=\"btn control-btn hangup-btn\"\n        (click)=\"hangUp()\"\n        title=\"Finalizar llamada\"\n        aria-label=\"Finalizar llamada\"\n      >\n        <i class=\"fa fa-phone\"></i>\n      </button>\n    </div>\n\n    <!-- Waiting room notification (shown for OWNER/BACKOFFICE only) -->\n    <div\n      class=\"waiting-notification\"\n      *ngIf=\"waitingRoomUsers.length > 0 && canAdmitUsers\"\n      role=\"alert\"\n      aria-live=\"polite\"\n    >\n      <span class=\"waiting-text\">\n        {{ waitingRoomUsers[0].name }} est\u00E1 en la sala de espera.\n      </span>\n      <button\n        class=\"admit-btn\"\n        (click)=\"admitUser(waitingRoomUsers[0].userId)\"\n        aria-label=\"Admitir usuario\"\n      >\n        Admitir\n      </button>\n      <button\n        class=\"dismiss-btn\"\n        (click)=\"dismissWaitingNotification(waitingRoomUsers[0].userId)\"\n        aria-label=\"Cerrar notificaci\u00F3n\"\n      >\n        \u00D7\n      </button>\n    </div>\n  </div>\n\n  <!-- Owner geolocation panel (for owners to request user location) -->\n  <div class=\"user-geo-panel\" *ngIf=\"shouldShowUserGeoPanel || devModeEnabled\">\n    <div class=\"user-geo-header\">\n      <div class=\"header-title-row\">\n        <i class=\"fa fa-map-marker header-icon\" *ngIf=\"userGeoViewState !== UserGeoViewState.INITIAL\"></i>\n        <h3>Ubicaci\u00F3n del colaborador</h3>\n      </div>\n      <button class=\"close-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.HIDDEN)\" aria-label=\"Cerrar\">\u00D7</button>\n    </div>\n\n    <div class=\"user-geo-description\" *ngIf=\"userGeoViewState !== UserGeoViewState.VERIFIED && userGeoViewState !== UserGeoViewState.DENIED\">\n      <p>El colaborador tiene la ubicaci\u00F3n desactivada, solicita que la active.</p>\n      <p>Esta acci\u00F3n nos permitir\u00E1 disponibilizar algunas alertas.</p>\n    </div>\n\n    <div class=\"user-geo-content\">\n      <!-- INITIAL state: just the button -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.INITIAL\">\n        <!-- spacer -->\n      </ng-container>\n\n      <!-- VERIFYING state: spinner + loading message -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.VERIFYING\">\n        <div class=\"user-geo-verifying\">\n          <div class=\"geo-spinner-large\"></div>\n          <p class=\"verifying-title\">Verificando ubicaci\u00F3n...</p>\n          <p class=\"verifying-subtitle\">Esto puede tardar unos segundos.</p>\n        </div>\n      </ng-container>\n\n      <!-- VERIFIED state: home icon with sparkles -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.VERIFIED\">\n        <div class=\"user-geo-verified\">\n          <div class=\"verified-icon-container\">\n            <span class=\"home-icon\" [innerHTML]=\"homeIcon\"></span>\n          </div>\n          <p class=\"verified-title\">La ubicaci\u00F3n fue verificada</p>\n        </div>\n      </ng-container>\n\n      <!-- DENIED state: error icon and message -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.DENIED\">\n        <div class=\"user-geo-denied\">\n          <div class=\"denied-icon-container\">\n            <i class=\"fa fa-times-circle\"></i>\n          </div>\n          <p class=\"denied-title\">La ubicaci\u00F3n fue rechazada</p>\n          <p class=\"denied-subtitle\">El colaborador no permiti\u00F3 el acceso a su ubicaci\u00F3n.</p>\n        </div>\n      </ng-container>\n    </div>\n\n    <!-- Button (hidden in verified and denied states) -->\n    <button \n      class=\"user-geo-btn\" \n      *ngIf=\"userGeoViewState !== UserGeoViewState.VERIFIED && userGeoViewState !== UserGeoViewState.DENIED\"\n      [class.disabled]=\"userGeoViewState === UserGeoViewState.VERIFYING\"\n      [disabled]=\"userGeoViewState === UserGeoViewState.VERIFYING\"\n      (click)=\"requestUserLocation()\">\n      Verificar ubicaci\u00F3n\n    </button>\n\n    <!-- Dev controls -->\n    <div class=\"dev-controls\" *ngIf=\"devModeEnabled\">\n      <span class=\"dev-label\">Dev:</span>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.INITIAL)\">Initial</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.VERIFYING)\">Verifying</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.VERIFIED)\">Verified</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.DENIED)\">Denied</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.HIDDEN)\">Hide</button>\n    </div>\n  </div>\n</div>\n\n", styles: ["@charset \"UTF-8\";:host{display:flex;width:100vw;height:100vh;box-sizing:border-box;padding:2rem;background:linear-gradient(281deg,rgba(29,164,177,.2) 6.96%,rgba(0,0,0,0) 70.44%),#212532}.tas-videocall-wrapper{display:flex;flex:1;gap:1rem;height:100%}.tas-videocall-container{position:relative;flex:1;height:100%;overflow:hidden;border-radius:8px;border:1px solid var(--Neutral-GreyLight, #dadfe9);background:linear-gradient(180deg,#e5f1f7 0%,#0072ac 100%)}.tas-videocall-container ::ng-deep .OT_edge-bar-item,.tas-videocall-container ::ng-deep .OT_mute,.tas-videocall-container ::ng-deep .OT_audio-level-meter,.tas-videocall-container ::ng-deep .OT_bar,.tas-videocall-container ::ng-deep .OT_name{display:none!important}.tas-videocall-container .subscriber-view{width:100%;height:100%;z-index:1}.tas-videocall-container .publisher-view{position:absolute;top:20px;right:20px;width:200px;height:150px;z-index:2;border:2px solid #fff;border-radius:8px;background-color:#0000004d;overflow:hidden}.tas-videocall-container .avatar-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;display:flex;align-items:center;justify-content:center}.tas-videocall-container .controls-container{display:flex;flex-direction:row;gap:12px;position:absolute;bottom:30px;left:50%;transform:translate(-50%);z-index:3;background-color:#33475bb3;padding:12px 20px;border-radius:30px;backdrop-filter:blur(8px)}.tas-videocall-container .controls-container .control-btn{width:44px;height:44px;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:18px;border:none;background:transparent;cursor:pointer;transition:all .2s ease}.tas-videocall-container .controls-container .control-btn i{color:#fff}.tas-videocall-container .controls-container .control-btn:hover{transform:scale(1.05);filter:brightness(1.1)}.tas-videocall-container .controls-container .control-btn:focus{outline:2px solid #fff;outline-offset:2px}.tas-videocall-container .controls-container .hangup-btn{background:#f44336}.tas-videocall-container .controls-container .hangup-btn i{transform:rotate(135deg)}.tas-videocall-container .controls-container .hangup-btn:hover{background:#d32f2f}.tas-videocall-container .controls-container .swap-btn,.tas-videocall-container .controls-container .pip-btn,.tas-videocall-container .controls-container .mute-btn{background:transparent}.tas-videocall-container .controls-container .swap-btn:hover,.tas-videocall-container .controls-container .pip-btn:hover,.tas-videocall-container .controls-container .mute-btn:hover{background:rgba(255,255,255,.15)}.tas-videocall-container .waiting-notification{position:absolute;bottom:100px;left:16px;display:flex;align-items:center;gap:12px;background-color:#33475be6;padding:10px 16px;border-radius:8px;z-index:4;backdrop-filter:blur(4px);max-width:calc(100% - 32px)}.tas-videocall-container .waiting-notification .waiting-text{color:#fff;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tas-videocall-container .waiting-notification .admit-btn{background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:4px;padding:6px 16px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s ease;white-space:nowrap}.tas-videocall-container .waiting-notification .admit-btn:hover{background:#178e99}.tas-videocall-container .waiting-notification .admit-btn:focus{outline:2px solid #fff;outline-offset:2px}.tas-videocall-container .waiting-notification .dismiss-btn{background:transparent;color:#fff;border:none;font-size:20px;line-height:1;cursor:pointer;padding:0 4px;opacity:.7;transition:opacity .2s ease}.tas-videocall-container .waiting-notification .dismiss-btn:hover{opacity:1}.tas-videocall-container .waiting-notification .dismiss-btn:focus{outline:2px solid #fff;outline-offset:2px}.location-panel{width:280px;height:100%;background:#212532;border-radius:8px;padding:1.5rem;display:flex;flex-direction:column;color:#fff}.location-panel .location-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.location-panel .location-header h3{font-size:16px;font-weight:600;margin:0;color:#fff}.location-panel .location-header .close-btn{background:transparent;border:none;color:#fff;font-size:20px;cursor:pointer;padding:0;line-height:1;opacity:.7}.location-panel .location-header .close-btn:hover{opacity:1}.location-panel .location-description{font-size:14px;color:#fffc;line-height:1.5;margin-bottom:.5rem}.location-panel .location-description p{margin:0 0 .5rem}.location-panel .location-user-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;max-height:200px;overflow-y:auto}.location-panel .location-user-list .user-geo-item{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;background:rgba(255,255,255,.05);border-radius:6px}.location-panel .location-user-list .user-geo-item .user-icon{color:#fff9;font-size:14px}.location-panel .location-user-list .user-geo-item .user-name{flex:1;font-size:14px;color:#fff}.location-panel .location-user-list .user-geo-item .geo-status{display:flex;align-items:center;gap:.35rem;font-size:12px;padding:2px 8px;border-radius:12px}.location-panel .location-user-list .user-geo-item .geo-status.pending{color:#ffc107;background:rgba(255,193,7,.15)}.location-panel .location-user-list .user-geo-item .geo-status.granted{color:#4caf50;background:rgba(76,175,80,.15)}.location-panel .location-user-list .user-geo-item .geo-status.denied{color:#f44336;background:rgba(244,67,54,.15)}.location-panel .location-user-list .user-geo-item .geo-status i{font-size:10px}.location-panel .geo-denied-warning{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:rgba(244,67,54,.15);border-radius:6px;margin-bottom:1rem;color:#f44336;font-size:13px}.location-panel .geo-denied-warning i{font-size:14px}.location-panel .location-content{flex:1;display:flex;flex-direction:column;justify-content:flex-end}.location-panel .verify-location-btn{width:100%;padding:12px 24px;background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s ease;margin-bottom:1rem}.location-panel .verify-location-btn:hover{background:#178e99}.location-panel .verify-location-btn:disabled{background:rgba(29,164,177,.5);cursor:not-allowed}.location-panel .location-footer{display:flex;justify-content:flex-end;gap:.5rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.1)}.location-panel .location-footer .footer-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:#fff;font-size:14px}.location-panel .location-footer .footer-icon.location-icon{background:var(--Primary-Uell, #1da4b1)}.location-panel .header-icon{color:#fff;font-size:16px}.location-panel .geo-loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 0}.location-panel .geo-loading-container .geo-spinner{width:64px;height:64px;border:4px solid rgba(29,164,177,.2);border-top-color:var(--Primary-Uell, #1da4b1);border-radius:50%;animation:geo-spin 1s linear infinite}.location-panel .geo-loading-container .loading-title{color:#fff;font-size:16px;font-weight:600;margin:1.5rem 0 .25rem}.location-panel .geo-loading-container .loading-subtitle{color:#ffffffb3;font-size:14px;margin:0}.location-panel .geo-success-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 0}.location-panel .geo-success-container .success-icon{width:80px;height:80px;border-radius:50%;background:var(--Primary-Uell, #1da4b1);display:flex;align-items:center;justify-content:center;position:relative}.location-panel .geo-success-container .success-icon i{color:#fff;font-size:32px}.location-panel .geo-success-container .success-icon:before,.location-panel .geo-success-container .success-icon:after{content:\"\\2726\";position:absolute;color:#fff;font-size:10px}.location-panel .geo-success-container .success-icon:before{top:-8px;right:-4px}.location-panel .geo-success-container .success-icon:after{bottom:-4px;left:-8px}.location-panel .geo-success-container .success-title{color:#fff;font-size:16px;font-weight:600;margin:1.5rem 0 0}.location-panel .verify-location-btn.disabled{background:rgba(29,164,177,.5);cursor:not-allowed}@keyframes geo-spin{to{transform:rotate(360deg)}}.user-geo-panel{width:360px;height:100%;background:#212532;border-radius:8px;padding:1.5rem;display:flex;flex-direction:column;color:#fff}.user-geo-panel .user-geo-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2.5rem;padding-top:2rem}.user-geo-panel .user-geo-header .header-title-row{display:flex;align-items:center;gap:.5rem}.user-geo-panel .user-geo-header .header-title-row .header-icon{font-size:16px;color:#fff}.user-geo-panel .user-geo-header .header-title-row h3{font-size:18px;font-weight:600;margin:0;color:#fff}.user-geo-panel .user-geo-header .close-btn{background:transparent;border:none;color:#fff;font-size:20px;cursor:pointer;padding:0;line-height:1;opacity:.7}.user-geo-panel .user-geo-header .close-btn:hover{opacity:1}.user-geo-panel .user-geo-description{font-size:14px;color:#fffc;line-height:1.6;margin-bottom:1rem}.user-geo-panel .user-geo-description p{margin:0 0 .75rem}.user-geo-panel .user-geo-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.user-geo-panel .user-geo-verifying{display:flex;flex-direction:column;align-items:center;text-align:center}.user-geo-panel .user-geo-verifying .geo-spinner-large{width:80px;height:80px;border:4px solid rgba(29,164,177,.2);border-top-color:var(--Primary-Uell, #1da4b1);border-radius:50%;animation:geo-spin 1s linear infinite;margin-bottom:1.5rem}.user-geo-panel .user-geo-verifying .verifying-title{color:#fff;font-size:16px;font-weight:600;margin:0 0 .25rem}.user-geo-panel .user-geo-verifying .verifying-subtitle{color:#fff9;font-size:14px;margin:0}.user-geo-panel .user-geo-verified{display:flex;flex-direction:column;align-items:center;text-align:center}.user-geo-panel .user-geo-verified .verified-icon-container{margin-bottom:1rem}.user-geo-panel .user-geo-verified .verified-icon-container .home-icon{display:block}.user-geo-panel .user-geo-verified .verified-icon-container .home-icon svg{width:120px;height:100px}.user-geo-panel .user-geo-verified .verified-title{color:#fff;font-size:16px;font-weight:600;margin:0}.user-geo-panel .user-geo-denied{display:flex;flex-direction:column;align-items:center;text-align:center}.user-geo-panel .user-geo-denied .denied-icon-container{width:100px;height:100px;border-radius:50%;background:rgba(244,67,54,.2);display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem}.user-geo-panel .user-geo-denied .denied-icon-container i{font-size:48px;color:#f44336}.user-geo-panel .user-geo-denied .denied-title{color:#fff;font-size:16px;font-weight:600;margin:0 0 .5rem}.user-geo-panel .user-geo-denied .denied-subtitle{color:#fff9;font-size:14px;margin:0}.user-geo-panel .user-geo-btn{width:100%;padding:14px 24px;background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:24px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:auto;margin-bottom:1rem}.user-geo-panel .user-geo-btn:hover:not(.disabled){background:#178e99}.user-geo-panel .user-geo-btn.disabled{background:rgba(29,164,177,.5);cursor:not-allowed}.user-geo-panel .dev-controls{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:rgba(0,0,0,.3);border-radius:6px;margin-bottom:1rem;flex-wrap:wrap}.user-geo-panel .dev-controls .dev-label{font-size:12px;color:#fff9;font-weight:600}.user-geo-panel .dev-controls .dev-btn{padding:4px 8px;font-size:11px;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:4px;cursor:pointer;transition:all .2s ease}.user-geo-panel .dev-controls .dev-btn:hover{background:rgba(255,255,255,.2)}.user-geo-panel .user-geo-footer{display:flex;justify-content:center;gap:.75rem;padding-top:.5rem}.user-geo-panel .user-geo-footer .footer-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:#fff9;font-size:16px}.user-geo-panel .user-geo-footer .footer-icon.active{background:var(--Primary-Uell, #1da4b1);color:#fff}\n"], components: [{ type: TasAvatarComponent, selector: "tas-avatar", inputs: ["name", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TasVideocallComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasVideocallComponent, deps: [{ token: i1.NgbActiveModal }, { token: TasService }, { token: GeolocationService }, { token: i4$1.DomSanitizer }, { token: i1.NgbModal }], target: i0.ɵɵFactoryTarget.Component });
+TasVideocallComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: TasVideocallComponent, selector: "tas-videocall", inputs: { sessionId: "sessionId", token: "token", appointmentId: "appointmentId", videoCallId: "videoCallId", userId: "userId", participantName: "participantName", tenant: "tenant", businessRole: "businessRole", isReturningFromPip: "isReturningFromPip" }, viewQueries: [{ propertyName: "publisherContainer", first: true, predicate: ["publisherContainer"], descendants: true }, { propertyName: "subscriberContainer", first: true, predicate: ["subscriberContainer"], descendants: true }], ngImport: i0, template: "<div class=\"tas-videocall-wrapper\">\n  <div class=\"tas-videocall-container\">\n    <!-- Subscriber video (large, background) -->\n    <div\n      id=\"subscriber-container\"\n      [class.subscriber-view]=\"isPublisherSmall\"\n      [class.publisher-view]=\"!isPublisherSmall\"\n      #subscriberContainer\n      (dblclick)=\"onDoubleClick()\"\n    ></div>\n\n    <!-- Publisher video (small, overlay) -->\n    <div\n      id=\"publisher-container\"\n      [class.publisher-view]=\"isPublisherSmall\"\n      [class.subscriber-view]=\"!isPublisherSmall\"\n      #publisherContainer\n      (dblclick)=\"onDoubleClick()\"\n    ></div>\n\n    <!-- Centered avatar (shown when no video stream) -->\n    <div class=\"avatar-container\" *ngIf=\"!hasVideoStream\">\n      <tas-avatar [name]=\"participantName\" [size]=\"80\"></tas-avatar>\n    </div>\n\n    <!-- Controls -->\n    <div class=\"controls-container\">\n      <button\n        class=\"btn control-btn mute-btn\"\n        [class.muted]=\"isMuted\"\n        (click)=\"toggleMute()\"\n        [title]=\"isMuted ? 'Activar micr\u00F3fono' : 'Silenciar micr\u00F3fono'\"\n        [attr.aria-label]=\"isMuted ? 'Activar micr\u00F3fono' : 'Silenciar micr\u00F3fono'\"\n      >\n        <i\n          class=\"fa\"\n          [class.fa-microphone]=\"!isMuted\"\n          [class.fa-microphone-slash]=\"isMuted\"\n        ></i>\n      </button>\n      <button\n        class=\"btn control-btn swap-btn\"\n        (click)=\"toggleSwap()\"\n        title=\"Intercambiar vista\"\n        aria-label=\"Intercambiar vista\"\n      >\n        <i class=\"fa fa-refresh\"></i>\n      </button>\n      <button\n        class=\"btn control-btn pip-btn\"\n        (click)=\"minimize()\"\n        title=\"Minimizar (Picture in Picture)\"\n        aria-label=\"Minimizar videollamada\"\n      >\n        <i class=\"fa fa-compress\"></i>\n      </button>\n      <button\n        class=\"btn control-btn hangup-btn\"\n        (click)=\"hangUp()\"\n        title=\"Finalizar llamada\"\n        aria-label=\"Finalizar llamada\"\n      >\n        <i class=\"fa fa-phone\"></i>\n      </button>\n    </div>\n\n    <!-- Waiting room notification (shown for OWNER/BACKOFFICE only) -->\n    <div\n      class=\"waiting-notification\"\n      *ngIf=\"waitingRoomUsers.length > 0 && canAdmitUsers\"\n      role=\"alert\"\n      aria-live=\"polite\"\n    >\n      <span class=\"waiting-text\">\n        {{ waitingRoomUsers[0].name }} est\u00E1 en la sala de espera.\n      </span>\n      <button\n        class=\"admit-btn\"\n        (click)=\"admitUser(waitingRoomUsers[0].userId)\"\n        aria-label=\"Admitir usuario\"\n      >\n        Admitir\n      </button>\n      <button\n        class=\"dismiss-btn\"\n        (click)=\"dismissWaitingNotification(waitingRoomUsers[0].userId)\"\n        aria-label=\"Cerrar notificaci\u00F3n\"\n      >\n        \u00D7\n      </button>\n    </div>\n  </div>\n\n  <!-- Owner geolocation panel (for owners to request user location) -->\n  <div class=\"user-geo-panel\" *ngIf=\"shouldShowUserGeoPanel || devModeEnabled\">\n    <div class=\"user-geo-header\">\n      <div class=\"header-title-row\">\n        <i class=\"fa fa-map-marker header-icon\" *ngIf=\"userGeoViewState !== UserGeoViewState.INITIAL\"></i>\n        <h3>Ubicaci\u00F3n del colaborador</h3>\n      </div>\n      <button class=\"close-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.HIDDEN)\" aria-label=\"Cerrar\">\u00D7</button>\n    </div>\n\n    <div class=\"user-geo-description\" *ngIf=\"userGeoViewState !== UserGeoViewState.VERIFIED && userGeoViewState !== UserGeoViewState.DENIED\">\n      <p>El colaborador tiene la ubicaci\u00F3n desactivada, solicita que la active.</p>\n      <p>Esta acci\u00F3n nos permitir\u00E1 disponibilizar algunas alertas.</p>\n    </div>\n\n    <div class=\"user-geo-content\">\n      <!-- INITIAL state: just the button -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.INITIAL\">\n        <!-- spacer -->\n      </ng-container>\n\n      <!-- VERIFYING state: spinner + loading message -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.VERIFYING\">\n        <div class=\"user-geo-verifying\">\n          <div class=\"geo-spinner-large\"></div>\n          <p class=\"verifying-title\">Verificando ubicaci\u00F3n...</p>\n          <p class=\"verifying-subtitle\">Esto puede tardar unos segundos.</p>\n        </div>\n      </ng-container>\n\n      <!-- VERIFIED state: home icon with sparkles -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.VERIFIED\">\n        <div class=\"user-geo-verified\">\n          <div class=\"verified-icon-container\">\n            <span class=\"home-icon\" [innerHTML]=\"homeIcon\"></span>\n          </div>\n          <p class=\"verified-title\">La ubicaci\u00F3n fue verificada</p>\n        </div>\n      </ng-container>\n\n      <!-- DENIED state: error icon and message -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.DENIED\">\n        <div class=\"user-geo-denied\">\n          <div class=\"denied-icon-container\">\n            <i class=\"fa fa-times-circle\"></i>\n          </div>\n          <p class=\"denied-title\">La ubicaci\u00F3n fue rechazada</p>\n          <p class=\"denied-subtitle\">El colaborador no permiti\u00F3 el acceso a su ubicaci\u00F3n.</p>\n        </div>\n      </ng-container>\n    </div>\n\n    <!-- Button (hidden in verified and denied states) -->\n    <button \n      class=\"user-geo-btn\" \n      *ngIf=\"userGeoViewState !== UserGeoViewState.VERIFIED && userGeoViewState !== UserGeoViewState.DENIED\"\n      [class.disabled]=\"userGeoViewState === UserGeoViewState.VERIFYING\"\n      [disabled]=\"userGeoViewState === UserGeoViewState.VERIFYING\"\n      (click)=\"requestUserLocation()\">\n      Verificar ubicaci\u00F3n\n    </button>\n\n    <!-- Dev controls -->\n    <div class=\"dev-controls\" *ngIf=\"devModeEnabled\">\n      <span class=\"dev-label\">Dev:</span>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.INITIAL)\">Initial</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.VERIFYING)\">Verifying</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.VERIFIED)\">Verified</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.DENIED)\">Denied</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.HIDDEN)\">Hide</button>\n    </div>\n  </div>\n</div>\n\n", styles: ["@charset \"UTF-8\";:host{display:flex;width:100vw;height:100vh;box-sizing:border-box;padding:2rem;background:linear-gradient(281deg,rgba(29,164,177,.2) 6.96%,rgba(0,0,0,0) 70.44%),#212532}.tas-videocall-wrapper{display:flex;flex:1;gap:1rem;height:100%}.tas-videocall-container{position:relative;flex:1;height:100%;overflow:hidden;border-radius:8px;border:1px solid var(--Neutral-GreyLight, #dadfe9);background:linear-gradient(180deg,#e5f1f7 0%,#0072ac 100%)}.tas-videocall-container ::ng-deep .OT_edge-bar-item,.tas-videocall-container ::ng-deep .OT_mute,.tas-videocall-container ::ng-deep .OT_audio-level-meter,.tas-videocall-container ::ng-deep .OT_bar,.tas-videocall-container ::ng-deep .OT_name{display:none!important}.tas-videocall-container .subscriber-view{width:100%;height:100%;z-index:1}.tas-videocall-container .publisher-view{position:absolute;top:20px;right:20px;width:200px;height:150px;z-index:2;border:2px solid #fff;border-radius:8px;background-color:#0000004d;overflow:hidden}.tas-videocall-container .avatar-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;display:flex;align-items:center;justify-content:center}.tas-videocall-container .controls-container{display:flex;flex-direction:row;gap:12px;position:absolute;bottom:30px;left:50%;transform:translate(-50%);z-index:3;background-color:#33475bb3;padding:12px 20px;border-radius:30px;backdrop-filter:blur(8px)}.tas-videocall-container .controls-container .control-btn{width:44px;height:44px;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:18px;border:none;background:transparent;cursor:pointer;transition:all .2s ease}.tas-videocall-container .controls-container .control-btn i{color:#fff}.tas-videocall-container .controls-container .control-btn:hover{transform:scale(1.05);filter:brightness(1.1)}.tas-videocall-container .controls-container .control-btn:focus{outline:2px solid #fff;outline-offset:2px}.tas-videocall-container .controls-container .hangup-btn{background:#f44336}.tas-videocall-container .controls-container .hangup-btn i{transform:rotate(135deg)}.tas-videocall-container .controls-container .hangup-btn:hover{background:#d32f2f}.tas-videocall-container .controls-container .swap-btn,.tas-videocall-container .controls-container .pip-btn,.tas-videocall-container .controls-container .mute-btn{background:transparent}.tas-videocall-container .controls-container .swap-btn:hover,.tas-videocall-container .controls-container .pip-btn:hover,.tas-videocall-container .controls-container .mute-btn:hover{background:rgba(255,255,255,.15)}.tas-videocall-container .waiting-notification{position:absolute;bottom:100px;left:16px;display:flex;align-items:center;gap:12px;background-color:#33475be6;padding:10px 16px;border-radius:8px;z-index:4;backdrop-filter:blur(4px);max-width:calc(100% - 32px)}.tas-videocall-container .waiting-notification .waiting-text{color:#fff;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tas-videocall-container .waiting-notification .admit-btn{background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:4px;padding:6px 16px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s ease;white-space:nowrap}.tas-videocall-container .waiting-notification .admit-btn:hover{background:#178e99}.tas-videocall-container .waiting-notification .admit-btn:focus{outline:2px solid #fff;outline-offset:2px}.tas-videocall-container .waiting-notification .dismiss-btn{background:transparent;color:#fff;border:none;font-size:20px;line-height:1;cursor:pointer;padding:0 4px;opacity:.7;transition:opacity .2s ease}.tas-videocall-container .waiting-notification .dismiss-btn:hover{opacity:1}.tas-videocall-container .waiting-notification .dismiss-btn:focus{outline:2px solid #fff;outline-offset:2px}.location-panel{width:280px;height:100%;background:#212532;border-radius:8px;padding:1.5rem;display:flex;flex-direction:column;color:#fff}.location-panel .location-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.location-panel .location-header h3{font-size:16px;font-weight:600;margin:0;color:#fff}.location-panel .location-header .close-btn{background:transparent;border:none;color:#fff;font-size:20px;cursor:pointer;padding:0;line-height:1;opacity:.7}.location-panel .location-header .close-btn:hover{opacity:1}.location-panel .location-description{font-size:14px;color:#fffc;line-height:1.5;margin-bottom:.5rem}.location-panel .location-description p{margin:0 0 .5rem}.location-panel .location-user-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;max-height:200px;overflow-y:auto}.location-panel .location-user-list .user-geo-item{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;background:rgba(255,255,255,.05);border-radius:6px}.location-panel .location-user-list .user-geo-item .user-icon{color:#fff9;font-size:14px}.location-panel .location-user-list .user-geo-item .user-name{flex:1;font-size:14px;color:#fff}.location-panel .location-user-list .user-geo-item .geo-status{display:flex;align-items:center;gap:.35rem;font-size:12px;padding:2px 8px;border-radius:12px}.location-panel .location-user-list .user-geo-item .geo-status.pending{color:#ffc107;background:rgba(255,193,7,.15)}.location-panel .location-user-list .user-geo-item .geo-status.granted{color:#4caf50;background:rgba(76,175,80,.15)}.location-panel .location-user-list .user-geo-item .geo-status.denied{color:#f44336;background:rgba(244,67,54,.15)}.location-panel .location-user-list .user-geo-item .geo-status i{font-size:10px}.location-panel .geo-denied-warning{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:rgba(244,67,54,.15);border-radius:6px;margin-bottom:1rem;color:#f44336;font-size:13px}.location-panel .geo-denied-warning i{font-size:14px}.location-panel .location-content{flex:1;display:flex;flex-direction:column;justify-content:flex-end}.location-panel .verify-location-btn{width:100%;padding:12px 24px;background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s ease;margin-bottom:1rem}.location-panel .verify-location-btn:hover{background:#178e99}.location-panel .verify-location-btn:disabled{background:rgba(29,164,177,.5);cursor:not-allowed}.location-panel .location-footer{display:flex;justify-content:flex-end;gap:.5rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.1)}.location-panel .location-footer .footer-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:#fff;font-size:14px}.location-panel .location-footer .footer-icon.location-icon{background:var(--Primary-Uell, #1da4b1)}.location-panel .header-icon{color:#fff;font-size:16px}.location-panel .geo-loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 0}.location-panel .geo-loading-container .geo-spinner{width:64px;height:64px;border:4px solid rgba(29,164,177,.2);border-top-color:var(--Primary-Uell, #1da4b1);border-radius:50%;animation:geo-spin 1s linear infinite}.location-panel .geo-loading-container .loading-title{color:#fff;font-size:16px;font-weight:600;margin:1.5rem 0 .25rem}.location-panel .geo-loading-container .loading-subtitle{color:#ffffffb3;font-size:14px;margin:0}.location-panel .geo-success-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 0}.location-panel .geo-success-container .success-icon{width:80px;height:80px;border-radius:50%;background:var(--Primary-Uell, #1da4b1);display:flex;align-items:center;justify-content:center;position:relative}.location-panel .geo-success-container .success-icon i{color:#fff;font-size:32px}.location-panel .geo-success-container .success-icon:before,.location-panel .geo-success-container .success-icon:after{content:\"\\2726\";position:absolute;color:#fff;font-size:10px}.location-panel .geo-success-container .success-icon:before{top:-8px;right:-4px}.location-panel .geo-success-container .success-icon:after{bottom:-4px;left:-8px}.location-panel .geo-success-container .success-title{color:#fff;font-size:16px;font-weight:600;margin:1.5rem 0 0}.location-panel .verify-location-btn.disabled{background:rgba(29,164,177,.5);cursor:not-allowed}@keyframes geo-spin{to{transform:rotate(360deg)}}.user-geo-panel{width:360px;height:100%;background:#212532;border-radius:8px;padding:1.5rem;display:flex;flex-direction:column;color:#fff}.user-geo-panel .user-geo-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2.5rem;padding-top:2rem}.user-geo-panel .user-geo-header .header-title-row{display:flex;align-items:center;gap:.5rem}.user-geo-panel .user-geo-header .header-title-row .header-icon{font-size:16px;color:#fff}.user-geo-panel .user-geo-header .header-title-row h3{font-size:18px;font-weight:600;margin:0;color:#fff}.user-geo-panel .user-geo-header .close-btn{background:transparent;border:none;color:#fff;font-size:20px;cursor:pointer;padding:0;line-height:1;opacity:.7}.user-geo-panel .user-geo-header .close-btn:hover{opacity:1}.user-geo-panel .user-geo-description{font-size:14px;color:#fffc;line-height:1.6;margin-bottom:1rem}.user-geo-panel .user-geo-description p{margin:0 0 .75rem}.user-geo-panel .user-geo-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.user-geo-panel .user-geo-verifying{display:flex;flex-direction:column;align-items:center;text-align:center}.user-geo-panel .user-geo-verifying .geo-spinner-large{width:80px;height:80px;border:4px solid rgba(29,164,177,.2);border-top-color:var(--Primary-Uell, #1da4b1);border-radius:50%;animation:geo-spin 1s linear infinite;margin-bottom:1.5rem}.user-geo-panel .user-geo-verifying .verifying-title{color:#fff;font-size:16px;font-weight:600;margin:0 0 .25rem}.user-geo-panel .user-geo-verifying .verifying-subtitle{color:#fff9;font-size:14px;margin:0}.user-geo-panel .user-geo-verified{display:flex;flex-direction:column;align-items:center;text-align:center}.user-geo-panel .user-geo-verified .verified-icon-container{margin-bottom:1rem}.user-geo-panel .user-geo-verified .verified-icon-container .home-icon{display:block}.user-geo-panel .user-geo-verified .verified-icon-container .home-icon svg{width:120px;height:100px}.user-geo-panel .user-geo-verified .verified-title{color:#fff;font-size:16px;font-weight:600;margin:0}.user-geo-panel .user-geo-denied{display:flex;flex-direction:column;align-items:center;text-align:center}.user-geo-panel .user-geo-denied .denied-icon-container{width:100px;height:100px;border-radius:50%;background:rgba(244,67,54,.2);display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem}.user-geo-panel .user-geo-denied .denied-icon-container i{font-size:48px;color:#f44336}.user-geo-panel .user-geo-denied .denied-title{color:#fff;font-size:16px;font-weight:600;margin:0 0 .5rem}.user-geo-panel .user-geo-denied .denied-subtitle{color:#fff9;font-size:14px;margin:0}.user-geo-panel .user-geo-btn{width:100%;padding:14px 24px;background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:24px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:auto;margin-bottom:1rem}.user-geo-panel .user-geo-btn:hover:not(.disabled){background:#178e99}.user-geo-panel .user-geo-btn.disabled{background:rgba(29,164,177,.5);cursor:not-allowed}.user-geo-panel .dev-controls{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:rgba(0,0,0,.3);border-radius:6px;margin-bottom:1rem;flex-wrap:wrap}.user-geo-panel .dev-controls .dev-label{font-size:12px;color:#fff9;font-weight:600}.user-geo-panel .dev-controls .dev-btn{padding:4px 8px;font-size:11px;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:4px;cursor:pointer;transition:all .2s ease}.user-geo-panel .dev-controls .dev-btn:hover{background:rgba(255,255,255,.2)}.user-geo-panel .user-geo-footer{display:flex;justify-content:center;gap:.75rem;padding-top:.5rem}.user-geo-panel .user-geo-footer .footer-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:#fff9;font-size:16px}.user-geo-panel .user-geo-footer .footer-icon.active{background:var(--Primary-Uell, #1da4b1);color:#fff}\n"], components: [{ type: TasAvatarComponent, selector: "tas-avatar", inputs: ["name", "size"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasVideocallComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tas-videocall', template: "<div class=\"tas-videocall-wrapper\">\n  <div class=\"tas-videocall-container\">\n    <!-- Subscriber video (large, background) -->\n    <div\n      id=\"subscriber-container\"\n      [class.subscriber-view]=\"isPublisherSmall\"\n      [class.publisher-view]=\"!isPublisherSmall\"\n      #subscriberContainer\n      (dblclick)=\"onDoubleClick()\"\n    ></div>\n\n    <!-- Publisher video (small, overlay) -->\n    <div\n      id=\"publisher-container\"\n      [class.publisher-view]=\"isPublisherSmall\"\n      [class.subscriber-view]=\"!isPublisherSmall\"\n      #publisherContainer\n      (dblclick)=\"onDoubleClick()\"\n    ></div>\n\n    <!-- Centered avatar (shown when no video stream) -->\n    <div class=\"avatar-container\" *ngIf=\"!hasVideoStream\">\n      <tas-avatar [name]=\"participantName\" [size]=\"80\"></tas-avatar>\n    </div>\n\n    <!-- Controls -->\n    <div class=\"controls-container\">\n      <button\n        class=\"btn control-btn mute-btn\"\n        [class.muted]=\"isMuted\"\n        (click)=\"toggleMute()\"\n        [title]=\"isMuted ? 'Activar micr\u00F3fono' : 'Silenciar micr\u00F3fono'\"\n        [attr.aria-label]=\"isMuted ? 'Activar micr\u00F3fono' : 'Silenciar micr\u00F3fono'\"\n      >\n        <i\n          class=\"fa\"\n          [class.fa-microphone]=\"!isMuted\"\n          [class.fa-microphone-slash]=\"isMuted\"\n        ></i>\n      </button>\n      <button\n        class=\"btn control-btn swap-btn\"\n        (click)=\"toggleSwap()\"\n        title=\"Intercambiar vista\"\n        aria-label=\"Intercambiar vista\"\n      >\n        <i class=\"fa fa-refresh\"></i>\n      </button>\n      <button\n        class=\"btn control-btn pip-btn\"\n        (click)=\"minimize()\"\n        title=\"Minimizar (Picture in Picture)\"\n        aria-label=\"Minimizar videollamada\"\n      >\n        <i class=\"fa fa-compress\"></i>\n      </button>\n      <button\n        class=\"btn control-btn hangup-btn\"\n        (click)=\"hangUp()\"\n        title=\"Finalizar llamada\"\n        aria-label=\"Finalizar llamada\"\n      >\n        <i class=\"fa fa-phone\"></i>\n      </button>\n    </div>\n\n    <!-- Waiting room notification (shown for OWNER/BACKOFFICE only) -->\n    <div\n      class=\"waiting-notification\"\n      *ngIf=\"waitingRoomUsers.length > 0 && canAdmitUsers\"\n      role=\"alert\"\n      aria-live=\"polite\"\n    >\n      <span class=\"waiting-text\">\n        {{ waitingRoomUsers[0].name }} est\u00E1 en la sala de espera.\n      </span>\n      <button\n        class=\"admit-btn\"\n        (click)=\"admitUser(waitingRoomUsers[0].userId)\"\n        aria-label=\"Admitir usuario\"\n      >\n        Admitir\n      </button>\n      <button\n        class=\"dismiss-btn\"\n        (click)=\"dismissWaitingNotification(waitingRoomUsers[0].userId)\"\n        aria-label=\"Cerrar notificaci\u00F3n\"\n      >\n        \u00D7\n      </button>\n    </div>\n  </div>\n\n  <!-- Owner geolocation panel (for owners to request user location) -->\n  <div class=\"user-geo-panel\" *ngIf=\"shouldShowUserGeoPanel || devModeEnabled\">\n    <div class=\"user-geo-header\">\n      <div class=\"header-title-row\">\n        <i class=\"fa fa-map-marker header-icon\" *ngIf=\"userGeoViewState !== UserGeoViewState.INITIAL\"></i>\n        <h3>Ubicaci\u00F3n del colaborador</h3>\n      </div>\n      <button class=\"close-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.HIDDEN)\" aria-label=\"Cerrar\">\u00D7</button>\n    </div>\n\n    <div class=\"user-geo-description\" *ngIf=\"userGeoViewState !== UserGeoViewState.VERIFIED && userGeoViewState !== UserGeoViewState.DENIED\">\n      <p>El colaborador tiene la ubicaci\u00F3n desactivada, solicita que la active.</p>\n      <p>Esta acci\u00F3n nos permitir\u00E1 disponibilizar algunas alertas.</p>\n    </div>\n\n    <div class=\"user-geo-content\">\n      <!-- INITIAL state: just the button -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.INITIAL\">\n        <!-- spacer -->\n      </ng-container>\n\n      <!-- VERIFYING state: spinner + loading message -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.VERIFYING\">\n        <div class=\"user-geo-verifying\">\n          <div class=\"geo-spinner-large\"></div>\n          <p class=\"verifying-title\">Verificando ubicaci\u00F3n...</p>\n          <p class=\"verifying-subtitle\">Esto puede tardar unos segundos.</p>\n        </div>\n      </ng-container>\n\n      <!-- VERIFIED state: home icon with sparkles -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.VERIFIED\">\n        <div class=\"user-geo-verified\">\n          <div class=\"verified-icon-container\">\n            <span class=\"home-icon\" [innerHTML]=\"homeIcon\"></span>\n          </div>\n          <p class=\"verified-title\">La ubicaci\u00F3n fue verificada</p>\n        </div>\n      </ng-container>\n\n      <!-- DENIED state: error icon and message -->\n      <ng-container *ngIf=\"userGeoViewState === UserGeoViewState.DENIED\">\n        <div class=\"user-geo-denied\">\n          <div class=\"denied-icon-container\">\n            <i class=\"fa fa-times-circle\"></i>\n          </div>\n          <p class=\"denied-title\">La ubicaci\u00F3n fue rechazada</p>\n          <p class=\"denied-subtitle\">El colaborador no permiti\u00F3 el acceso a su ubicaci\u00F3n.</p>\n        </div>\n      </ng-container>\n    </div>\n\n    <!-- Button (hidden in verified and denied states) -->\n    <button \n      class=\"user-geo-btn\" \n      *ngIf=\"userGeoViewState !== UserGeoViewState.VERIFIED && userGeoViewState !== UserGeoViewState.DENIED\"\n      [class.disabled]=\"userGeoViewState === UserGeoViewState.VERIFYING\"\n      [disabled]=\"userGeoViewState === UserGeoViewState.VERIFYING\"\n      (click)=\"requestUserLocation()\">\n      Verificar ubicaci\u00F3n\n    </button>\n\n    <!-- Dev controls -->\n    <div class=\"dev-controls\" *ngIf=\"devModeEnabled\">\n      <span class=\"dev-label\">Dev:</span>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.INITIAL)\">Initial</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.VERIFYING)\">Verifying</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.VERIFIED)\">Verified</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.DENIED)\">Denied</button>\n      <button class=\"dev-btn\" (click)=\"setUserGeoViewState(UserGeoViewState.HIDDEN)\">Hide</button>\n    </div>\n  </div>\n</div>\n\n", styles: ["@charset \"UTF-8\";:host{display:flex;width:100vw;height:100vh;box-sizing:border-box;padding:2rem;background:linear-gradient(281deg,rgba(29,164,177,.2) 6.96%,rgba(0,0,0,0) 70.44%),#212532}.tas-videocall-wrapper{display:flex;flex:1;gap:1rem;height:100%}.tas-videocall-container{position:relative;flex:1;height:100%;overflow:hidden;border-radius:8px;border:1px solid var(--Neutral-GreyLight, #dadfe9);background:linear-gradient(180deg,#e5f1f7 0%,#0072ac 100%)}.tas-videocall-container ::ng-deep .OT_edge-bar-item,.tas-videocall-container ::ng-deep .OT_mute,.tas-videocall-container ::ng-deep .OT_audio-level-meter,.tas-videocall-container ::ng-deep .OT_bar,.tas-videocall-container ::ng-deep .OT_name{display:none!important}.tas-videocall-container .subscriber-view{width:100%;height:100%;z-index:1}.tas-videocall-container .publisher-view{position:absolute;top:20px;right:20px;width:200px;height:150px;z-index:2;border:2px solid #fff;border-radius:8px;background-color:#0000004d;overflow:hidden}.tas-videocall-container .avatar-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;display:flex;align-items:center;justify-content:center}.tas-videocall-container .controls-container{display:flex;flex-direction:row;gap:12px;position:absolute;bottom:30px;left:50%;transform:translate(-50%);z-index:3;background-color:#33475bb3;padding:12px 20px;border-radius:30px;backdrop-filter:blur(8px)}.tas-videocall-container .controls-container .control-btn{width:44px;height:44px;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:18px;border:none;background:transparent;cursor:pointer;transition:all .2s ease}.tas-videocall-container .controls-container .control-btn i{color:#fff}.tas-videocall-container .controls-container .control-btn:hover{transform:scale(1.05);filter:brightness(1.1)}.tas-videocall-container .controls-container .control-btn:focus{outline:2px solid #fff;outline-offset:2px}.tas-videocall-container .controls-container .hangup-btn{background:#f44336}.tas-videocall-container .controls-container .hangup-btn i{transform:rotate(135deg)}.tas-videocall-container .controls-container .hangup-btn:hover{background:#d32f2f}.tas-videocall-container .controls-container .swap-btn,.tas-videocall-container .controls-container .pip-btn,.tas-videocall-container .controls-container .mute-btn{background:transparent}.tas-videocall-container .controls-container .swap-btn:hover,.tas-videocall-container .controls-container .pip-btn:hover,.tas-videocall-container .controls-container .mute-btn:hover{background:rgba(255,255,255,.15)}.tas-videocall-container .waiting-notification{position:absolute;bottom:100px;left:16px;display:flex;align-items:center;gap:12px;background-color:#33475be6;padding:10px 16px;border-radius:8px;z-index:4;backdrop-filter:blur(4px);max-width:calc(100% - 32px)}.tas-videocall-container .waiting-notification .waiting-text{color:#fff;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tas-videocall-container .waiting-notification .admit-btn{background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:4px;padding:6px 16px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s ease;white-space:nowrap}.tas-videocall-container .waiting-notification .admit-btn:hover{background:#178e99}.tas-videocall-container .waiting-notification .admit-btn:focus{outline:2px solid #fff;outline-offset:2px}.tas-videocall-container .waiting-notification .dismiss-btn{background:transparent;color:#fff;border:none;font-size:20px;line-height:1;cursor:pointer;padding:0 4px;opacity:.7;transition:opacity .2s ease}.tas-videocall-container .waiting-notification .dismiss-btn:hover{opacity:1}.tas-videocall-container .waiting-notification .dismiss-btn:focus{outline:2px solid #fff;outline-offset:2px}.location-panel{width:280px;height:100%;background:#212532;border-radius:8px;padding:1.5rem;display:flex;flex-direction:column;color:#fff}.location-panel .location-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.location-panel .location-header h3{font-size:16px;font-weight:600;margin:0;color:#fff}.location-panel .location-header .close-btn{background:transparent;border:none;color:#fff;font-size:20px;cursor:pointer;padding:0;line-height:1;opacity:.7}.location-panel .location-header .close-btn:hover{opacity:1}.location-panel .location-description{font-size:14px;color:#fffc;line-height:1.5;margin-bottom:.5rem}.location-panel .location-description p{margin:0 0 .5rem}.location-panel .location-user-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;max-height:200px;overflow-y:auto}.location-panel .location-user-list .user-geo-item{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;background:rgba(255,255,255,.05);border-radius:6px}.location-panel .location-user-list .user-geo-item .user-icon{color:#fff9;font-size:14px}.location-panel .location-user-list .user-geo-item .user-name{flex:1;font-size:14px;color:#fff}.location-panel .location-user-list .user-geo-item .geo-status{display:flex;align-items:center;gap:.35rem;font-size:12px;padding:2px 8px;border-radius:12px}.location-panel .location-user-list .user-geo-item .geo-status.pending{color:#ffc107;background:rgba(255,193,7,.15)}.location-panel .location-user-list .user-geo-item .geo-status.granted{color:#4caf50;background:rgba(76,175,80,.15)}.location-panel .location-user-list .user-geo-item .geo-status.denied{color:#f44336;background:rgba(244,67,54,.15)}.location-panel .location-user-list .user-geo-item .geo-status i{font-size:10px}.location-panel .geo-denied-warning{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:rgba(244,67,54,.15);border-radius:6px;margin-bottom:1rem;color:#f44336;font-size:13px}.location-panel .geo-denied-warning i{font-size:14px}.location-panel .location-content{flex:1;display:flex;flex-direction:column;justify-content:flex-end}.location-panel .verify-location-btn{width:100%;padding:12px 24px;background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s ease;margin-bottom:1rem}.location-panel .verify-location-btn:hover{background:#178e99}.location-panel .verify-location-btn:disabled{background:rgba(29,164,177,.5);cursor:not-allowed}.location-panel .location-footer{display:flex;justify-content:flex-end;gap:.5rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.1)}.location-panel .location-footer .footer-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:#fff;font-size:14px}.location-panel .location-footer .footer-icon.location-icon{background:var(--Primary-Uell, #1da4b1)}.location-panel .header-icon{color:#fff;font-size:16px}.location-panel .geo-loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 0}.location-panel .geo-loading-container .geo-spinner{width:64px;height:64px;border:4px solid rgba(29,164,177,.2);border-top-color:var(--Primary-Uell, #1da4b1);border-radius:50%;animation:geo-spin 1s linear infinite}.location-panel .geo-loading-container .loading-title{color:#fff;font-size:16px;font-weight:600;margin:1.5rem 0 .25rem}.location-panel .geo-loading-container .loading-subtitle{color:#ffffffb3;font-size:14px;margin:0}.location-panel .geo-success-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 0}.location-panel .geo-success-container .success-icon{width:80px;height:80px;border-radius:50%;background:var(--Primary-Uell, #1da4b1);display:flex;align-items:center;justify-content:center;position:relative}.location-panel .geo-success-container .success-icon i{color:#fff;font-size:32px}.location-panel .geo-success-container .success-icon:before,.location-panel .geo-success-container .success-icon:after{content:\"\\2726\";position:absolute;color:#fff;font-size:10px}.location-panel .geo-success-container .success-icon:before{top:-8px;right:-4px}.location-panel .geo-success-container .success-icon:after{bottom:-4px;left:-8px}.location-panel .geo-success-container .success-title{color:#fff;font-size:16px;font-weight:600;margin:1.5rem 0 0}.location-panel .verify-location-btn.disabled{background:rgba(29,164,177,.5);cursor:not-allowed}@keyframes geo-spin{to{transform:rotate(360deg)}}.user-geo-panel{width:360px;height:100%;background:#212532;border-radius:8px;padding:1.5rem;display:flex;flex-direction:column;color:#fff}.user-geo-panel .user-geo-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2.5rem;padding-top:2rem}.user-geo-panel .user-geo-header .header-title-row{display:flex;align-items:center;gap:.5rem}.user-geo-panel .user-geo-header .header-title-row .header-icon{font-size:16px;color:#fff}.user-geo-panel .user-geo-header .header-title-row h3{font-size:18px;font-weight:600;margin:0;color:#fff}.user-geo-panel .user-geo-header .close-btn{background:transparent;border:none;color:#fff;font-size:20px;cursor:pointer;padding:0;line-height:1;opacity:.7}.user-geo-panel .user-geo-header .close-btn:hover{opacity:1}.user-geo-panel .user-geo-description{font-size:14px;color:#fffc;line-height:1.6;margin-bottom:1rem}.user-geo-panel .user-geo-description p{margin:0 0 .75rem}.user-geo-panel .user-geo-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.user-geo-panel .user-geo-verifying{display:flex;flex-direction:column;align-items:center;text-align:center}.user-geo-panel .user-geo-verifying .geo-spinner-large{width:80px;height:80px;border:4px solid rgba(29,164,177,.2);border-top-color:var(--Primary-Uell, #1da4b1);border-radius:50%;animation:geo-spin 1s linear infinite;margin-bottom:1.5rem}.user-geo-panel .user-geo-verifying .verifying-title{color:#fff;font-size:16px;font-weight:600;margin:0 0 .25rem}.user-geo-panel .user-geo-verifying .verifying-subtitle{color:#fff9;font-size:14px;margin:0}.user-geo-panel .user-geo-verified{display:flex;flex-direction:column;align-items:center;text-align:center}.user-geo-panel .user-geo-verified .verified-icon-container{margin-bottom:1rem}.user-geo-panel .user-geo-verified .verified-icon-container .home-icon{display:block}.user-geo-panel .user-geo-verified .verified-icon-container .home-icon svg{width:120px;height:100px}.user-geo-panel .user-geo-verified .verified-title{color:#fff;font-size:16px;font-weight:600;margin:0}.user-geo-panel .user-geo-denied{display:flex;flex-direction:column;align-items:center;text-align:center}.user-geo-panel .user-geo-denied .denied-icon-container{width:100px;height:100px;border-radius:50%;background:rgba(244,67,54,.2);display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem}.user-geo-panel .user-geo-denied .denied-icon-container i{font-size:48px;color:#f44336}.user-geo-panel .user-geo-denied .denied-title{color:#fff;font-size:16px;font-weight:600;margin:0 0 .5rem}.user-geo-panel .user-geo-denied .denied-subtitle{color:#fff9;font-size:14px;margin:0}.user-geo-panel .user-geo-btn{width:100%;padding:14px 24px;background:var(--Primary-Uell, #1da4b1);color:#fff;border:none;border-radius:24px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:auto;margin-bottom:1rem}.user-geo-panel .user-geo-btn:hover:not(.disabled){background:#178e99}.user-geo-panel .user-geo-btn.disabled{background:rgba(29,164,177,.5);cursor:not-allowed}.user-geo-panel .dev-controls{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:rgba(0,0,0,.3);border-radius:6px;margin-bottom:1rem;flex-wrap:wrap}.user-geo-panel .dev-controls .dev-label{font-size:12px;color:#fff9;font-weight:600}.user-geo-panel .dev-controls .dev-btn{padding:4px 8px;font-size:11px;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:4px;cursor:pointer;transition:all .2s ease}.user-geo-panel .dev-controls .dev-btn:hover{background:rgba(255,255,255,.2)}.user-geo-panel .user-geo-footer{display:flex;justify-content:center;gap:.75rem;padding-top:.5rem}.user-geo-panel .user-geo-footer .footer-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:#fff9;font-size:16px}.user-geo-panel .user-geo-footer .footer-icon.active{background:var(--Primary-Uell, #1da4b1);color:#fff}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.NgbActiveModal }, { type: TasService }, { type: GeolocationService }, { type: i4$2.DomSanitizer }, { type: i1.NgbModal }]; }, propDecorators: { sessionId: [{
+        }], ctorParameters: function () { return [{ type: i1.NgbActiveModal }, { type: TasService }, { type: GeolocationService }, { type: i4$1.DomSanitizer }, { type: i1.NgbModal }]; }, propDecorators: { sessionId: [{
                 type: Input
             }], token: [{
                 type: Input
@@ -2115,7 +2141,7 @@ class TasWaitingRoomComponent {
     }
 }
 TasWaitingRoomComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasWaitingRoomComponent, deps: [{ token: i1.NgbActiveModal }, { token: TasService }, { token: GeolocationService }, { token: i1.NgbModal }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-TasWaitingRoomComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: TasWaitingRoomComponent, selector: "tas-waiting-room", inputs: { roomType: "roomType", entityId: "entityId", tenant: "tenant", businessRole: "businessRole", currentUser: "currentUser" }, ngImport: i0, template: "<div class=\"tas-waiting-room\">\n  <div class=\"waiting-room-content\">\n    <div class=\"state-container\">\n      <!-- Loading states (show spinner) -->\n      <ng-container *ngIf=\"state !== WaitingRoomState.ERROR\">\n        <div class=\"state-icon loading\">\n          <div class=\"spinner\"></div>\n        </div>\n        \n        <!-- Requesting permissions -->\n        <ng-container *ngIf=\"isRequestingPermissions\">\n          <p class=\"state-message\">Solicitando permisos...</p>\n          <p class=\"state-submessage\">Por favor, acept\u00E1 los permisos de c\u00E1mara y micr\u00F3fono.</p>\n        </ng-container>\n        \n        <!-- Waiting for admission (permissions granted, not joinable yet) -->\n        <ng-container *ngIf=\"isWaitingForAdmission\">\n          <p class=\"state-message\">Medicina laboral va a admitirte</p>\n          <p class=\"state-submessage\">Por favor, permanec\u00E9 en esta pantalla.</p>\n        </ng-container>\n        \n        <!-- Getting token / Joining -->\n        <ng-container *ngIf=\"state === WaitingRoomState.GETTING_TOKEN || state === WaitingRoomState.JOINING\">\n          <p class=\"state-message\">Conectando...</p>\n        </ng-container>\n        \n        <!-- Checking status (when not requesting permissions) -->\n        <ng-container *ngIf=\"state === WaitingRoomState.CHECKING_STATUS && !isRequestingPermissions\">\n          <p class=\"state-message\">Verificando estado...</p>\n        </ng-container>\n      </ng-container>\n\n      <!-- Error state (show error icon and message) -->\n      <ng-container *ngIf=\"state === WaitingRoomState.ERROR\">\n        <div class=\"state-icon error\">\n          <i class=\"fa fa-exclamation-triangle\"></i>\n        </div>\n        <p class=\"state-message error\">Ocurri\u00F3 un error</p>\n        \n        <!-- Collapsible error details -->\n        <div class=\"error-dropdown\" *ngIf=\"errorMessage\">\n          <button \n            type=\"button\" \n            class=\"error-toggle-btn\"\n            (click)=\"toggleErrorDetails()\"\n            [attr.aria-expanded]=\"showErrorDetails\"\n            aria-controls=\"error-details-content\"\n          >\n            <span>Ver detalles del error</span>\n            <i class=\"fa\" [class.fa-chevron-down]=\"!showErrorDetails\" [class.fa-chevron-up]=\"showErrorDetails\"></i>\n          </button>\n          <div \n            id=\"error-details-content\"\n            class=\"error-details-content\"\n            [class.expanded]=\"showErrorDetails\"\n          >\n            <p class=\"error-details-text\">{{ errorMessage }}</p>\n          </div>\n        </div>\n        \n        <div class=\"error-actions\">\n          <button type=\"button\" class=\"btn action-btn retry-btn\" (click)=\"retry()\">\n            <i class=\"fa fa-refresh\"></i>\n            Reintentar\n          </button>\n          <button type=\"button\" class=\"btn action-btn close-btn\" (click)=\"close()\">\n            Cerrar\n          </button>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</div>\n", styles: [".tas-waiting-room{display:flex;flex-direction:column;min-height:300px;background:#ffffff;border-radius:5px;overflow:hidden}.waiting-room-content{flex:1;display:flex;align-items:center;justify-content:center;padding:32px 40px;background:#ffffff}.state-container{text-align:center;max-width:400px;width:100%}.state-icon{width:80px;height:80px;margin:0 auto 24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.state-icon i{font-size:36px}.state-icon.loading{background:rgba(29,164,177,.1);border:2px solid #1da4b1}.state-icon.error{background:rgba(238,49,107,.1);border:2px solid #ee316b}.state-icon.error i{color:#ee316b}.spinner{width:40px;height:40px;border:3px solid #e9ecef;border-top-color:#1da4b1;border-radius:50%;animation:spin 1s linear infinite}.state-message{font-size:16px;font-weight:600;margin:0 0 8px;color:#212529;line-height:24px}.state-message.error{color:#ee316b}.state-submessage{font-size:14px;color:#6c757d;margin:0 0 24px;font-weight:400}.error-dropdown{margin:16px 0;width:100%}.error-toggle-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 16px;font-size:13px;font-weight:500;color:#6c757d;background:transparent;border:1px solid #e9ecef;border-radius:6px;cursor:pointer;transition:all .2s ease}.error-toggle-btn:hover{background:#f8f9fa;border-color:#6c757d;color:#212529}.error-toggle-btn i{font-size:12px;transition:transform .2s ease}.error-details-content{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease}.error-details-content.expanded{max-height:200px;padding-top:12px}.error-details-text{font-size:12px;color:#ee316b;margin:0;padding:12px 16px;background:rgba(238,49,107,.08);border-radius:8px;border:1px solid rgba(238,49,107,.2);text-align:left;word-break:break-word;max-height:150px;overflow-y:auto}.error-actions{display:flex;justify-content:center;gap:12px;margin-top:16px}.action-btn{padding:12px 32px;font-size:16px;font-weight:600;border-radius:4px;border:none;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:10px}.action-btn i{font-size:16px}.action-btn.retry-btn{background:transparent;color:#6c757d;border:1px solid #e9ecef}.action-btn.retry-btn:hover{background:#f8f9fa;border-color:#6c757d;color:#212529}.action-btn.close-btn{background:#ee316b;color:#fff;border:none}.action-btn.close-btn:hover{background:#da124f}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 576px){.tas-waiting-room{min-height:250px}.waiting-room-content{padding:24px}.state-icon{width:64px;height:64px}.state-icon i{font-size:28px}.spinner{width:32px;height:32px}.action-btn{padding:10px 24px;font-size:14px}}\n"], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TasWaitingRoomComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: TasWaitingRoomComponent, selector: "tas-waiting-room", inputs: { roomType: "roomType", entityId: "entityId", tenant: "tenant", businessRole: "businessRole", currentUser: "currentUser" }, ngImport: i0, template: "<div class=\"tas-waiting-room\">\n  <div class=\"waiting-room-content\">\n    <div class=\"state-container\">\n      <!-- Loading states (show spinner) -->\n      <ng-container *ngIf=\"state !== WaitingRoomState.ERROR\">\n        <div class=\"state-icon loading\">\n          <div class=\"spinner\"></div>\n        </div>\n        \n        <!-- Requesting permissions -->\n        <ng-container *ngIf=\"isRequestingPermissions\">\n          <p class=\"state-message\">Solicitando permisos...</p>\n          <p class=\"state-submessage\">Por favor, acept\u00E1 los permisos de c\u00E1mara y micr\u00F3fono.</p>\n        </ng-container>\n        \n        <!-- Waiting for admission (permissions granted, not joinable yet) -->\n        <ng-container *ngIf=\"isWaitingForAdmission\">\n          <p class=\"state-message\">Medicina laboral va a admitirte</p>\n          <p class=\"state-submessage\">Por favor, permanec\u00E9 en esta pantalla.</p>\n        </ng-container>\n        \n        <!-- Getting token / Joining -->\n        <ng-container *ngIf=\"state === WaitingRoomState.GETTING_TOKEN || state === WaitingRoomState.JOINING\">\n          <p class=\"state-message\">Conectando...</p>\n        </ng-container>\n        \n        <!-- Checking status (when not requesting permissions) -->\n        <ng-container *ngIf=\"state === WaitingRoomState.CHECKING_STATUS && !isRequestingPermissions\">\n          <p class=\"state-message\">Verificando estado...</p>\n        </ng-container>\n      </ng-container>\n\n      <!-- Error state (show error icon and message) -->\n      <ng-container *ngIf=\"state === WaitingRoomState.ERROR\">\n        <div class=\"state-icon error\">\n          <i class=\"fa fa-exclamation-triangle\"></i>\n        </div>\n        <p class=\"state-message error\">Ocurri\u00F3 un error</p>\n        \n        <!-- Collapsible error details -->\n        <div class=\"error-dropdown\" *ngIf=\"errorMessage\">\n          <button \n            type=\"button\" \n            class=\"error-toggle-btn\"\n            (click)=\"toggleErrorDetails()\"\n            [attr.aria-expanded]=\"showErrorDetails\"\n            aria-controls=\"error-details-content\"\n          >\n            <span>Ver detalles del error</span>\n            <i class=\"fa\" [class.fa-chevron-down]=\"!showErrorDetails\" [class.fa-chevron-up]=\"showErrorDetails\"></i>\n          </button>\n          <div \n            id=\"error-details-content\"\n            class=\"error-details-content\"\n            [class.expanded]=\"showErrorDetails\"\n          >\n            <p class=\"error-details-text\">{{ errorMessage }}</p>\n          </div>\n        </div>\n        \n        <div class=\"error-actions\">\n          <button type=\"button\" class=\"btn action-btn retry-btn\" (click)=\"retry()\">\n            <i class=\"fa fa-refresh\"></i>\n            Reintentar\n          </button>\n          <button type=\"button\" class=\"btn action-btn close-btn\" (click)=\"close()\">\n            Cerrar\n          </button>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</div>\n", styles: [".tas-waiting-room{display:flex;flex-direction:column;min-height:300px;background:#ffffff;border-radius:5px;overflow:hidden}.waiting-room-content{flex:1;display:flex;align-items:center;justify-content:center;padding:32px 40px;background:#ffffff}.state-container{text-align:center;max-width:400px;width:100%}.state-icon{width:80px;height:80px;margin:0 auto 24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.state-icon i{font-size:36px}.state-icon.loading{background:rgba(29,164,177,.1);border:2px solid #1da4b1}.state-icon.error{background:rgba(238,49,107,.1);border:2px solid #ee316b}.state-icon.error i{color:#ee316b}.spinner{width:40px;height:40px;border:3px solid #e9ecef;border-top-color:#1da4b1;border-radius:50%;animation:spin 1s linear infinite}.state-message{font-size:16px;font-weight:600;margin:0 0 8px;color:#212529;line-height:24px}.state-message.error{color:#ee316b}.state-submessage{font-size:14px;color:#6c757d;margin:0 0 24px;font-weight:400}.error-dropdown{margin:16px 0;width:100%}.error-toggle-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 16px;font-size:13px;font-weight:500;color:#6c757d;background:transparent;border:1px solid #e9ecef;border-radius:6px;cursor:pointer;transition:all .2s ease}.error-toggle-btn:hover{background:#f8f9fa;border-color:#6c757d;color:#212529}.error-toggle-btn i{font-size:12px;transition:transform .2s ease}.error-details-content{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease}.error-details-content.expanded{max-height:200px;padding-top:12px}.error-details-text{font-size:12px;color:#ee316b;margin:0;padding:12px 16px;background:rgba(238,49,107,.08);border-radius:8px;border:1px solid rgba(238,49,107,.2);text-align:left;word-break:break-word;max-height:150px;overflow-y:auto}.error-actions{display:flex;justify-content:center;gap:12px;margin-top:16px}.action-btn{padding:12px 32px;font-size:16px;font-weight:600;border-radius:4px;border:none;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:10px}.action-btn i{font-size:16px}.action-btn.retry-btn{background:transparent;color:#6c757d;border:1px solid #e9ecef}.action-btn.retry-btn:hover{background:#f8f9fa;border-color:#6c757d;color:#212529}.action-btn.close-btn{background:#ee316b;color:#fff;border:none}.action-btn.close-btn:hover{background:#da124f}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 576px){.tas-waiting-room{min-height:250px}.waiting-room-content{padding:24px}.state-icon{width:64px;height:64px}.state-icon i{font-size:28px}.spinner{width:32px;height:32px}.action-btn{padding:10px 24px;font-size:14px}}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasWaitingRoomComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tas-waiting-room', template: "<div class=\"tas-waiting-room\">\n  <div class=\"waiting-room-content\">\n    <div class=\"state-container\">\n      <!-- Loading states (show spinner) -->\n      <ng-container *ngIf=\"state !== WaitingRoomState.ERROR\">\n        <div class=\"state-icon loading\">\n          <div class=\"spinner\"></div>\n        </div>\n        \n        <!-- Requesting permissions -->\n        <ng-container *ngIf=\"isRequestingPermissions\">\n          <p class=\"state-message\">Solicitando permisos...</p>\n          <p class=\"state-submessage\">Por favor, acept\u00E1 los permisos de c\u00E1mara y micr\u00F3fono.</p>\n        </ng-container>\n        \n        <!-- Waiting for admission (permissions granted, not joinable yet) -->\n        <ng-container *ngIf=\"isWaitingForAdmission\">\n          <p class=\"state-message\">Medicina laboral va a admitirte</p>\n          <p class=\"state-submessage\">Por favor, permanec\u00E9 en esta pantalla.</p>\n        </ng-container>\n        \n        <!-- Getting token / Joining -->\n        <ng-container *ngIf=\"state === WaitingRoomState.GETTING_TOKEN || state === WaitingRoomState.JOINING\">\n          <p class=\"state-message\">Conectando...</p>\n        </ng-container>\n        \n        <!-- Checking status (when not requesting permissions) -->\n        <ng-container *ngIf=\"state === WaitingRoomState.CHECKING_STATUS && !isRequestingPermissions\">\n          <p class=\"state-message\">Verificando estado...</p>\n        </ng-container>\n      </ng-container>\n\n      <!-- Error state (show error icon and message) -->\n      <ng-container *ngIf=\"state === WaitingRoomState.ERROR\">\n        <div class=\"state-icon error\">\n          <i class=\"fa fa-exclamation-triangle\"></i>\n        </div>\n        <p class=\"state-message error\">Ocurri\u00F3 un error</p>\n        \n        <!-- Collapsible error details -->\n        <div class=\"error-dropdown\" *ngIf=\"errorMessage\">\n          <button \n            type=\"button\" \n            class=\"error-toggle-btn\"\n            (click)=\"toggleErrorDetails()\"\n            [attr.aria-expanded]=\"showErrorDetails\"\n            aria-controls=\"error-details-content\"\n          >\n            <span>Ver detalles del error</span>\n            <i class=\"fa\" [class.fa-chevron-down]=\"!showErrorDetails\" [class.fa-chevron-up]=\"showErrorDetails\"></i>\n          </button>\n          <div \n            id=\"error-details-content\"\n            class=\"error-details-content\"\n            [class.expanded]=\"showErrorDetails\"\n          >\n            <p class=\"error-details-text\">{{ errorMessage }}</p>\n          </div>\n        </div>\n        \n        <div class=\"error-actions\">\n          <button type=\"button\" class=\"btn action-btn retry-btn\" (click)=\"retry()\">\n            <i class=\"fa fa-refresh\"></i>\n            Reintentar\n          </button>\n          <button type=\"button\" class=\"btn action-btn close-btn\" (click)=\"close()\">\n            Cerrar\n          </button>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</div>\n", styles: [".tas-waiting-room{display:flex;flex-direction:column;min-height:300px;background:#ffffff;border-radius:5px;overflow:hidden}.waiting-room-content{flex:1;display:flex;align-items:center;justify-content:center;padding:32px 40px;background:#ffffff}.state-container{text-align:center;max-width:400px;width:100%}.state-icon{width:80px;height:80px;margin:0 auto 24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.state-icon i{font-size:36px}.state-icon.loading{background:rgba(29,164,177,.1);border:2px solid #1da4b1}.state-icon.error{background:rgba(238,49,107,.1);border:2px solid #ee316b}.state-icon.error i{color:#ee316b}.spinner{width:40px;height:40px;border:3px solid #e9ecef;border-top-color:#1da4b1;border-radius:50%;animation:spin 1s linear infinite}.state-message{font-size:16px;font-weight:600;margin:0 0 8px;color:#212529;line-height:24px}.state-message.error{color:#ee316b}.state-submessage{font-size:14px;color:#6c757d;margin:0 0 24px;font-weight:400}.error-dropdown{margin:16px 0;width:100%}.error-toggle-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 16px;font-size:13px;font-weight:500;color:#6c757d;background:transparent;border:1px solid #e9ecef;border-radius:6px;cursor:pointer;transition:all .2s ease}.error-toggle-btn:hover{background:#f8f9fa;border-color:#6c757d;color:#212529}.error-toggle-btn i{font-size:12px;transition:transform .2s ease}.error-details-content{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease}.error-details-content.expanded{max-height:200px;padding-top:12px}.error-details-text{font-size:12px;color:#ee316b;margin:0;padding:12px 16px;background:rgba(238,49,107,.08);border-radius:8px;border:1px solid rgba(238,49,107,.2);text-align:left;word-break:break-word;max-height:150px;overflow-y:auto}.error-actions{display:flex;justify-content:center;gap:12px;margin-top:16px}.action-btn{padding:12px 32px;font-size:16px;font-weight:600;border-radius:4px;border:none;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:10px}.action-btn i{font-size:16px}.action-btn.retry-btn{background:transparent;color:#6c757d;border:1px solid #e9ecef}.action-btn.retry-btn:hover{background:#f8f9fa;border-color:#6c757d;color:#212529}.action-btn.close-btn{background:#ee316b;color:#fff;border:none}.action-btn.close-btn:hover{background:#da124f}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 576px){.tas-waiting-room{min-height:250px}.waiting-room-content{padding:24px}.state-icon{width:64px;height:64px}.state-icon i{font-size:28px}.spinner{width:32px;height:32px}.action-btn{padding:10px 24px;font-size:14px}}\n"] }]
@@ -2148,6 +2174,7 @@ class TasButtonComponent {
         this.isStatusError = false;
         this.statusErrorMessage = '';
         this.isJoinable = false; // Tracks joinable field from status response
+        this.isWaitingRoomAvailable = false; // Controls button enabled state
         this.shouldShowButton = false; // Hidden by default, shown after status check confirms visibility
         this.subscriptions = new Subscription();
         this.currentModalRef = null;
@@ -2163,7 +2190,9 @@ class TasButtonComponent {
     }
     /** Whether the button should be disabled */
     get isDisabled() {
-        return this.isLoading || this.isStatusError || !this.isJoinable;
+        // Button is enabled if joinable OR waitingRoomAvailable is true
+        const canJoin = this.isJoinable || this.isWaitingRoomAvailable;
+        return this.isLoading || this.isStatusError || !canJoin;
     }
     /** Reason why the button is disabled (for tooltip) */
     get disabledReason() {
@@ -2173,8 +2202,8 @@ class TasButtonComponent {
         if (this.isStatusError) {
             return this.statusErrorMessage || 'Error al verificar el estado';
         }
-        if (!this.isJoinable) {
-            return 'Todavía no es el horario de la llamada';
+        if (!this.isJoinable && !this.isWaitingRoomAvailable) {
+            return 'La sala de espera no está disponible';
         }
         return '';
     }
@@ -2241,8 +2270,9 @@ class TasButtonComponent {
                 this.isStatusError = false;
                 this.statusErrorMessage = '';
                 this.shouldShowButton = true;
-                // Update joinable state from response
+                // Track status fields for button state
                 this.isJoinable = response.content?.joinable ?? false;
+                this.isWaitingRoomAvailable = response.content?.waitingRoomAvailable ?? false;
             },
             error: (err) => {
                 this.handleStatusError(err);
@@ -2266,6 +2296,9 @@ class TasButtonComponent {
         if (!this.entityId) {
             return;
         }
+        if (this.currentModalRef) {
+            return;
+        }
         this.openWaitingRoomModal();
     }
     openWaitingRoomModal() {
@@ -2307,7 +2340,7 @@ class TasButtonComponent {
     }
 }
 TasButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasButtonComponent, deps: [{ token: i1.NgbModal }, { token: TasService }, { token: TasUtilityService }], target: i0.ɵɵFactoryTarget.Component });
-TasButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: TasButtonComponent, selector: "tas-btn", inputs: { roomType: "roomType", entityId: "entityId", tenant: "tenant", businessRole: "businessRole", currentUser: "currentUser", variant: "variant", buttonLabel: "buttonLabel" }, ngImport: i0, template: "<span\n  *ngIf=\"shouldShowButton\"\n  [ngbTooltip]=\"isDisabled && disabledReason ? disabledReason : null\"\n  container=\"body\"\n  placement=\"top\"\n  tooltipClass=\"tas-btn-tooltip\"\n>\n  <button\n    type=\"button\"\n    class=\"btn btn-primary tas-btn\"\n    [class.tas-btn--teal]=\"variant === 'teal'\"\n    (click)=\"onClick()\"\n    [disabled]=\"isDisabled\"\n  >\n    <i class=\"fa fa-video-camera\" aria-hidden=\"true\" *ngIf=\"!isLoading\"></i>\n    <span *ngIf=\"!isLoading\">{{ buttonLabel }}</span>\n    <span *ngIf=\"isLoading\">Processing...</span>\n  </button>\n</span>\n", styles: [":host{display:inline-block}.tas-btn{background-color:#ee316b!important;color:#fff!important;border-color:#ee316b!important;margin-right:24px;display:flex;padding:6px 14px;justify-content:center;align-items:center;gap:7px;flex-shrink:0;flex-grow:0}.tas-btn:disabled{background-color:#ccc!important;border-color:#ccc!important;cursor:not-allowed}.tas-btn:hover:not(:disabled){background-color:#d62a5f!important;border-color:#d62a5f!important}.tas-btn i{margin-right:5px}.tas-btn--teal{background-color:#0097a7!important;border-color:#0097a7!important;border-radius:24px;font-weight:500;margin-right:0;padding:6px 14px}.tas-btn--teal:hover:not(:disabled){background-color:#00838f!important;border-color:#00838f!important}\n"], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
+TasButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: TasButtonComponent, selector: "tas-btn", inputs: { roomType: "roomType", entityId: "entityId", tenant: "tenant", businessRole: "businessRole", currentUser: "currentUser", variant: "variant", buttonLabel: "buttonLabel" }, ngImport: i0, template: "<span\n  *ngIf=\"shouldShowButton\"\n  [ngbTooltip]=\"isDisabled && disabledReason ? disabledReason : null\"\n  container=\"body\"\n  placement=\"top\"\n  tooltipClass=\"tas-btn-tooltip\"\n>\n  <button\n    type=\"button\"\n    class=\"btn btn-primary tas-btn\"\n    [class.tas-btn--teal]=\"variant === 'teal'\"\n    (click)=\"onClick()\"\n    [disabled]=\"isDisabled\"\n  >\n    <i class=\"fa fa-video-camera\" aria-hidden=\"true\" *ngIf=\"!isLoading\"></i>\n    <span *ngIf=\"!isLoading\">{{ buttonLabel }}</span>\n    <span *ngIf=\"isLoading\">Processing...</span>\n  </button>\n</span>\n", styles: [":host{display:inline-block}.tas-btn{background-color:#ee316b!important;color:#fff!important;border-color:#ee316b!important;margin-right:24px;display:flex;padding:6px 14px;justify-content:center;align-items:center;gap:7px;flex-shrink:0;flex-grow:0}.tas-btn:disabled{background-color:#ccc!important;border-color:#ccc!important;cursor:not-allowed}.tas-btn:hover:not(:disabled){background-color:#d62a5f!important;border-color:#d62a5f!important}.tas-btn i{margin-right:5px}.tas-btn--teal{background-color:#0097a7!important;border-color:#0097a7!important;border-radius:24px;font-weight:500;margin-right:0;padding:6px 14px}.tas-btn--teal:hover:not(:disabled){background-color:#00838f!important;border-color:#00838f!important}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tas-btn', template: "<span\n  *ngIf=\"shouldShowButton\"\n  [ngbTooltip]=\"isDisabled && disabledReason ? disabledReason : null\"\n  container=\"body\"\n  placement=\"top\"\n  tooltipClass=\"tas-btn-tooltip\"\n>\n  <button\n    type=\"button\"\n    class=\"btn btn-primary tas-btn\"\n    [class.tas-btn--teal]=\"variant === 'teal'\"\n    (click)=\"onClick()\"\n    [disabled]=\"isDisabled\"\n  >\n    <i class=\"fa fa-video-camera\" aria-hidden=\"true\" *ngIf=\"!isLoading\"></i>\n    <span *ngIf=\"!isLoading\">{{ buttonLabel }}</span>\n    <span *ngIf=\"isLoading\">Processing...</span>\n  </button>\n</span>\n", styles: [":host{display:inline-block}.tas-btn{background-color:#ee316b!important;color:#fff!important;border-color:#ee316b!important;margin-right:24px;display:flex;padding:6px 14px;justify-content:center;align-items:center;gap:7px;flex-shrink:0;flex-grow:0}.tas-btn:disabled{background-color:#ccc!important;border-color:#ccc!important;cursor:not-allowed}.tas-btn:hover:not(:disabled){background-color:#d62a5f!important;border-color:#d62a5f!important}.tas-btn i{margin-right:5px}.tas-btn--teal{background-color:#0097a7!important;border-color:#0097a7!important;border-radius:24px;font-weight:500;margin-right:0;padding:6px 14px}.tas-btn--teal:hover:not(:disabled){background-color:#00838f!important;border-color:#00838f!important}\n"] }]
@@ -2507,158 +2540,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             args: [{ selector: 'tas-floating-call', template: "<div class=\"tas-floating-container\" [class.visible]=\"isVisible\">\n  <!-- Video content area - shows main video only -->\n  <div class=\"floating-content\">\n    <!-- Main video container (subscriber if available, otherwise publisher) -->\n    <div id=\"pip-main-video\" class=\"pip-main-video\"></div>\n\n    <!-- Bottom controls -->\n    <div class=\"floating-controls\">\n      <button\n        class=\"action-btn expand-btn\"\n        (click)=\"onExpand()\"\n        title=\"Expand to fullscreen\"\n      >\n        <i class=\"fa fa-expand\"></i>\n      </button>\n      <button\n        class=\"action-btn mute-btn\"\n        [class.muted]=\"isMuted\"\n        (click)=\"toggleMute()\"\n        [title]=\"isMuted ? 'Unmute microphone' : 'Mute microphone'\"\n      >\n        <i\n          class=\"fa\"\n          [class.fa-microphone]=\"!isMuted\"\n          [class.fa-microphone-slash]=\"isMuted\"\n        ></i>\n      </button>\n      <button class=\"action-btn hangup-btn\" (click)=\"onHangUp()\" title=\"Hang up call\">\n        <i class=\"fa fa-phone\" style=\"transform: rotate(135deg)\"></i>\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [".tas-floating-container{position:fixed;bottom:20px;right:20px;width:280px;height:180px;background:#000;border-radius:12px;box-shadow:0 8px 32px #00000080;z-index:9999;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;transition:opacity .3s ease,visibility .3s ease,box-shadow .2s ease;opacity:0;visibility:hidden;pointer-events:none}.tas-floating-container.visible{opacity:1;visibility:visible;pointer-events:auto}.tas-floating-container:hover{box-shadow:0 8px 32px #00000080,0 0 0 2px #ffffff4d}.floating-content{position:relative;width:100%;height:100%;overflow:hidden}.pip-main-video{position:absolute;top:0;left:0;width:100%;height:100%;background:#000}.pip-main-video ::ng-deep video{width:100%;height:100%;object-fit:cover}.pip-main-video ::ng-deep .OT_subscriber,.pip-main-video ::ng-deep .OT_publisher{width:100%!important;height:100%!important}.pip-main-video ::ng-deep .OT_edge-bar-item,.pip-main-video ::ng-deep .OT_mute,.pip-main-video ::ng-deep .OT_audio-level-meter,.pip-main-video ::ng-deep .OT_bar,.pip-main-video ::ng-deep .OT_name{display:none!important}.floating-controls{position:absolute;bottom:10px;left:50%;transform:translate(-50%);display:flex;gap:12px;padding:6px 14px;background:rgba(0,0,0,.7);border-radius:24px;backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.tas-floating-container:hover .floating-controls{opacity:1;visibility:visible}.action-btn{width:32px;height:32px;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:13px;transition:all .2s ease}.action-btn.expand-btn{background:rgba(255,255,255,.2);color:#fff}.action-btn.expand-btn:hover{background:rgba(255,255,255,.35);transform:scale(1.1)}.action-btn.mute-btn{background:rgba(255,255,255,.2);color:#fff}.action-btn.mute-btn:hover{background:rgba(255,255,255,.35);transform:scale(1.1)}.action-btn.mute-btn.muted{background:#f39c12;color:#fff}.action-btn.mute-btn.muted:hover{background:#e67e22}.action-btn.hangup-btn{background:#dc3545;color:#fff}.action-btn.hangup-btn:hover{background:#c82333;transform:scale(1.1)}\n"] }]
         }], ctorParameters: function () { return [{ type: TasService }, { type: i1.NgbModal }]; } });
 
-class TasIncomingAppointmentComponent {
-    constructor(tasService) {
-        this.tasService = tasService;
-        // Passthrough inputs for tas-btn
-        this.roomType = TasRoomType.TAS;
-        this.businessRole = TasBusinessRole.USER;
-        this.enterCall = new EventEmitter();
-        this.appointments = [];
-        this.isLoading = true;
-        this.hasError = false;
-        // The appointmentId from status API - only this appointment shows tas-btn
-        this.activeAppointmentId = null;
-        this.subscriptions = new Subscription();
-    }
-    ngOnInit() {
-        this.loadAppointments();
-        this.checkStatus();
-    }
-    ngOnDestroy() {
-        this.subscriptions.unsubscribe();
-    }
-    loadAppointments() {
-        this.subscriptions.add(this.tasService
-            .getAppointments({
-            fromDate: this.fromDate,
-            toDate: this.toDate,
-            entityId: this.entityId
-        })
-            .subscribe({
-            next: (response) => {
-                // Handle both array response and wrapped response (e.g., { content: [...] })
-                const appointments = Array.isArray(response)
-                    ? response
-                    : response?.content || [];
-                // Deduplicate by id and sort by date and startTime ascending (earliest first)
-                const uniqueAppointments = appointments.filter((appt, index, self) => index === self.findIndex((a) => a.id === appt.id));
-                this.appointments = uniqueAppointments.sort((a, b) => {
-                    const dateTimeA = `${a.date}T${a.startTime}`;
-                    const dateTimeB = `${b.date}T${b.startTime}`;
-                    return dateTimeB.localeCompare(dateTimeA);
-                });
-                this.isLoading = false;
-            },
-            error: () => {
-                this.hasError = true;
-                this.isLoading = false;
-            },
-        }));
-    }
-    /**
-     * Check status endpoint to get the active appointmentId
-     */
-    checkStatus() {
-        if (!this.tenant || !this.entityId) {
-            return;
-        }
-        this.subscriptions.add(this.tasService
-            .getProxyVideoStatus({
-            roomType: this.roomType,
-            entityId: this.entityId,
-            tenant: this.tenant,
-            businessRole: this.businessRole,
-        })
-            .subscribe({
-            next: (response) => {
-                // Store the appointmentId from status - tas-btn only shows for this one
-                this.activeAppointmentId = response?.content?.appointmentId ?? null;
-            },
-            error: () => {
-                this.activeAppointmentId = null;
-            },
-        }));
-    }
-    onEnterCall(appointment) {
-        this.enterCall.emit(appointment);
-    }
-    /**
-     * Check if tas-btn should be shown for an appointment.
-     * Only shows when appointment.id matches the activeAppointmentId from status API.
-     * tas-btn handles its own polling for joinable state.
-     */
-    shouldShowTasBtn(appointment) {
-        const hasValidStatus = appointment.status === AppointmentStatus.CONFIRMED ||
-            appointment.status === AppointmentStatus.ACTIVE;
-        // Only show for the appointment that matches status API response
-        return hasValidStatus && appointment.id === this.activeAppointmentId;
-    }
-    /**
-     * TrackBy function for ngFor
-     */
-    trackByAppointmentId(index, appointment) {
-        return appointment.id;
-    }
-    /**
-     * Format date to Spanish format: "Lunes 8 de diciembre"
-     */
-    formatAppointmentDate(appointment) {
-        const [year, month, day] = appointment.date.split('-').map(Number);
-        const date = new Date(year, month - 1, day);
-        const dayNames = [
-            'Domingo', 'Lunes', 'Martes', 'Miércoles',
-            'Jueves', 'Viernes', 'Sábado'
-        ];
-        const monthNames = [
-            'enero', 'febrero', 'marzo', 'abril', 'mayo', 'junio',
-            'julio', 'agosto', 'septiembre', 'octubre', 'noviembre', 'diciembre'
-        ];
-        const dayName = dayNames[date.getDay()];
-        const dayNum = date.getDate();
-        const monthName = monthNames[date.getMonth()];
-        return `${dayName} ${dayNum} de ${monthName}`;
-    }
-    /**
-     * Format time range: "9:00 - 9:30"
-     */
-    formatTimeRange(appointment) {
-        return `${appointment.startTime} - ${appointment.endTime}`;
-    }
-    /**
-     * Get the other participant in the call (not the current user)
-     */
-    getOtherParticipant(appointment) {
-        if (!appointment.participants || appointment.participants.length === 0) {
-            return appointment.title;
-        }
-        const otherParticipant = appointment.participants.find(p => p.userId !== this.currentUser?.id);
-        return otherParticipant?.name || appointment.title;
-    }
-}
-TasIncomingAppointmentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasIncomingAppointmentComponent, deps: [{ token: TasService }], target: i0.ɵɵFactoryTarget.Component });
-TasIncomingAppointmentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: TasIncomingAppointmentComponent, selector: "tas-incoming-appointment", inputs: { roomType: "roomType", entityId: "entityId", tenant: "tenant", businessRole: "businessRole", currentUser: "currentUser", fromDate: "fromDate", toDate: "toDate" }, outputs: { enterCall: "enterCall" }, ngImport: i0, template: "<div class=\"incoming-appointment-card\">\n  <h3 class=\"card-title\">Pr\u00F3ximo turno</h3>\n\n  <!-- Loading state -->\n  <div class=\"card-content\" *ngIf=\"isLoading\">\n    <div class=\"loading-spinner\"></div>\n  </div>\n\n  <!-- Empty state -->\n  <div class=\"card-content empty-state\" *ngIf=\"!isLoading && appointments.length === 0\">\n    <div class=\"icon-container\">\n      <div class=\"icon-circle\">\n        <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n      </div>\n      <span class=\"sparkle sparkle-1\">\u2726</span>\n      <span class=\"sparkle sparkle-2\">\u2726</span>\n      <span class=\"sparkle sparkle-3\">\u2726</span>\n      <span class=\"sparkle sparkle-4\">\u2726</span>\n    </div>\n    <h4 class=\"empty-title\">Todav\u00EDa no ten\u00E9s turnos agendados</h4>\n    <p class=\"empty-subtitle\">\n      En caso de que Medicina Laboral requiera una consulta, lo ver\u00E1s en esta secci\u00F3n.\n    </p>\n  </div>\n\n  <!-- Appointments list -->\n  <div class=\"card-content appointment-state\" *ngIf=\"!isLoading && appointments.length > 0\">\n    <div class=\"appointment-card\" [ngClass]=\"{ 'cancelled': appt.status === 'CANCELLED' || appt.status === 'RESCHEDULED' }\" *ngFor=\"let appt of appointments; trackBy: trackByAppointmentId\">\n      <div class=\"appointment-header\">\n        <tas-avatar [name]=\"getOtherParticipant(appt)\" [size]=\"48\"></tas-avatar>\n        <span class=\"doctor-name\">{{ getOtherParticipant(appt) }}</span>\n      </div>\n      <div class=\"appointment-details\">\n        <div class=\"date-time\" [ngClass]=\"{ 'compact': !shouldShowTasBtn(appt), 'cancelled': appt.status === 'CANCELLED' || appt.status === 'RESCHEDULED' }\">\n          <span class=\"date\">{{ formatAppointmentDate(appt) }}</span>\n          <span class=\"time\">{{ formatTimeRange(appt) }}</span>\n        </div>\n        <tas-btn\n          *ngIf=\"shouldShowTasBtn(appt)\"\n          variant=\"teal\"\n          buttonLabel=\"Ingresar\"\n          [roomType]=\"appt.roomType\"\n          [entityId]=\"appt.entityId\"\n          [tenant]=\"tenant\"\n          [businessRole]=\"businessRole\"\n          [currentUser]=\"currentUser\"\n        ></tas-btn>\n      </div>\n    </div>\n  </div>\n</div>\n\n", styles: ["@charset \"UTF-8\";:host{display:block}.incoming-appointment-card{background:#ffffff;border-radius:12px;box-shadow:0 2px 8px #00000014;padding:24px;min-width:360px}.card-title{font-size:16px;font-weight:400;color:#6b7280;margin:0 0 24px}.card-content{display:flex;flex-direction:column;align-items:center}.loading-spinner{width:40px;height:40px;border:3px solid #e0f7fa;border-top-color:#0097a7;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:20px 0}.icon-container{position:relative;width:120px;height:120px;margin-bottom:24px}.icon-circle{width:100%;height:100%;background:#e0f7fa;border-radius:50%;display:flex;align-items:center;justify-content:center}.icon-circle i{font-size:40px;color:#0097a7}.sparkle{position:absolute;color:#0097a7;font-size:12px}.sparkle-1{top:10px;right:5px}.sparkle-2{top:0;right:30px}.sparkle-3{top:25px;left:0}.sparkle-4{bottom:20px;right:0}.empty-title{font-size:18px;font-weight:600;color:#1f2937;margin:0 0 12px}.empty-subtitle{font-size:14px;color:#6b7280;margin:0;max-width:320px;line-height:1.5}.appointment-state{align-items:stretch;gap:16px}.appointment-card{border-radius:12px;border:1px solid var(--Primary-White-Uell50, #8ED1D8);background:#F1FAFA;padding:1.5rem}.appointment-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.doctor-name{overflow:hidden;color:var(--Neutral-GreyDark, #383E52);text-overflow:ellipsis;font-size:16px;font-style:normal;font-weight:600;line-height:24px;letter-spacing:.016px}.appointment-details{display:flex;justify-content:space-between;align-items:flex-end}.date-time{display:flex;flex-direction:column;gap:4px}.date{color:var(--Neutral-GreyDark, #383E52);font-size:12px;font-style:normal;font-weight:600;line-height:16px;letter-spacing:.06px}.time{font-size:14px;color:var(--Neutral-GreyDark, #383E52);font-family:Inter;font-size:10px;font-style:normal;font-weight:400;line-height:14px;letter-spacing:.04px}.date-time.compact{flex-direction:row;align-items:center;gap:8px}.date-time.compact .date:after{content:\"\\b7\";margin-left:8px}.date-time.cancelled{color:#8a95ab}.date-time.cancelled .date{color:#8a95ab;text-decoration:line-through;font-size:14px}.date-time.cancelled .time{color:#8a95ab;text-decoration:line-through;font-size:12px}.appointment-card.cancelled{background:#f3f4f6;border:none}.appointment-card.cancelled .doctor-name{color:#8a95ab;text-decoration:line-through}.appointment-card.cancelled tas-avatar ::ng-deep .avatar{box-shadow:none}\n"], components: [{ type: TasAvatarComponent, selector: "tas-avatar", inputs: ["name", "size"] }, { type: TasButtonComponent, selector: "tas-btn", inputs: ["roomType", "entityId", "tenant", "businessRole", "currentUser", "variant", "buttonLabel"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasIncomingAppointmentComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'tas-incoming-appointment', template: "<div class=\"incoming-appointment-card\">\n  <h3 class=\"card-title\">Pr\u00F3ximo turno</h3>\n\n  <!-- Loading state -->\n  <div class=\"card-content\" *ngIf=\"isLoading\">\n    <div class=\"loading-spinner\"></div>\n  </div>\n\n  <!-- Empty state -->\n  <div class=\"card-content empty-state\" *ngIf=\"!isLoading && appointments.length === 0\">\n    <div class=\"icon-container\">\n      <div class=\"icon-circle\">\n        <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n      </div>\n      <span class=\"sparkle sparkle-1\">\u2726</span>\n      <span class=\"sparkle sparkle-2\">\u2726</span>\n      <span class=\"sparkle sparkle-3\">\u2726</span>\n      <span class=\"sparkle sparkle-4\">\u2726</span>\n    </div>\n    <h4 class=\"empty-title\">Todav\u00EDa no ten\u00E9s turnos agendados</h4>\n    <p class=\"empty-subtitle\">\n      En caso de que Medicina Laboral requiera una consulta, lo ver\u00E1s en esta secci\u00F3n.\n    </p>\n  </div>\n\n  <!-- Appointments list -->\n  <div class=\"card-content appointment-state\" *ngIf=\"!isLoading && appointments.length > 0\">\n    <div class=\"appointment-card\" [ngClass]=\"{ 'cancelled': appt.status === 'CANCELLED' || appt.status === 'RESCHEDULED' }\" *ngFor=\"let appt of appointments; trackBy: trackByAppointmentId\">\n      <div class=\"appointment-header\">\n        <tas-avatar [name]=\"getOtherParticipant(appt)\" [size]=\"48\"></tas-avatar>\n        <span class=\"doctor-name\">{{ getOtherParticipant(appt) }}</span>\n      </div>\n      <div class=\"appointment-details\">\n        <div class=\"date-time\" [ngClass]=\"{ 'compact': !shouldShowTasBtn(appt), 'cancelled': appt.status === 'CANCELLED' || appt.status === 'RESCHEDULED' }\">\n          <span class=\"date\">{{ formatAppointmentDate(appt) }}</span>\n          <span class=\"time\">{{ formatTimeRange(appt) }}</span>\n        </div>\n        <tas-btn\n          *ngIf=\"shouldShowTasBtn(appt)\"\n          variant=\"teal\"\n          buttonLabel=\"Ingresar\"\n          [roomType]=\"appt.roomType\"\n          [entityId]=\"appt.entityId\"\n          [tenant]=\"tenant\"\n          [businessRole]=\"businessRole\"\n          [currentUser]=\"currentUser\"\n        ></tas-btn>\n      </div>\n    </div>\n  </div>\n</div>\n\n", styles: ["@charset \"UTF-8\";:host{display:block}.incoming-appointment-card{background:#ffffff;border-radius:12px;box-shadow:0 2px 8px #00000014;padding:24px;min-width:360px}.card-title{font-size:16px;font-weight:400;color:#6b7280;margin:0 0 24px}.card-content{display:flex;flex-direction:column;align-items:center}.loading-spinner{width:40px;height:40px;border:3px solid #e0f7fa;border-top-color:#0097a7;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:20px 0}.icon-container{position:relative;width:120px;height:120px;margin-bottom:24px}.icon-circle{width:100%;height:100%;background:#e0f7fa;border-radius:50%;display:flex;align-items:center;justify-content:center}.icon-circle i{font-size:40px;color:#0097a7}.sparkle{position:absolute;color:#0097a7;font-size:12px}.sparkle-1{top:10px;right:5px}.sparkle-2{top:0;right:30px}.sparkle-3{top:25px;left:0}.sparkle-4{bottom:20px;right:0}.empty-title{font-size:18px;font-weight:600;color:#1f2937;margin:0 0 12px}.empty-subtitle{font-size:14px;color:#6b7280;margin:0;max-width:320px;line-height:1.5}.appointment-state{align-items:stretch;gap:16px}.appointment-card{border-radius:12px;border:1px solid var(--Primary-White-Uell50, #8ED1D8);background:#F1FAFA;padding:1.5rem}.appointment-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.doctor-name{overflow:hidden;color:var(--Neutral-GreyDark, #383E52);text-overflow:ellipsis;font-size:16px;font-style:normal;font-weight:600;line-height:24px;letter-spacing:.016px}.appointment-details{display:flex;justify-content:space-between;align-items:flex-end}.date-time{display:flex;flex-direction:column;gap:4px}.date{color:var(--Neutral-GreyDark, #383E52);font-size:12px;font-style:normal;font-weight:600;line-height:16px;letter-spacing:.06px}.time{font-size:14px;color:var(--Neutral-GreyDark, #383E52);font-family:Inter;font-size:10px;font-style:normal;font-weight:400;line-height:14px;letter-spacing:.04px}.date-time.compact{flex-direction:row;align-items:center;gap:8px}.date-time.compact .date:after{content:\"\\b7\";margin-left:8px}.date-time.cancelled{color:#8a95ab}.date-time.cancelled .date{color:#8a95ab;text-decoration:line-through;font-size:14px}.date-time.cancelled .time{color:#8a95ab;text-decoration:line-through;font-size:12px}.appointment-card.cancelled{background:#f3f4f6;border:none}.appointment-card.cancelled .doctor-name{color:#8a95ab;text-decoration:line-through}.appointment-card.cancelled tas-avatar ::ng-deep .avatar{box-shadow:none}\n"] }]
-        }], ctorParameters: function () { return [{ type: TasService }]; }, propDecorators: { roomType: [{
-                type: Input
-            }], entityId: [{
-                type: Input
-            }], tenant: [{
-                type: Input
-            }], businessRole: [{
-                type: Input
-            }], currentUser: [{
-                type: Input
-            }], fromDate: [{
-                type: Input
-            }], toDate: [{
-                type: Input
-            }], enterCall: [{
-                type: Output
-            }] } });
-
 class TasUellSdkModule {
     /**
      * Use forRoot() to configure the TAS SDK module with required dependencies.
@@ -2706,13 +2587,11 @@ TasUellSdkModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versio
         TasFloatingCallComponent,
         TasWaitingRoomComponent,
         TasAvatarComponent,
-        TasIncomingAppointmentComponent,
         TasFeedbackModalComponent], imports: [CommonModule, FormsModule, NgbTooltipModule], exports: [TasButtonComponent,
         TasVideocallComponent,
         TasFloatingCallComponent,
         TasWaitingRoomComponent,
         TasAvatarComponent,
-        TasIncomingAppointmentComponent,
         TasFeedbackModalComponent] });
 TasUellSdkModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasUellSdkModule, imports: [[CommonModule, FormsModule, NgbTooltipModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: TasUellSdkModule, decorators: [{
@@ -2724,7 +2603,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                         TasFloatingCallComponent,
                         TasWaitingRoomComponent,
                         TasAvatarComponent,
-                        TasIncomingAppointmentComponent,
                         TasFeedbackModalComponent,
                     ],
                     imports: [CommonModule, FormsModule, NgbTooltipModule],
@@ -2734,7 +2612,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                         TasFloatingCallComponent,
                         TasWaitingRoomComponent,
                         TasAvatarComponent,
-                        TasIncomingAppointmentComponent,
                         TasFeedbackModalComponent,
                     ],
                 }]
@@ -2748,5 +2625,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AppointmentStatus, CallState, FeedbackMotiveType, GeoStatus, GeolocationService, RoomUserStatus, TAS_CONFIG, TAS_HTTP_CLIENT, TasAvatarComponent, TasBusinessRole, TasButtonComponent, TasFeedbackModalComponent, TasFloatingCallComponent, TasIncomingAppointmentComponent, TasRoomType, TasService, TasSessionType, TasUellSdkModule, TasUserRole, TasUtilityService, TasVideocallComponent, TasWaitingRoomComponent, UserCallAction, UserGeoViewState, UserStatus, VideoSessionStatus, ViewMode, WaitingRoomState };
+export { AppointmentStatus, CallState, FeedbackMotiveType, GeoStatus, GeolocationService, RoomUserStatus, TAS_CONFIG, TAS_HTTP_CLIENT, TasAvatarComponent, TasBusinessRole, TasButtonComponent, TasFeedbackModalComponent, TasFloatingCallComponent, TasRoomType, TasService, TasSessionType, TasUellSdkModule, TasUserRole, TasUtilityService, TasVideocallComponent, TasWaitingRoomComponent, UserCallAction, UserGeoViewState, UserStatus, VideoSessionStatus, ViewMode, WaitingRoomState };
 //# sourceMappingURL=tas-uell-sdk.mjs.map