/* ANDALUS_WEBSITE_CLEANUP_V1 (plan 8.1): moved out of index.php so the browser keeps it (was inline on every visit). */
/* andalus-product-actions-inline-v5 */
/* ==========================================================
   FINAL PRODUCT ACTIONS
   DESKTOP = 3 BUTTONS
   MOBILE  = STACKED
   Delivered inline to bypass blocked external CSS.
   ========================================================== */


/* ---------- CATEGORY ---------- */

html body .an-cat-actions-row.pactions{
    display:grid !important;
    grid-template-columns:
        minmax(0,1.25fr)
        minmax(0,1fr)
        minmax(0,1fr) !important;

    gap:8px !important;

    width:100% !important;
    max-width:100% !important;

    margin:12px 0 0 !important;
    padding:0 !important;

    overflow:visible !important;
}


html body .an-cat-actions-row.pactions > .an-cat-btn,
html body .an-cat-actions-row.pactions > button{
    box-sizing:border-box !important;

    position:relative !important;

    inset:auto !important;
    float:none !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    height:48px !important;
    min-height:48px !important;
    max-height:48px !important;

    margin:0 !important;
    padding:0 10px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:7px !important;

    border-radius:14px !important;

    font-family:inherit !important;
    font-size:13px !important;
    font-weight:900 !important;
    line-height:1 !important;

    white-space:nowrap !important;

    text-align:center !important;
    text-decoration:none !important;

    overflow:hidden !important;

    transform:none !important;
}


/* Ask */
html body .an-cat-actions-row.pactions > .ask{
    grid-column:1 !important;
    grid-row:1 !important;

    background:#159447 !important;
    color:#fff !important;

    border:1px solid #159447 !important;

    box-shadow:
        0 6px 14px
        rgba(21,148,71,.14) !important;
}


/* Details */
html body .an-cat-actions-row.pactions > .an-cat-btn--details{
    grid-column:2 !important;
    grid-row:1 !important;

    background:#fff !important;
    color:#711f2b !important;

    border:1.5px solid #7b2936 !important;

    box-shadow:none !important;
}


/* Share */
html body .an-cat-actions-row.pactions > .an-cat-share{
    grid-column:3 !important;
    grid-row:1 !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    height:48px !important;
    min-height:48px !important;
    max-height:48px !important;

    padding:0 8px !important;

    background:#f7f2ed !important;
    color:#332629 !important;

    border:1px solid #d9cbc4 !important;

    border-radius:14px !important;

    box-shadow:none !important;

    appearance:none !important;
    -webkit-appearance:none !important;
}


/* Unhide actual share text */
html body
.an-cat-actions-row.pactions
> .an-cat-share
.an-cat-sr-only{
    position:static !important;

    display:inline-block !important;

    width:auto !important;
    height:auto !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;

    clip:auto !important;
    clip-path:none !important;

    border:0 !important;

    white-space:nowrap !important;

    font-size:13px !important;
    font-weight:900 !important;
    line-height:1 !important;
}


html body
.an-cat-actions-row.pactions
> .an-cat-share svg{
    display:block !important;

    width:18px !important;
    height:18px !important;

    min-width:18px !important;
    max-width:18px !important;

    flex:0 0 18px !important;

    stroke:currentColor !important;
    fill:none !important;

    stroke-width:1.8 !important;
}


/* Category cards without details */
html body
.an-cat-actions-row.pactions:not(.has-details){
    grid-template-columns:
        minmax(0,1fr)
        minmax(0,1fr) !important;
}


html body
.an-cat-actions-row.pactions:not(.has-details)
> .ask{
    grid-column:1 !important;
}


html body
.an-cat-actions-row.pactions:not(.has-details)
> .an-cat-share{
    grid-column:2 !important;
}


/* ---------- HOMEPAGE ---------- */

html body .actions.threeActions{
    display:grid !important;

    grid-template-columns:
        minmax(0,1.25fr)
        minmax(0,1fr)
        minmax(0,1fr) !important;

    gap:8px !important;

    width:100% !important;

    margin-top:12px !important;

    overflow:visible !important;
}


html body .actions.threeActions > .ask,
html body .actions.threeActions > .productDetails,
html body .actions.threeActions > .shareProduct{
    box-sizing:border-box !important;

    position:relative !important;

    inset:auto !important;
    float:none !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    height:48px !important;
    min-height:48px !important;
    max-height:48px !important;

    margin:0 !important;
    padding:0 10px !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    gap:7px !important;

    border-radius:14px !important;

    font-family:inherit !important;
    font-size:13px !important;
    font-weight:900 !important;
    line-height:1 !important;

    white-space:nowrap !important;

    text-align:center !important;
    text-decoration:none !important;

    overflow:hidden !important;

    transform:none !important;
}


html body .actions.threeActions > .ask{
    grid-column:1 !important;

    background:#159447 !important;
    color:#fff !important;

    border:1px solid #159447 !important;

    box-shadow:
        0 6px 14px
        rgba(21,148,71,.14) !important;
}


html body .actions.threeActions > .productDetails{
    grid-column:2 !important;

    background:#fff !important;
    color:#711f2b !important;

    border:1.5px solid #7b2936 !important;

    box-shadow:none !important;
}


html body .actions.threeActions > .shareProduct{
    grid-column:3 !important;

    background:#f7f2ed !important;
    color:#332629 !important;

    border:1px solid #d9cbc4 !important;

    box-shadow:none !important;
}


/* show the real existing span */
html body
.actions.threeActions
> .shareProduct span{
    display:inline-block !important;

    font-size:13px !important;
    font-weight:900 !important;

    white-space:nowrap !important;
}


/* Disable old V4 pseudo label */
html body
.actions.threeActions
> .shareProduct::after{
    content:none !important;
    display:none !important;
}


html body
.actions.threeActions
> .shareProduct svg{
    width:18px !important;
    height:18px !important;

    min-width:18px !important;

    flex:0 0 18px !important;

    display:block !important;

    stroke:currentColor !important;
    fill:none !important;
}


/* ---------- HOVER ---------- */

html body
.an-cat-actions-row.pactions
> .ask:hover,
html body
.actions.threeActions
> .ask:hover{
    background:#117f3d !important;
    border-color:#117f3d !important;
}


html body
.an-cat-actions-row.pactions
> .an-cat-btn--details:hover,
html body
.actions.threeActions
> .productDetails:hover{
    background:#741f2c !important;
    color:#fff !important;
    border-color:#741f2c !important;
}


html body
.an-cat-actions-row.pactions
> .an-cat-share:hover,
html body
.actions.threeActions
> .shareProduct:hover{
    background:#eee5df !important;
    color:#641e2b !important;
    border-color:#cbb9b0 !important;
}


/* ---------- MOBILE ---------- */

@media(max-width:700px){

    html body .an-cat-actions-row.pactions,
    html body .actions.threeActions{
        display:flex !important;

        flex-direction:column !important;

        gap:8px !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .an-cat-btn,

    html body
    .an-cat-actions-row.pactions
    > button,

    html body
    .actions.threeActions
    > .ask,

    html body
    .actions.threeActions
    > .productDetails,

    html body
    .actions.threeActions
    > .shareProduct{
        width:100% !important;

        min-width:100% !important;
        max-width:100% !important;

        height:48px !important;
        min-height:48px !important;
        max-height:48px !important;

        grid-column:auto !important;
        grid-row:auto !important;

        font-size:14px !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .ask,

    html body
    .actions.threeActions
    > .ask{
        order:1 !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .an-cat-btn--details,

    html body
    .actions.threeActions
    > .productDetails{
        order:2 !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .an-cat-share,

    html body
    .actions.threeActions
    > .shareProduct{
        order:3 !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .an-cat-share
    .an-cat-sr-only,

    html body
    .actions.threeActions
    > .shareProduct span{
        font-size:14px !important;
    }
}
/* andalus-product-actions-inline-v5-2 */
/* CATEGORY_SHARE_COMPACT_V5_2 */

/* ==========================================================
   DESKTOP / TABLET CARDS

   Ask       = enough room
   Details   = enough room
   Share     = widest secondary button

   Goal:
   keep every Arabic label fully inside its rectangle.
   ========================================================== */

@media (min-width:701px){

    html body .an-cat-actions-row.pactions,
    html body .actions.threeActions{
        display:grid !important;

        grid-template-columns:
            minmax(0,1.18fr)
            minmax(0,1.10fr)
            minmax(0,1.42fr) !important;

        gap:6px !important;

        width:100% !important;

        overflow:visible !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .an-cat-btn,

    html body
    .an-cat-actions-row.pactions
    > button,

    html body
    .actions.threeActions
    > .ask,

    html body
    .actions.threeActions
    > .productDetails,

    html body
    .actions.threeActions
    > .shareProduct{

        box-sizing:border-box !important;

        width:100% !important;
        min-width:0 !important;
        max-width:none !important;

        height:48px !important;
        min-height:48px !important;
        max-height:48px !important;

        padding-inline:5px !important;

        gap:4px !important;

        font-size:11px !important;
        font-weight:900 !important;
        line-height:1 !important;

        white-space:nowrap !important;

        overflow:hidden !important;

        text-align:center !important;
    }


    /* ASK */

    html body
    .an-cat-actions-row.pactions
    > .ask,

    html body
    .actions.threeActions
    > .ask{
        grid-column:1 !important;
        grid-row:1 !important;
    }


    /* DETAILS */

    html body
    .an-cat-actions-row.pactions
    > .an-cat-btn--details,

    html body
    .actions.threeActions
    > .productDetails{
        grid-column:2 !important;
        grid-row:1 !important;

        font-size:11px !important;

        padding-inline:4px !important;
    }


    /* SHARE */

    html body
    .an-cat-actions-row.pactions
    > .an-cat-share,

    html body
    .actions.threeActions
    > .shareProduct{
        grid-column:3 !important;
        grid-row:1 !important;

        width:100% !important;
        min-width:0 !important;
        max-width:none !important;

        padding-inline:4px !important;

        justify-content:center !important;

        direction:rtl !important;

        overflow:hidden !important;
    }


    /*
       Category share text.
       Explicit reset of old screen-reader-only styling.
    */

    html body
    .an-cat-actions-row.pactions
    > .an-cat-share
    .an-cat-sr-only{

        position:static !important;

        display:block !important;

        flex:0 1 auto !important;

        width:auto !important;
        min-width:0 !important;
        max-width:calc(100% - 18px) !important;

        height:auto !important;

        margin:0 !important;
        padding:0 !important;

        overflow:visible !important;

        clip:auto !important;
        clip-path:none !important;

        border:0 !important;

        font-size:10.5px !important;
        font-weight:900 !important;
        line-height:1 !important;

        white-space:nowrap !important;

        direction:rtl !important;
        text-align:center !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .an-cat-share svg{

        display:block !important;

        width:14px !important;
        height:14px !important;

        min-width:14px !important;
        max-width:14px !important;

        flex:0 0 14px !important;

        margin:0 !important;

        overflow:visible !important;
    }


    /*
       Homepage has a normal visible span rather than
       an-cat-sr-only.
    */

    html body
    .actions.threeActions
    > .shareProduct span{

        display:block !important;

        flex:0 1 auto !important;

        min-width:0 !important;
        max-width:calc(100% - 18px) !important;

        margin:0 !important;
        padding:0 !important;

        font-size:10.5px !important;
        font-weight:900 !important;
        line-height:1 !important;

        white-space:nowrap !important;

        overflow:visible !important;
    }


    html body
    .actions.threeActions
    > .shareProduct svg{

        width:14px !important;
        height:14px !important;

        min-width:14px !important;
        max-width:14px !important;

        flex:0 0 14px !important;
    }


    /*
       Two-button cards: there is no details button.
       Split the available width equally.
    */

    html body
    .an-cat-actions-row.pactions:not(.has-details){

        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr) !important;
    }


    html body
    .an-cat-actions-row.pactions:not(.has-details)
    > .ask{
        grid-column:1 !important;
    }


    html body
    .an-cat-actions-row.pactions:not(.has-details)
    > .an-cat-share{
        grid-column:2 !important;
    }
}


/* ==========================================================
   MOBILE

   Full width, so restore larger readable labels.
   ========================================================== */

@media (max-width:700px){

    html body
    .an-cat-actions-row.pactions,

    html body
    .actions.threeActions{

        display:flex !important;

        flex-direction:column !important;

        gap:8px !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .an-cat-btn,

    html body
    .an-cat-actions-row.pactions
    > button,

    html body
    .actions.threeActions
    > .ask,

    html body
    .actions.threeActions
    > .productDetails,

    html body
    .actions.threeActions
    > .shareProduct{

        width:100% !important;
        min-width:100% !important;
        max-width:100% !important;

        height:48px !important;
        min-height:48px !important;
        max-height:48px !important;

        padding-inline:12px !important;

        gap:7px !important;

        font-size:14px !important;

        overflow:hidden !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .an-cat-share
    .an-cat-sr-only,

    html body
    .actions.threeActions
    > .shareProduct span{

        position:static !important;

        display:inline-block !important;

        width:auto !important;
        min-width:0 !important;
        max-width:none !important;

        height:auto !important;

        overflow:visible !important;

        clip:auto !important;
        clip-path:none !important;

        font-size:14px !important;
        font-weight:900 !important;
        line-height:1 !important;

        white-space:nowrap !important;
    }


    html body
    .an-cat-actions-row.pactions
    > .an-cat-share svg,

    html body
    .actions.threeActions
    > .shareProduct svg{

        width:18px !important;
        height:18px !important;

        min-width:18px !important;
        max-width:18px !important;

        flex:0 0 18px !important;
    }
}
/* an-home-section-photos */
/* ANDALUS_HOME_SECTION_PHOTOS_V2: same size cards, the whole photo inside a fixed 4:3 frame, text under it */
html body .categoryPick{grid-template-columns:repeat(5,minmax(0,1fr))!important;grid-auto-rows:1fr;gap:14px!important}
/* ANDALUS_MATTRESS_SECTION_CARD_V1: 10 cards (+ المراتب) = 2 rows of 5 on computers and iPad landscape, 2 per row below */
@media(max-width:980px){html body .categoryPick{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(min-width:981px) and (max-width:1279px){html body .categoryPick .catCard--photo .catCardCopy{padding:12px 12px 4px}html body .categoryPick .catCard--photo .catCardCopy strong{font-size:1.1rem!important}html body .categoryPick .catCard--photo .catCardCopy span{font-size:.8rem!important}html body .categoryPick .catCard--photo .arrow{margin:6px 12px 12px!important;padding:6px 12px!important;font-size:.8rem!important}}
html body .categoryPick .catCard.catCard--photo{position:relative;display:flex!important;flex-direction:column!important;justify-content:flex-start!important;align-items:stretch!important;gap:0!important;padding:0!important;min-height:0!important;height:100%;border-radius:22px!important;overflow:hidden;text-align:right!important;background:linear-gradient(135deg,#4d3523 0%,#7c5b3f 55%,#a87d4c 100%)!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:0 14px 34px rgba(59,39,21,.14)!important;isolation:isolate}
html body .categoryPick .catCard.catCard--photo:before,html body .categoryPick .catCard.catCard--photo:after{display:none!important}
html body .catCard--photo .catPhoto{position:relative;display:block;width:100%;aspect-ratio:4/3;overflow:hidden;background:#efe4d8;flex:0 0 auto}
html body .catCard--photo .catPhoto i{position:absolute;inset:-12%;background:center/cover no-repeat;filter:blur(18px) saturate(1.05);opacity:.55}
html body .catCard--photo .catPhoto img{position:relative;display:block;width:100%;height:100%;object-fit:contain;transition:transform .45s ease}
html body .catCard--photo:hover .catPhoto img,html body .catCard--photo:focus-visible .catPhoto img{transform:scale(1.04)}
html body .categoryPick .catCard--photo .catCardCopy{position:relative;z-index:2;flex:1 1 auto;align-items:flex-start!important;justify-content:center;text-align:right!important;width:100%;padding:14px 16px 4px;gap:3px}
html body .categoryPick .catCard--photo .catCardCopy strong{color:#fff!important;font-size:1.3rem!important;line-height:1.3!important}
html body .categoryPick .catCard--photo .catCardCopy span{color:#f6e7d8!important;font-size:.88rem!important;font-weight:800!important;line-height:1.5!important}
html body .catCard--photo .catMeta b,html body .catCard--photo .catMeta i{font-weight:800;font-style:normal;white-space:nowrap}
html body .catCard--photo .catMeta i{color:#ffd98a}
html body .catCard--photo .catMeta s{text-decoration:none}
html body .categoryPick .catCard--photo .arrow{position:relative;z-index:2;align-self:flex-start;width:auto!important;margin:8px 16px 16px!important;padding:7px 15px!important;font-size:.86rem!important;white-space:nowrap!important}
@media(max-width:700px){
  html body .categoryPick{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  html body .categoryPick .catCard.catCard--photo{border-radius:16px!important}
  html body .categoryPick .catCard--photo .arrow{display:none!important}
  html body .catCard--photo .catMeta b,html body .catCard--photo .catMeta i{display:block}
  html body .catCard--photo .catMeta s{display:none}
  html body .categoryPick .catCard--photo .catCardCopy{padding:10px 11px 12px;justify-content:flex-start}
  html body .categoryPick .catCard--photo .catCardCopy strong{font-size:1.02rem!important}
  html body .categoryPick .catCard--photo .catCardCopy span{font-size:.82rem!important}
}
@media(prefers-reduced-motion:reduce){html body .catCard--photo .catPhoto img{transition:none}}
