*{box-sizing:border-box}body{margin:0;background:#f2f6f4;color:#173c30;font:16px/1.6 system-ui,sans-serif}header{background:#073d2b;color:white;padding:20px max(20px,calc((100vw - 1140px)/2));display:flex;justify-content:space-between;gap:20px;align-items:center}header a{color:white;text-decoration:none}small{display:block}header strong{letter-spacing:2px}main{max-width:1180px;margin:auto;padding:28px 20px}h1{font-size:clamp(28px,5vw,42px);margin:0 0 16px}h2{line-height:1.3}.eyebrow{letter-spacing:2px;font-size:12px;font-weight:800}.card{background:white;border:1px solid #dce7e0;border-radius:14px;padding:24px;margin:20px 0;min-width:0}.columns{display:grid;grid-template-columns:1fr 1fr;gap:20px}.columns .card{margin:0}label{display:block;font-weight:650;margin:14px 0}input,select,textarea{width:100%;padding:12px;border:1px solid #a5baae;border-radius:7px;font:inherit;margin-top:6px}button,.download{background:#086040;color:white;border:0;border-radius:7px;padding:12px 18px;font:inherit;font-weight:650;cursor:pointer;margin-top:12px}button:disabled{opacity:.5;cursor:wait}a{color:#075739}#messages{max-height:380px;overflow:auto}.message,.document{padding:16px 0;border-bottom:1px solid #dce7e0;overflow-wrap:anywhere}.message p{white-space:pre-wrap;margin:6px 0}.badge{display:inline-block;border-radius:6px;background:#fff0cc;color:#725100;padding:4px 9px;font-size:13px;font-weight:700}.badge.done{background:#dff3e7;color:#145435}#status{overflow-wrap:anywhere}#status.error{color:#a32424}[hidden]{display:none!important}@media(max-width:700px){.columns{grid-template-columns:1fr}header{padding:16px;align-items:flex-start;font-size:14px}.card{padding:18px}main{padding:24px 14px}}

.payment-card{border:1px solid #dce7e0;border-radius:10px;padding:18px;margin:16px 0}.payment-totals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.payment-totals strong{font-size:clamp(18px,2.5vw,27px);overflow-wrap:anywhere}#payment-form{border-top:1px solid #dce7e0;margin-top:24px;padding-top:12px}details{margin-top:20px}summary{cursor:pointer;font-weight:700}@media(max-width:700px){.payment-totals{grid-template-columns:1fr}}

.portal-hero{position:relative;min-height:470px;overflow:hidden;border-radius:18px;background:#073d2b;color:white}.portal-hero>img{position:absolute;width:100%;height:100%;object-fit:cover;inset:0}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,24,16,.9),rgba(1,24,16,.35))}.hero-copy{position:relative;padding:58px 42px 96px;max-width:750px}.hero-copy h1{font-size:clamp(32px,5vw,56px);line-height:1.12}.portal-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.portal-button,.portal-actions button{display:inline-flex;align-items:center;padding:15px 18px;background:white;color:#073d2b;text-decoration:none;border-radius:8px;font-size:14px;font-weight:800;margin:0}.portal-actions button{background:#0c6547;color:white;border:1px solid #9fbaad}.hero-controls{position:absolute;bottom:18px;left:40px;display:flex;align-items:center;gap:12px}.hero-controls button{margin:0;padding:8px 12px;background:rgba(0,0,0,.45);border:1px solid #9fbaad;font-size:14px}.purchased #purchase-image{display:block;width:100%;height:clamp(210px,40vw,440px);object-fit:contain;background:#ecf1ed;border-radius:10px}.purchase-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.purchase-controls button{margin:0}#photo-form{margin-top:24px;border-top:1px solid #dce7e0;padding-top:16px}#private-area{scroll-margin-top:20px}@media(max-width:600px){.hero-copy{padding:32px 22px 100px}.hero-controls{left:20px;gap:8px}.hero-controls button{font-size:12px}.portal-actions{flex-direction:column;align-items:stretch}.portal-actions>*{justify-content:center}.portal-hero{min-height:490px}}

.welcome-card{background:#e5f1e9;border-left:5px solid #086040;border-radius:12px;padding:22px 26px;margin:0 0 24px}.welcome-card h2{font-size:clamp(24px,4vw,34px);margin:6px 0 10px;overflow-wrap:anywhere}.welcome-card p{margin:6px 0;max-width:850px}

.cp-header-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.cp-header-actions button{margin:0;background:#fff1e9;color:#8b2626;border:1px solid #ffd1c5;padding:10px 16px}/* CARPRINCE Watchlist button: distinctive premium gold treatment */
.cp-watchlist-section{padding:16px}
.cp-watchlist-toggle{
  display:flex!important;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  width:100%;
  min-height:58px;
  padding:16px 20px;
  border:2px solid #c99a24;
  border-radius:12px;
  background:linear-gradient(135deg,#fff3c4 0%,#f3d77c 52%,#e6bb45 100%);
  color:#173c30!important;
  text-decoration:none!important;
  font-weight:900;
  letter-spacing:.035em;
  box-shadow:0 4px 12px rgba(116,83,12,.16);
  transition:filter .15s ease,transform .15s ease,box-shadow .15s ease;
}
.cp-watchlist-toggle>span:first-child{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.cp-watchlist-toggle #customer-watchlist-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:25px;
  min-height:25px;
  padding:2px 7px;
  border-radius:999px;
  background:#07533f;
  color:#fff;
  font-size:12px;
  letter-spacing:0;
}
.cp-watchlist-toggle:hover{filter:brightness(1.025);box-shadow:0 6px 15px rgba(116,83,12,.22);transform:translateY(-1px)}
.cp-watchlist-toggle:focus-visible{outline:3px solid #07533f;outline-offset:3px}
.cp-watchlist-toggle:active{transform:translateY(0)}
@media(max-width:600px){.cp-watchlist-section{padding:12px}.cp-watchlist-toggle{padding:14px 15px;min-height:54px;font-size:14px}}@media(max-width:600px){.cp-header-actions{justify-content:flex-end}.cp-header-actions a{font-size:12px}}

/* CARPRINCE private messages: distinguish admin and customer without changing message data. */
#messages{display:flex;flex-direction:column;gap:13px;max-height:520px;overflow-y:auto;padding:16px 12px;background:#f4f7f9;border:1px solid #dce7e0;border-radius:14px;scrollbar-gutter:stable}
#messages .cp-chat-message{display:block;flex:0 0 auto;width:fit-content;max-width:min(86%,620px);margin:0;padding:12px 15px;border-bottom:0;border-radius:16px;overflow-wrap:anywhere;box-shadow:0 2px 7px rgba(0,0,0,.08)}
#messages .cp-chat-message strong{display:block;font-size:12px;letter-spacing:.04em;margin-bottom:5px}
#messages .cp-chat-message p{white-space:pre-wrap;overflow-wrap:anywhere;margin:4px 0 8px;line-height:1.5}
#messages .cp-chat-message small{display:block;font-size:11px;line-height:1.45;opacity:.88}
#messages .cp-chat-admin{align-self:flex-start;background:#07533f;color:#fff;border:1px solid #07533f;border-bottom-left-radius:5px}
#messages .cp-chat-admin strong{color:#ffe17b}
#messages .cp-chat-customer{align-self:flex-end;background:#e5f0ff;color:#173b68;border:1px solid #a9c9ed;border-bottom-right-radius:5px}
#messages .cp-chat-customer strong{color:#173b68}
@media(max-width:600px){#messages{padding:11px 8px;gap:10px}#messages .cp-chat-message{max-width:91%;padding:10px 12px;font-size:14px}}

/* Dedicated customer pages: navigation and consistent mobile header */
.cp-subpage-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:20px;background:#fff;border:1px solid #dce7e0;border-radius:13px;padding:13px 16px}
.cp-subpage-nav[hidden]{display:none!important}
.cp-subpage-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;background:#07533f;color:white;text-decoration:none;border-radius:9px;font-weight:800}
.cp-subpage-nav strong{font-size:17px;color:#073d2b}
#profile>[hidden],#private-area>[hidden],.columns>[hidden]{display:none!important}
@media(max-width:600px){.cp-subpage-nav{align-items:stretch}.cp-subpage-nav a{width:100%}.cp-subpage-nav strong{text-align:center;width:100%}}

/* Customer subpage navigation and dedicated Watchlist page */
.cp-subpage-nav{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:16px 0;padding:12px;border:1px solid #d7e4dc;border-radius:12px;background:#f7faf8}
.cp-back-profile{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:9px;background:#07533f;color:#fff;text-decoration:none;font-weight:900;border:1px solid #e4b84a}
.cp-subpage-title{font-weight:900;color:#073d2b;margin:0}
.cp-watchlist-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.cp-watchlist-card{border:1px solid #dce7e1;border-radius:12px;overflow:hidden;background:#fff;min-width:0;box-shadow:0 3px 10px rgba(0,0,0,.05)}
.cp-watchlist-card img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#eaf0ed}
.cp-watchlist-card-body{padding:12px}.cp-watchlist-card h3{font-size:15px;line-height:1.35;margin:0 0 6px;overflow-wrap:anywhere}
.cp-watchlist-price{font-size:14px;font-weight:900;color:#07533f;margin:7px 0}.cp-watchlist-stock{font-size:12px;color:#5c6b64;margin:5px 0}
.cp-watchlist-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.cp-watchlist-actions a,.cp-watchlist-actions button{display:inline-block;border:0;border-radius:7px;background:#07533f;color:#fff;padding:10px;font-size:12px;font-weight:800;text-decoration:none;cursor:pointer}.cp-watchlist-actions button{background:#f2e7e7;color:#813535}
.cp-watchlist-status{margin:12px 0;padding:12px;border-radius:8px;background:#f3f7f5;color:#234b3a}
@media(max-width:600px){.cp-watchlist-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.cp-watchlist-card-body{padding:8px}.cp-watchlist-card h3{font-size:12px}.cp-watchlist-price{font-size:12px}.cp-watchlist-stock{font-size:10px}.cp-watchlist-actions a,.cp-watchlist-actions button{font-size:10px;padding:8px 6px}}

/* V7 navigation hardening: keep return controls visible and suppress duplicated watchlists on subpages */
.cp-subpage-nav:not([hidden]){display:flex!important;visibility:visible!important}
.cp-inline-back-wrap{display:block;width:100%;margin:0 0 14px}
.cp-inline-back-wrap .cp-back-profile{display:inline-flex!important;min-height:44px}
#customer-watchlist-card[hidden],#customer-watchlist-panel[hidden]{display:none!important}
@media(max-width:600px){.cp-inline-back-wrap .cp-back-profile{width:100%;box-sizing:border-box}}

/* V8: enforce hidden states even when component styles set display. */
[hidden]{display:none!important;visibility:hidden!important}
#profile>[hidden],#private-area>[hidden],.columns>[hidden],#customer-watchlist-card[hidden],#cp-watchlist-page[hidden],#cp-subpage-nav[hidden]{display:none!important}
.cp-subpage-nav:not([hidden]){display:flex!important;visibility:visible!important}

/* V9: strict single-view navigation; stop legacy section styles leaking between customer pages. */
body[data-customer-view]:not([data-customer-view="home"]) #customer-watchlist-card{display:none!important}
body[data-customer-view]:not([data-customer-view="watchlist"]) #cp-watchlist-page{display:none!important}
body[data-customer-view="watchlist"] #cp-watchlist-page{display:block!important}
body[data-customer-view]:not([data-customer-view="home"]) .portal-hero{display:none!important}
.cp-back-profile{display:inline-flex!important;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;background:#07533f;color:#fff!important;text-decoration:none;border-radius:9px;font-weight:800}
.portal-actions>a.portal-button{display:inline-flex;align-items:center;justify-content:center}

/* V11 restoration: allow JS to restore visible profile sections after switching subpages. */
#profile .card[hidden],#private-area [hidden],#profile>[hidden]{display:none!important}


/* CARPRINCE customer profile: professional logout button with exit-arrow icon */
.cp-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px;flex-wrap:wrap}
.cp-header-actions #cp-logout{display:inline-flex;align-items:center;justify-content:center;gap:9px;margin:0;background:#fff;color:#b42318;border:1.5px solid #c52a20;border-radius:12px;padding:11px 17px;font-weight:800;font-size:14px;letter-spacing:.01em;cursor:pointer;white-space:nowrap;box-shadow:0 2px 5px rgba(0,0,0,.06);transition:background .18s ease,transform .18s ease,border-color .18s ease}
.cp-header-actions #cp-logout:hover{background:#fff1ef;border-color:#a91f17;transform:translateY(-1px)}
.cp-header-actions #cp-logout:active{transform:translateY(0)}
.cp-header-actions #cp-logout .cp-logout-icon{width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cp-header-actions #cp-logout:focus-visible{outline:3px solid #e4b84a;outline-offset:3px}
.cp-header-actions #cp-logout[hidden]{display:none!important}
@media(max-width:600px){header{align-items:center}.cp-header-actions{gap:7px}.cp-header-actions #cp-logout{gap:6px;padding:9px 10px;font-size:12px;border-radius:10px}.cp-header-actions #cp-logout .cp-logout-icon{width:17px;height:17px;flex-basis:17px}}