/* ================= Display widget ================= */
.tfe-widget{
    width:100%;
}
.tfe-summary{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:22px;
    text-align:center;
}
.tfe-summary-number{
    font-size:26px;
    font-weight:800;
}
.tfe-summary-stars{
    --tfe-star-empty:#ddd;
    font-size:18px;
    letter-spacing:2px;
    color:#f5a623;
    direction:ltr;
    unicode-bidi:bidi-override;
    display:inline-block;
}
.tfe-summary-text{
    font-size:14px;
    color:#888;
}
.tfe-carousel-wrap{
    position:relative;
    width:100%;
}
.tfe-viewport{
    width:100%;
    overflow:hidden;
}
.tfe-track{
    --tfe-cols:3;
    --tfe-gap:20px;
    display:flex;
    gap:var(--tfe-gap);
}
.tfe-layout-carousel .tfe-track{
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    padding:4px 2px 10px;
}
.tfe-layout-carousel .tfe-track::-webkit-scrollbar{display:none}
.tfe-layout-grid .tfe-track{
    flex-wrap:wrap;
}
.tfe-slide{
    flex:0 0 calc((100% - (var(--tfe-cols) - 1) * var(--tfe-gap)) / var(--tfe-cols));
    min-width:0;
}
.tfe-layout-carousel .tfe-slide{
    scroll-snap-align:start;
}
.tfe-card{
    background:#eaf4fc;
    border-radius:16px;
    padding:24px;
    height:100%;
    box-sizing:border-box;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:6px;
}
.tfe-avatar-wrap{
    margin-bottom:6px;
}
.tfe-avatar{
    width:64px;
    height:64px;
    border-radius:50%;
    object-fit:cover;
    object-position:center center;
    box-sizing:border-box;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#e8e8ef;
    color:#fff;
    font-weight:700;
    font-size:22px;
}
.tfe-stars{
    --tfe-star-empty:#ddd;
    font-size:18px;
    letter-spacing:2px;
    color:#f5a623;
    direction:ltr;
    unicode-bidi:bidi-override;
    display:inline-block;
}
.tfe-star-empty{
    color:var(--tfe-star-empty);
}
.tfe-content{
    color:#444;
    font-size:15px;
    line-height:1.9;
    flex:1 1 auto;
}
.tfe-name{
    font-weight:700;
    color:#1a1a1a;
    margin-top:8px;
}
.tfe-role{
    font-size:13px;
    color:#888;
}
.tfe-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:42px;
    height:42px;
    border:0;
    border-radius:50%;
    background:#3b5fe2;
    color:#fff;
    font-size:18px;
    cursor:pointer;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:center;
}
.tfe-prev{left:-10px}
.tfe-next{right:-10px}
.tfe-dots{
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:14px;
}
.tfe-dot{
    width:9px;
    height:9px;
    border-radius:50%;
    background:transparent;
    border:2px solid #ccc;
    padding:0;
    cursor:pointer;
}
.tfe-dot.is-active{
    background:#3b5fe2;
    border-color:#3b5fe2;
}
.tfe-empty{
    padding:24px;
    text-align:center;
    color:#888;
    border:1px dashed #ccc;
    border-radius:10px;
}

@media(max-width:767px){
    .tfe-arrow{display:none}
}

/* ================= Submission form widget ================= */
.tfe-form-wrap{
    width:100%;
    max-width:560px;
}
.tfe-form-title{
    margin:0 0 16px;
    font-size:20px;
}
.tfe-field{
    margin-bottom:16px;
    display:flex;
    flex-direction:column;
    gap:6px;
}
.tfe-field label{
    font-size:14px;
    font-weight:600;
    color:#333;
}
.tfe-form input[type="text"],
.tfe-form input[type="tel"],
.tfe-form input[type="file"],
.tfe-form textarea{
    background:#f7f7f8;
    border:1px solid #e2e2e6;
    border-radius:10px;
    padding:10px 14px;
    font-size:14px;
    font-family:inherit;
    width:100%;
    box-sizing:border-box;
}
.tfe-form textarea{
    resize:vertical;
}
.tfe-rating-picker{
    --tfe-star-color:#f5a623;
    direction:ltr;
    unicode-bidi:bidi-override;
    display:inline-flex;
    gap:4px;
    font-size:28px;
    cursor:pointer;
}
.tfe-rating-star{
    color:#ddd;
    transition:color .15s ease;
}
.tfe-rating-star.is-filled{
    color:var(--tfe-star-color);
}
.tfe-hp-wrap{
    position:absolute;
    left:-9999px;
    top:-9999px;
    height:0;
    overflow:hidden;
}
.tfe-submit-btn{
    background:#3b5fe2;
    color:#fff;
    border:0;
    border-radius:10px;
    padding:11px 26px;
    font-size:15px;
    font-weight:600;
    cursor:pointer;
    font-family:inherit;
}
.tfe-submit-btn:disabled{
    opacity:.6;
    cursor:default;
}
.tfe-form-message{
    margin-top:12px;
    font-size:14px;
}
.tfe-form-message.is-success{
    color:#1a7f37;
}
.tfe-form-message.is-error{
    color:#c0392b;
}
.tfe-form-note{
    margin-top:10px;
    font-size:12px;
    color:#888;
}

/* ================= Submit-review popup (display widget) ================= */
.tfe-open-modal-wrap{
    display:flex;
    justify-content:center;
    margin-top:24px;
}
.tfe-open-modal-btn{
    background:#ffffff;
    color:#3b5fe2;
    border:2px solid #3b5fe2;
    border-radius:30px;
    padding:12px 32px;
    font-size:15px;
    font-weight:700;
    font-family:inherit;
    cursor:pointer;
}
.tfe-modal-overlay{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(20,20,30,.55);
    align-items:center;
    justify-content:center;
    padding:20px;
    z-index:9999;
}
.tfe-modal-overlay.is-open{
    display:flex;
}
.tfe-modal-box{
    position:relative;
    background:#fff;
    border-radius:16px;
    padding:30px;
    width:100%;
    max-width:520px;
    max-height:90vh;
    overflow-y:auto;
    box-sizing:border-box;
}
.tfe-modal-box .tfe-form-wrap{
    max-width:none;
}
.tfe-modal-close{
    position:absolute;
    top:12px;
    inset-inline-end:14px;
    width:32px;
    height:32px;
    border:0;
    border-radius:50%;
    background:#f2f2f5;
    color:#555;
    font-size:20px;
    line-height:1;
    cursor:pointer;
}
body.tfe-modal-open{
    overflow:hidden;
}

/* ================= Popup redesign ================= */
.tfe-modal-overlay{
    -webkit-backdrop-filter:blur(6px);
    backdrop-filter:blur(6px);
}
.tfe-modal-overlay.is-open{
    animation:tfe-fade .22s ease-out;
}
.tfe-modal-overlay.is-open .tfe-modal-box{
    animation:tfe-rise .32s cubic-bezier(.2,.9,.3,1.05);
}
@keyframes tfe-fade{from{opacity:0}to{opacity:1}}
@keyframes tfe-rise{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}

.tfe-modal-box{
    --tfe-accent:#3b5fe2;
    --tfe-accent-2:#6c8cff;
    padding:0;
    max-width:500px;
    overflow-x:hidden;
    box-shadow:0 30px 80px -20px rgba(20,25,60,.45);
}
.tfe-modal-header{
    position:relative;
    padding:34px 28px 52px;
    text-align:center;
    color:#fff;
    background:
        radial-gradient(circle at 12% 20%,rgba(255,255,255,.22),transparent 45%),
        radial-gradient(circle at 90% 90%,rgba(255,255,255,.14),transparent 40%),
        linear-gradient(135deg,var(--tfe-accent),var(--tfe-accent-2));
}
.tfe-modal-badge{
    position:absolute;
    left:50%;
    bottom:-28px;
    transform:translateX(-50%);
    width:56px;
    height:56px;
    border-radius:50%;
    background:#fff;
    color:#f5a623;
    font-size:28px;
    line-height:56px;
    text-align:center;
    box-shadow:0 8px 22px -6px rgba(20,25,60,.35);
}
.tfe-modal-title{
    margin:0;
    font-size:21px;
    font-weight:800;
    line-height:1.5;
    color:inherit;
}
.tfe-modal-subtitle{
    margin:6px auto 0;
    max-width:36ch;
    font-size:13.5px;
    line-height:1.8;
    opacity:.88;
    color:inherit;
}
.tfe-modal-box .tfe-modal-close{
    z-index:2;
    background:rgba(255,255,255,.2);
    color:#fff;
    transition:background .15s ease;
}
.tfe-modal-box .tfe-modal-close:hover{background:rgba(255,255,255,.35)}
.tfe-modal-body{
    padding:44px 28px 26px;
}

.tfe-variant-popup .tfe-field{margin-bottom:14px;position:relative}
.tfe-variant-popup .tfe-field label{font-size:13px;font-weight:700;color:#3a3f55}
.tfe-variant-popup .tfe-field-rating{align-items:center;text-align:center;margin-bottom:20px}
.tfe-variant-popup .tfe-rating-picker{font-size:40px;gap:6px}
.tfe-variant-popup .tfe-rating-star{
    transition:color .15s ease,transform .15s ease;
    transform-origin:center;
}
.tfe-variant-popup .tfe-rating-star:hover{transform:scale(1.18)}
.tfe-variant-popup .tfe-rating-picker.is-hover .tfe-rating-star{color:#ddd}
.tfe-variant-popup .tfe-rating-picker.is-hover .tfe-rating-star.is-preview{color:var(--tfe-star-color)}
.tfe-rating-label{
    min-height:22px;
    font-size:14px;
    font-weight:800;
    color:var(--tfe-accent,#3b5fe2);
}
.tfe-rating-label:empty{display:none}

.tfe-input-wrap{position:relative}
.tfe-input-icon{
    position:absolute;
    inset-inline-start:14px;
    top:50%;
    transform:translateY(-50%);
    color:#9aa1bd;
    pointer-events:none;
    transition:color .15s ease;
}
.tfe-variant-popup .tfe-input-wrap:focus-within .tfe-input-icon{color:var(--tfe-accent)}
.tfe-variant-popup .tfe-form input[type="text"],
.tfe-variant-popup .tfe-form input[type="tel"],
.tfe-variant-popup .tfe-form textarea{
    background:#f4f6fc;
    border:1.5px solid transparent;
    border-radius:14px;
    padding:13px 16px;
    font-size:14.5px;
    transition:border-color .15s ease,background .15s ease,box-shadow .15s ease;
}
.tfe-variant-popup .tfe-input-wrap input{padding-inline-start:44px}
.tfe-variant-popup .tfe-form input:focus,
.tfe-variant-popup .tfe-form textarea:focus{
    outline:none;
    background:#fff;
    border-color:var(--tfe-accent);
    box-shadow:0 0 0 4px color-mix(in srgb,var(--tfe-accent) 16%,transparent);
}
.tfe-variant-popup .tfe-form textarea{min-height:110px;line-height:1.8}
.tfe-counter{
    position:absolute;
    inset-inline-end:12px;
    bottom:10px;
    font-size:11px;
    color:#9aa1bd;
    pointer-events:none;
}

.tfe-dropzone{
    display:flex;
    align-items:center;
    gap:14px;
    padding:12px 14px;
    border:1.5px dashed #c5cbe3;
    border-radius:14px;
    cursor:pointer;
    background:#fafbff;
    transition:border-color .15s ease,background .15s ease;
}
.tfe-dropzone:hover{border-color:var(--tfe-accent);background:#f4f6fc}
.tfe-dropzone-preview{
    flex:0 0 48px;
    width:48px;
    height:48px;
    border-radius:50%;
    background:#e8ecfb center/cover no-repeat;
    color:var(--tfe-accent);
    display:flex;
    align-items:center;
    justify-content:center;
}
.tfe-dropzone-preview.has-image svg{display:none}
.tfe-dropzone-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.tfe-dropzone-text strong{font-size:13px;color:#3a3f55}
.tfe-dropzone-text small{font-weight:400;font-size:11.5px;color:#8a90aa;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tfe-dropzone-input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}

.tfe-variant-popup .tfe-submit-btn{
    width:100%;
    margin-top:6px;
    padding:15px 20px;
    border-radius:14px;
    font-size:15.5px;
    font-weight:800;
    color:#fff;
    background:linear-gradient(135deg,var(--tfe-accent),var(--tfe-accent-2));
    box-shadow:0 12px 24px -10px var(--tfe-accent);
    transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease;
}
.tfe-variant-popup .tfe-submit-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 16px 28px -10px var(--tfe-accent)}
.tfe-variant-popup .tfe-form-note{text-align:center;margin-top:12px}
.tfe-variant-popup .tfe-form-message:not(:empty){
    padding:12px 14px;
    border-radius:12px;
    text-align:center;
    font-weight:700;
}
.tfe-variant-popup .tfe-form-message.is-success{background:#e7f6ec}
.tfe-variant-popup .tfe-form-message.is-error{background:#fdecea}

/* Sent state: collapse the form into a clear confirmation. */
.tfe-variant-popup.is-sent .tfe-field,
.tfe-variant-popup.is-sent .tfe-submit-btn,
.tfe-variant-popup.is-sent .tfe-form-note{display:none}
.tfe-variant-popup.is-sent .tfe-form-message{
    padding:34px 16px 26px;
    font-size:16px;
    line-height:1.9;
    background:none;
}
.tfe-variant-popup.is-sent .tfe-form-message::before{
    content:"✓";
    display:flex;
    align-items:center;
    justify-content:center;
    width:64px;
    height:64px;
    margin:0 auto 14px;
    border-radius:50%;
    background:#1a7f37;
    color:#fff;
    font-size:32px;
    animation:tfe-pop .4s cubic-bezier(.2,1.4,.4,1);
}
@keyframes tfe-pop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}

@media(max-width:480px){
    .tfe-modal-overlay{padding:10px;align-items:flex-end}
    .tfe-modal-body{padding:44px 18px 20px}
    .tfe-modal-header{padding:30px 18px 50px}
    .tfe-variant-popup .tfe-rating-picker{font-size:34px}
}
@media(prefers-reduced-motion:reduce){
    .tfe-modal-overlay.is-open,
    .tfe-modal-overlay.is-open .tfe-modal-box,
    .tfe-variant-popup.is-sent .tfe-form-message::before{animation:none}
}