/* ============================================================
   TeleBeing V910D Accordion Redesign - FINAL REPLACE
   Matches approved compact mockup:
   icon left, text left, plus button right, smaller height.
   Load LAST after all V900/V910 CSS files.
   ============================================================ */

.tb-v910d-accordion-final,
.tb-v788-collapse,
.zbiz-why,
details.tb-v788-collapse{
    width:100% !important;
    margin:10px 0 !important;
    border-radius:18px !important;
    overflow:visible !important;
}

/* Full clickable header row */
.tb-v910d-accordion-final > summary,
.tb-v788-collapse > summary,
.zbiz-why > summary,
details.tb-v788-collapse > summary{
    position:relative !important;
    display:grid !important;
    grid-template-columns:74px minmax(0,1fr) 54px !important;
    align-items:center !important;
    column-gap:18px !important;
    min-height:88px !important;
    width:100% !important;
    padding:14px 18px !important;
    background:linear-gradient(135deg,#ffffff 0%,#fbfdff 100%) !important;
    border:1px solid #dbe7f7 !important;
    border-radius:16px !important;
    color:#07182f !important;
    cursor:pointer !important;
    box-shadow:0 8px 20px rgba(15,23,42,.045) !important;
    transition:all .18s ease !important;
    text-align:left !important;
}

.tb-v910d-accordion-final > summary:hover,
.tb-v788-collapse > summary:hover,
.zbiz-why > summary:hover,
details.tb-v788-collapse > summary:hover{
    background:linear-gradient(135deg,#ffffff 0%,#f6faff 100%) !important;
    border-color:#bfd7f7 !important;
    box-shadow:0 12px 26px rgba(37,99,235,.08) !important;
}

.tb-v910d-accordion-final > summary::-webkit-details-marker,
.tb-v788-collapse > summary::-webkit-details-marker,
.zbiz-why > summary::-webkit-details-marker,
details.tb-v788-collapse > summary::-webkit-details-marker{
    display:none !important;
}

/* Kill all previous pseudo-icon/plus from older patches */
.tb-v910d-accordion-final > summary:before,
.tb-v910d-accordion-final > summary:after,
.tb-v788-collapse > summary:before,
.tb-v788-collapse > summary:after,
.zbiz-why > summary:before,
.zbiz-why > summary:after,
details.tb-v788-collapse > summary:before,
details.tb-v788-collapse > summary:after{
    content:none !important;
    display:none !important;
    width:0 !important;
    height:0 !important;
}

/* Real icon */
.tb-v910d-final-icon{
    grid-column:1 !important;
    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    border-radius:50% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:linear-gradient(135deg,#eef5ff 0%,#ffffff 100%) !important;
    border:1px solid #dbeafe !important;
    box-shadow:0 10px 22px rgba(37,99,235,.10) !important;
    color:#2563eb !important;
    pointer-events:none !important;
}

.tb-v910d-final-icon svg{
    width:31px !important;
    height:31px !important;
    display:block !important;
    stroke:#2563eb !important;
}

/* Title text area */
.tb-v910d-final-title-wrap{
    grid-column:2 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:center !important;
    gap:6px !important;
    min-width:0 !important;
    width:100% !important;
    text-align:left !important;
    pointer-events:none !important;
}

.tb-v910d-final-title{
    display:block !important;
    width:100% !important;
    color:#07182f !important;
    font-size:20px !important;
    font-weight:950 !important;
    line-height:1.15 !important;
    letter-spacing:-.015em !important;
    text-align:left !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
}

.tb-v910d-final-sub{
    display:block !important;
    width:100% !important;
    color:#5b6b82 !important;
    font-size:14px !important;
    font-weight:500 !important;
    line-height:1.32 !important;
    text-align:left !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
}

/* Real plus button — pointer-events none so the summary click always works */
.tb-v910d-final-plus{
    grid-column:3 !important;
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    border-radius:50% !important;
    border:1px solid #bfdbfe !important;
    background:#ffffff !important;
    color:#2563eb !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:30px !important;
    font-weight:800 !important;
    line-height:1 !important;
    box-shadow:0 8px 16px rgba(37,99,235,.10) !important;
    justify-self:end !important;
    pointer-events:none !important;
    text-align:center !important;
}

.tb-v910d-accordion-final[open] > summary .tb-v910d-final-plus,
.tb-v788-collapse[open] > summary .tb-v910d-final-plus,
.zbiz-why[open] > summary .tb-v910d-final-plus{
    background:#2563eb !important;
    color:#ffffff !important;
    border-color:#2563eb !important;
}

/* Force all summary text left */
.tb-v910d-accordion-final > summary *,
.tb-v788-collapse > summary *,
.zbiz-why > summary *{
    text-align:left !important;
}

.tb-v910d-final-plus,
.tb-v910d-final-plus *{
    text-align:center !important;
}

/* Body */
.tb-v788-body,
.zbiz-why .tb-v788-body,
details.tb-v788-collapse .tb-v788-body{
    background:#ffffff !important;
    border:1px solid #e5eef8 !important;
    border-top:none !important;
    border-radius:0 0 16px 16px !important;
    padding:18px 22px !important;
    color:#334155 !important;
    font-size:14px !important;
    line-height:1.72 !important;
    text-align:left !important;
    box-shadow:0 10px 20px rgba(15,23,42,.03) !important;
}

/* Better spacing before the fixed ask bar */
#chatMessages,
.tb-chat-messages{
    padding-bottom:150px !important;
}

/* Mobile */
@media(max-width:760px){
    .tb-v910d-accordion-final > summary,
    .tb-v788-collapse > summary,
    .zbiz-why > summary,
    details.tb-v788-collapse > summary{
        grid-template-columns:52px minmax(0,1fr) 40px !important;
        column-gap:12px !important;
        min-height:74px !important;
        padding:12px 12px !important;
        border-radius:15px !important;
    }

    .tb-v910d-final-icon{
        width:48px !important;
        height:48px !important;
        min-width:48px !important;
    }

    .tb-v910d-final-icon svg{
        width:26px !important;
        height:26px !important;
    }

    .tb-v910d-final-title{
        font-size:16px !important;
        line-height:1.15 !important;
    }

    .tb-v910d-final-sub{
        font-size:12px !important;
        line-height:1.28 !important;
    }

    .tb-v910d-final-plus{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
        font-size:25px !important;
    }

    .tb-v788-body,
    .zbiz-why .tb-v788-body,
    details.tb-v788-collapse .tb-v788-body{
        padding:15px !important;
        font-size:13px !important;
    }
}

@media(max-width:430px){
    .tb-v910d-accordion-final > summary,
    .tb-v788-collapse > summary,
    .zbiz-why > summary{
        grid-template-columns:44px minmax(0,1fr) 34px !important;
        column-gap:9px !important;
        padding:11px !important;
        min-height:68px !important;
    }

    .tb-v910d-final-icon{
        width:42px !important;
        height:42px !important;
        min-width:42px !important;
    }

    .tb-v910d-final-icon svg{
        width:23px !important;
        height:23px !important;
    }

    .tb-v910d-final-title{
        font-size:14.5px !important;
    }

    .tb-v910d-final-sub{
        font-size:11px !important;
    }

    .tb-v910d-final-plus{
        width:32px !important;
        height:32px !important;
        min-width:32px !important;
        font-size:21px !important;
    }
}