/* Khaled Product Actions - frontend base styles */
.khaled-single-actions-wrap{display:flex;flex-direction:column;gap:12px;width:100%;margin:15px 0;box-sizing:border-box}
.khaled-buttons-area{display:flex;flex-direction:column;gap:10px;width:100%}
.khaled-action-row-1,.khaled-action-row-2{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}
.khaled-action-row-1 .khaled-main-buy-btn{flex:1}
.khaled-qty-box{display:flex;align-items:center;border:1px solid #cbd5e1;border-radius:10px;overflow:hidden;background:#fff}
.khaled-qty-btn{width:38px;height:44px;border:0;background:transparent;font-size:18px;cursor:pointer;line-height:1}
.khaled-qty-input{width:50px;height:44px;border:0;text-align:center;font-weight:600;background:transparent;-moz-appearance:textfield}
.khaled-qty-input::-webkit-outer-spin-button,.khaled-qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.khaled-main-buy-btn,.khaled-sub-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;font-weight:600;text-decoration:none;border-radius:10px;transition:.2s}
.khaled-sub-btn{flex:1}
.khaled-main-buy-btn:hover,.khaled-sub-btn:hover{opacity:.9;text-decoration:none}
.khaled-main-buy-btn.loading,.khaled-sub-btn.loading{opacity:.6;pointer-events:none}

/* Layouts */
.khaled-layout-stacked .khaled-action-row-1,.khaled-layout-stacked .khaled-action-row-2{flex-direction:column}
.khaled-layout-compact .khaled-buttons-area{flex-direction:row;flex-wrap:wrap}
.khaled-layout-split .khaled-action-row-2 .khaled-sub-btn{flex:1 1 45%}

/* Floating call button */
.kpa-floating-call{position:fixed;bottom:20px;z-index:9999;display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:50px;font-weight:700;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.kpa-floating-call.kpa-pos-right{right:20px}
.kpa-floating-call.kpa-pos-left{left:20px}
.kpa-phone-icon::before{content:"\260E";font-size:18px;line-height:1}
@media (min-width:768px){.kpa-floating-call.kpa-mobile-only{display:none}}
@media (max-width:767px){.khaled-action-row-2 .khaled-sub-btn{flex:1 1 100%}}

/* ===== v4.3: variation validation, button states, responsive ===== */
.khaled-variation-row{transition:.15s}
.khaled-variation-label{font-weight:600;font-size:14px}
.kpa-required{color:#dc2626}
.khaled-variation-row.is-missing .khaled-variation-label{color:#dc2626}
.khaled-variation-row.is-missing .khaled-variation-radio span{border-color:#dc2626!important;animation:kpa-shake .35s}
@keyframes kpa-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.kpa-message{padding:10px 14px;border-radius:8px;font-size:14px;font-weight:500;line-height:1.4}
.kpa-message.is-error{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}
.kpa-message.is-success{background:#f0fdf4;color:#15803d;border:1px solid #bbf7d0}
.khaled-buttons-area{align-items:var(--kpa-align,stretch)}
.khaled-single-actions-wrap .kpa-action-btn{position:relative;min-height:var(--kpa-h,46px);padding:var(--kpa-py,10px) var(--kpa-px,18px);font-size:var(--kpa-fs,15px);font-weight:var(--kpa-fw,600);border:var(--kpa-border-w,0) solid var(--kpa-border,transparent);box-sizing:border-box;user-select:none}
.khaled-single-actions-wrap .kpa-action-btn:hover{background-color:var(--kpa-hover-bg);color:var(--kpa-hover-text);opacity:1}
.khaled-single-actions-wrap .kpa-action-btn:active{transform:scale(.97)}
.kpa-action-btn .kpa-icon{width:1.1em;height:1.1em;flex:none}
.kpa-spinner,.kpa-check{display:none}
.kpa-action-btn.is-loading{opacity:.85!important;pointer-events:none;cursor:progress}
.kpa-action-btn.is-loading .kpa-spinner{display:inline-block;width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:kpa-spin .7s linear infinite}
.kpa-action-btn.is-loading .kpa-icon,.kpa-action-btn.is-loading svg:not(.kpa-icon),.kpa-action-btn.is-loading i{display:none}
.kpa-action-btn.is-locked:not(.is-loading){pointer-events:none;opacity:.7}
.kpa-action-btn.is-success{background-color:var(--kpa-success-bg,#16a34a)!important;color:var(--kpa-success-text,#fff)!important}
.kpa-action-btn.is-success .kpa-check{display:inline}
.kpa-action-btn.is-disabled{opacity:.5!important;cursor:not-allowed}
@keyframes kpa-spin{to{transform:rotate(360deg)}}
.khaled-variation-options{flex-wrap:wrap}
@media (max-width:767px){
  .khaled-variation-radio span{min-height:40px}
  .khaled-single-actions-wrap .kpa-action-btn{white-space:normal!important;text-align:center}
  .khaled-action-row-1{flex-wrap:wrap}
  .khaled-action-row-1 .kpa-action-btn{flex:1 1 160px}
}
