@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;600;700&display=swap');

/* SHAMODEST aftercare only: monochrome storefront palette, no global overrides. */
.sm-aftercare,
.shamodest-aftercare-profile { --sm-ink:#171717; --sm-muted:#6b6b6b; --sm-line:#e6e3df; --sm-paper:#f8f7f5; --sm-white:#fff; }
.sm-aftercare { box-sizing:border-box; margin:0; min-height:100vh; background:var(--sm-paper); color:var(--sm-ink); font:14px/1.6 Montserrat,Arial,sans-serif; }
.sm-aftercare *, .shamodest-aftercare-profile * { box-sizing:border-box; }
html[dir="rtl"] .sm-aftercare, html[dir="rtl"] .shamodest-aftercare-profile {font-family:Tajawal,Arial,sans-serif;}
.sm-aftercare a,.shamodest-aftercare-profile a { color:inherit; }
.sm-a-head { background:var(--sm-white); border-bottom:1px solid var(--sm-line); padding:16px clamp(16px,5vw,65px);display:flex;align-items:center;justify-content:space-between;gap:18px; }
.sm-a-logo {display:inline-flex;align-items:center;text-decoration:none;flex:0 1 190px;max-width:190px;}
.sm-a-logo img {display:block;width:100%;height:auto;max-height:65px;object-fit:contain;object-position:left center;}
html[dir="rtl"] .sm-a-logo img {object-position:right center;}
.sm-a-head>a:not(.sm-a-logo){font-size:12px;text-decoration:underline;text-underline-offset:3px;}
.sm-a-container{max-width:1160px;margin:45px auto;padding:0 22px 65px;}
.sm-a-narrow{max-width:650px;}
.sm-a-container h1{font:normal clamp(27px,3vw,40px) Georgia,serif;margin:3px 0 14px;color:var(--sm-ink);}
.sm-a-container h2{font:normal clamp(20px,2vw,25px) Georgia,serif;margin:0 0 22px;color:var(--sm-ink);}
.sm-a-container h3{font-size:16px;font-weight:600;margin:0 0 12px;}
.sm-a-kicker{text-transform:uppercase;letter-spacing:1.5px;color:var(--sm-muted);font-size:11px;margin:0 0 8px;}
.sm-a-top{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:26px;}
.sm-a-two{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(270px,.82fr);gap:22px;align-items:start;}
.sm-a-panel{padding:26px;background:#fff;border:1px solid var(--sm-line);margin-bottom:20px;min-width:0;}
.sm-a-item{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:13px;padding:14px 0;border-bottom:1px solid var(--sm-line);align-items:start;}
.sm-a-item img{width:74px;height:99px;object-fit:cover;background:#f3f3f3;}
.sm-a-item p,.sm-a-muted,.sm-a-item small{color:var(--sm-muted);font-size:12px;}
.sm-a-item p{margin:4px 0;}
.sm-a-item>span{font-weight:600;white-space:nowrap;font-size:12px;}
.sm-a-total,.sm-a-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;}
.sm-a-total{margin-top:14px;}
.sm-a-row{border-bottom:1px solid var(--sm-line);font-size:12px;}
.sm-a-row span{color:var(--sm-muted);}
.sm-aftercare label{display:block;font-size:13px;font-weight:600;margin:15px 0 7px;}
.sm-aftercare input:not(.header-search-field):not(.header-search-button),.sm-aftercare select:not(.shamodest-language-switcher select),.sm-aftercare textarea{width:100%;padding:12px;border:1px solid #d5d2cc;background:#fff;color:inherit;font:inherit;border-radius:0;}
.sm-a-quantity{display:flex;align-items:center;}
.sm-a-quantity input{width:65px;text-align:center;}
.sm-a-button,.shamodest-aftercare-profile .sm-identity-btn{
  background-color:#171717 !important;color:#fff !important;border:1px solid #171717 !important;
  border-radius:2px !important;min-height:45px;display:inline-flex;align-items:center;justify-content:center;
  padding:13px 24px !important;font-family:inherit;font-size:13px !important;font-weight:600;
  text-decoration:none;text-align:center;cursor:pointer;margin-top:14px;background-image:none !important;transition:background-color .2s,color .2s;
}
.sm-a-button{width:100%;}
.sm-a-button:hover,.shamodest-aftercare-profile .sm-identity-btn:hover{background-color:#353535 !important;color:#fff !important;}
.sm-a-outline{background:#fff !important;color:#171717 !important;}
.sm-a-outline:hover{background:#f2f2f2 !important;color:#171717 !important;}
.sm-a-notice{padding:14px;background:#f5f5f5;border:1px solid #d2d2d2;color:#171717;}
.sm-a-error{padding:15px;background:#fff5f5;border:1px solid #e8c5c5;}
.sm-a-foot{background:#f1efeb;padding:22px;text-align:center;font-size:11px;border-top:1px solid var(--sm-line);}
.sm-a-foot a{margin-inline-start:12px;}
.sm-a-text-link{font-size:12px;text-decoration:underline;text-underline-offset:3px;}
html[dir="rtl"] .sm-a-container{text-align:right;}
html[dir="rtl"] .sm-a-container h1,html[dir="rtl"] .sm-a-container h2{font-family:Tajawal,Arial,sans-serif;}

/* Account tabs: the existing profile route displays information and orders in one page. */
.shamodest-aftercare-profile {background:var(--sm-paper) !important;color:var(--sm-ink) !important;}
.shamodest-aftercare-profile .shamodest-account-container{max-width:1160px;}
.shamodest-aftercare-profile .shamodest-account-top{padding-top:14px;}
.shamodest-aftercare-profile .shamodest-account-top img{max-width:190px;object-fit:contain;}
.shamodest-aftercare-profile .shamodest-account-header h1{color:var(--sm-ink) !important;}
.shamodest-aftercare-profile .shamodest-account-header p{color:var(--sm-muted);}
.shamodest-aftercare-profile .shamodest-panel{border-color:var(--sm-line);}
.shamodest-aftercare-profile .shamodest-panel h2{color:var(--sm-ink);}
.shamodest-aftercare-profile .shamodest-field input:focus{border-color:#171717;}
.shamodest-aftercare-profile .shamodest-account-actions a,
.shamodest-aftercare-profile .shamodest-account-actions button{color:#171717;}
.sm-account-tabs{display:flex;gap:0;border-bottom:1px solid #d7d4d0;margin:0 0 30px;}
.sm-account-tab{position:relative;padding:13px clamp(15px,3vw,29px);text-align:center;text-decoration:none !important;font-size:13px;font-weight:600;color:#777 !important;}
.sm-account-tab.is-active{color:#171717 !important;}
.sm-account-tab.is-active:after{content:"";position:absolute;inset-inline:0;bottom:-1px;height:2px;background:#171717;}
.sm-account-information-grid{grid-template-columns:minmax(0,1.6fr) minmax(270px,.8fr);}
.sm-account-orders{padding-bottom:30px;}
.sm-account-orders-intro{display:flex;justify-content:space-between;gap:20px;align-items:end;margin:0 0 23px;}
.sm-account-orders-intro h2{font:normal 26px Georgia,serif;margin:0 0 4px;}
.sm-account-orders-intro p{font-size:13px;color:var(--sm-muted);margin:0;}
.sm-account-order{border:1px solid var(--sm-line);background:white;margin-bottom:20px;}
.sm-account-order-head{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:19px 24px;border-bottom:1px solid var(--sm-line);}
.sm-account-order-head>div:first-child{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;}
.sm-account-order-head small{font-size:11px;color:var(--sm-muted);}
.sm-account-order-head strong{font-size:14px;}
.sm-account-order-states{display:flex;gap:8px;flex-wrap:wrap;}
.sm-account-order-states span{display:inline-block;padding:5px 11px;background:#f1f1f1;color:#222;border:1px solid #e4e4e4;font-size:11px;}
.sm-account-order-items{padding:4px 24px;}
.sm-account-order-item{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:15px;align-items:center;padding:15px 0;border-bottom:1px solid var(--sm-line);}
.sm-account-order-item:last-child{border-bottom:0;}
.sm-account-order-item img{display:block;width:72px;height:96px;object-fit:cover;background:#f2f2f2;}
.sm-account-order-item div{min-width:0;}
.sm-account-order-item strong,.sm-account-order-item small{display:block;overflow-wrap:anywhere;}
.sm-account-order-item strong{font-size:13px;margin-bottom:5px;}
.sm-account-order-item small{font-size:11px;color:var(--sm-muted);margin:2px 0;}
.sm-account-order-item>span{font-weight:600;font-size:12px;white-space:nowrap;}
.sm-account-order-foot{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:19px 24px;border-top:1px solid var(--sm-line);}
.sm-account-order-foot>strong{font-size:14px;}
.sm-account-order-foot .sm-identity-btn{margin:0;min-width:135px;}
.sm-account-orders-empty{border:1px solid var(--sm-line);background:#fff;padding:35px;font-size:13px;}
.sm-account-orders-empty a{text-decoration:underline;margin-inline-start:8px;}
@media(max-width:760px){
 .sm-a-two,.sm-account-information-grid{grid-template-columns:1fr;}
 .sm-a-container{margin:28px auto;padding-inline:15px;}
 .sm-a-panel{padding:19px;}
 .sm-a-logo{max-width:142px;flex-basis:142px;}
 .sm-a-item{grid-template-columns:63px minmax(0,1fr);}
 .sm-a-item img{width:63px;height:84px;}
 .sm-a-item>span{grid-column:2;}
 .sm-account-orders-intro{align-items:start;flex-direction:column;}
 .sm-account-order-head{align-items:flex-start;flex-direction:column;padding:16px;}
 .sm-account-order-items{padding:0 16px;}
 .sm-account-order-item{grid-template-columns:59px minmax(0,1fr);gap:12px;align-items:start;}
 .sm-account-order-item img{width:59px;height:78px;}
 .sm-account-order-item>span{grid-column:2;}
 .sm-account-order-foot{align-items:flex-start;flex-direction:column;padding:16px;}
 .sm-account-order-foot .sm-identity-btn{width:100%;}
 .sm-account-tabs{margin-bottom:22px;}
 .sm-account-tab{flex:1;}
}
/* The original account verification chip is green; use neutral styling here. */
.shamodest-aftercare-profile .shamodest-verified-badge {
  color:#333 !important;background:#f4f4f4 !important;border-color:#dedede !important;
}
.shamodest-aftercare-profile .shamodest-status {
  color:#171717 !important;background:#f5f5f5 !important;border-color:#d2d2d2 !important;
}

/* Preserve the exact shared storefront header/footer layer and navigation. */
.sm-aftercare .header-section,.shamodest-aftercare-profile .header-section{position:relative;z-index:50}
.sm-aftercare .sm-a-container,.shamodest-aftercare-profile .shamodest-account-container{position:relative;z-index:1}
.sm-aftercare .shamodest-footer,.shamodest-aftercare-profile .shamodest-footer{position:relative}

/* Shared storefront navbar isolation: customer/account layouts must not alter
   Webflow's original search input or position the global navigation in a padded body. */
body.shamodest-account-page.shamodest-aftercare-profile {
  padding: 0 !important;
}
/* Profile now extends the shared storefront layout; account content is inside
   .page-wrapper > .main-wrapper, like the rest of the shop. */
body.shamodest-account-page.shamodest-aftercare-profile .main-wrapper > .shamodest-account-container {
  padding: 28px 24px clamp(84px, 9vw, 124px);
  box-sizing: border-box;
}
/* Shared homepage search: leave Webflow's dropdown positioning and visibility untouched.
   Form controls outside the navbar retain their aftercare styles above. */

/* SHAMODEST account mobile: breathing room only for text and tabs OUTSIDE
   white content cards. Leave card edges, global navbar and footer untouched. */
@media screen and (max-width: 767px) {
  body.shamodest-account-page.shamodest-aftercare-profile .shamodest-account-header,
  body.shamodest-account-page.shamodest-aftercare-profile .sm-account-tabs,
  body.shamodest-account-page.shamodest-aftercare-profile .sm-account-orders-intro {
    padding-inline: 18px !important;
    box-sizing: border-box;
  }
  body.shamodest-account-page.shamodest-aftercare-profile .shamodest-account-header,
  body.shamodest-account-page.shamodest-aftercare-profile .sm-account-orders-intro {
    max-width: 100%;
    min-width: 0;
  }
}

/* Profile-only: keep a deliberate gap between the last account card and the footer
   on both tabs and on all viewports. No spacing changes to other pages. */
/* Profile-to-footer spacing is controlled above, not by padding on <body>. */
/* Authenticated Profile uses the same shared storefront header and mobile bottom
   navigation as all other shop pages; no focused login header exceptions. */

/* Equal-size buttons on mobile and desktop: never expand to the card width.
   Scope to account information so order action buttons are unaffected. */
.shamodest-aftercare-profile .sm-account-information-grid .sm-identity-btn {
  width: 200px !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 16px !important;
  margin-inline: 0 !important;
  font-size: 13px !important;
  line-height: 1.3 !important;
  white-space: normal;
  flex: 0 0 auto;
}
/* Log out: centered beneath Password Change, not full-card width. */
.shamodest-aftercare-profile .shamodest-account-side > .shamodest-profile-logout-form {
  box-sizing: border-box;
  width: 200px !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center;
  justify-content: center !important;
  justify-self: center !important;
}
.shamodest-aftercare-profile .shamodest-profile-logout-form .shamodest-profile-logout-button {
  width: 200px !important;
  max-width: 100% !important;
  margin: 0 auto !important;
}
@media screen and (max-width: 767px) {
  body.shamodest-account-page.shamodest-aftercare-profile .main-wrapper > .shamodest-account-container {
    padding: 24px 8px 32px !important;
  }

  /* Spacing belongs to the last card group, so it still works when the
     footer follows the common Laravel layout immediately. */
  .shamodest-aftercare-profile .shamodest-account-side > .shamodest-profile-logout-form {
    margin-bottom: 76px !important;
  }
}