/*
Theme Name: Dainty Designs by Shayna – Gallery & Request Form
Theme URI: https://daintydesignsbyshayna.com
Author: Dainty Designs by Shayna
Description: A custom boutique WordPress theme for handmade pearl jewelry, custom orders, local pickup, and jewelry care information.
Version: 1.2.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: dainty-designs
*/

:root{
  --dds-ivory:#fbf7ef;
  --dds-cream:#fffaf4;
  --dds-brown:#56351f;
  --dds-soft:#7b5a45;
  --dds-blush:#d9aa9f;
  --dds-blush-pale:#efd7d0;
  --dds-line:rgba(86,53,31,.22);
  --dds-shadow:0 14px 34px rgba(76,48,30,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--dds-ivory);
  color:var(--dds-brown);
  font-family:Georgia,"Times New Roman",serif;
  line-height:1.55;
}
body.admin-bar .dds-sticky-nav{top:32px}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
.dds-site{overflow:hidden}
.dds-header-art{
  width:100%;
  margin:0;
  line-height:0;
  background:var(--dds-cream);
}
.dds-header-art img{
  width:100%;
  height:auto;
  object-fit:contain;
}
.dds-sticky-nav{
  position:sticky;
  top:0;
  z-index:50;
  display:flex;
  justify-content:center;
  gap:28px;
  flex-wrap:wrap;
  padding:12px 18px;
  background:rgba(251,247,239,.96);
  border-bottom:1px solid var(--dds-line);
  backdrop-filter:blur(10px);
}
.dds-sticky-nav a{
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.78rem;
}
.dds-sticky-nav a:hover{color:#9a6752}
.dds-intro{
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:390px;
  border-bottom:1px solid var(--dds-line);
}
.dds-intro-copy{
  position:relative;
  padding:58px 8vw;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.dds-intro-copy:before{
  content:"";
  position:absolute;
  inset:0;
  background:url("assets/wildflowers.png") left bottom/92% auto no-repeat;
  opacity:.09;
}
.dds-intro-copy>*{position:relative}
.dds-intro h1{
  margin:0 0 18px;
  font-size:clamp(2rem,3.7vw,3.35rem);
  line-height:1.15;
  font-weight:500;
}
.dds-intro p{max-width:540px;font-size:1.08rem}
.dds-intro-photo{
  min-height:390px;
  background:url("assets/pearl-necklace.jpg") center/cover no-repeat;
}
.dds-buttons{display:flex;gap:13px;flex-wrap:wrap;margin-top:18px}
.dds-button{
  display:inline-block;
  padding:12px 23px;
  border:1px solid var(--dds-brown);
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.03em;
  font-size:.76rem;
  transition:.18s ease;
}
.dds-button-primary{
  background:var(--dds-blush);
  border-color:var(--dds-blush);
  color:#fff;
}
.dds-button:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(84,51,31,.09)}
.dds-section{padding:64px 3vw;position:relative}
.dds-section-title{text-align:center;margin-bottom:30px}
.dds-section-title h2{
  margin:0;
  font-size:clamp(1.9rem,3vw,2.75rem);
  font-weight:500;
}
.dds-ornament{font-size:1.05rem;letter-spacing:.42em}
.dds-collection{background:#fffaf5}
.dds-product-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:15px;
  max-width:1380px;
  margin:auto;
}
.dds-product-card{
  border:1px solid var(--dds-line);
  background:#fffaf5;
  min-height:285px;
  display:flex;
  flex-direction:column;
  box-shadow:0 5px 16px rgba(76,48,30,.04);
}
.dds-product-image{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-bottom:1px solid var(--dds-line);
}
.dds-product-placeholder{
  flex:1;
  min-height:190px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:
    linear-gradient(rgba(255,250,245,.82),rgba(255,250,245,.82)),
    url("assets/jewelry-placeholder.jpg") center/cover no-repeat;
  font-size:1.08rem;
}
.dds-product-body{padding:13px}
.dds-product-title{margin:0 0 6px;text-align:center;font-size:1.05rem;font-weight:500}
.dds-product-excerpt{font-size:.82rem;text-align:center;margin:0 0 10px}
.dds-request{
  display:block;
  text-align:center;
  text-decoration:none;
  text-transform:uppercase;
  background:var(--dds-blush-pale);
  padding:8px 5px;
  font-size:.66rem;
}
.dds-product-heart{text-align:center;padding:5px 0 0}
.dds-features{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  max-width:1240px;
  margin:auto;
}
.dds-feature{
  position:relative;
  overflow:hidden;
  border:1px solid var(--dds-line);
  background:#fffaf5;
  padding:25px;
  display:grid;
  grid-template-columns:70px 1fr;
  gap:18px;
  align-items:center;
}
.dds-feature:after{
  content:"";
  position:absolute;
  right:-38px;
  bottom:-12px;
  width:150px;
  height:145px;
  background:url("assets/wildflowers.png") right bottom/330px auto no-repeat;
  opacity:.12;
}
.dds-round-icon{
  width:66px;height:66px;border-radius:50%;
  background:var(--dds-blush-pale);
  display:grid;place-items:center;font-size:1.8rem;
}
.dds-feature h3{margin:0 0 4px;font-size:1.24rem;font-weight:500}
.dds-feature p{margin:0;font-size:.91rem}
.dds-about-custom{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  border-top:1px solid var(--dds-line);
  border-bottom:1px solid var(--dds-line);
  background:#fffaf5;
}
.dds-about,.dds-custom-teaser{position:relative;padding:52px 5vw}
.dds-about{
  display:grid;
  grid-template-columns:175px 1fr;
  gap:30px;
  align-items:center;
}
.dds-about-photo{
  width:170px;height:170px;border-radius:50%;
  object-fit:cover;border:5px solid rgba(255,255,255,.74);
  box-shadow:var(--dds-shadow);
}
.dds-about h2,.dds-custom-teaser h2{font-size:2rem;font-weight:500;margin:0 0 14px}
.dds-custom-teaser{
  border-left:1px solid var(--dds-line);
  text-align:center;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.dds-custom-form-section{background:#f7ede8}
.dds-two-col{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:42px;
  max-width:1120px;
  margin:auto;
  align-items:start;
}
.dds-form-card,.dds-policy-card{
  background:#fffaf5;
  border:1px solid var(--dds-line);
  padding:30px;
  box-shadow:var(--dds-shadow);
}
.dds-form{display:grid;gap:15px}
.dds-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.dds-form label{font-size:.88rem;font-weight:bold}
.dds-form input,.dds-form select,.dds-form textarea{
  width:100%;margin-top:5px;padding:11px;
  border:1px solid var(--dds-line);
  background:#fff;color:var(--dds-brown);font:inherit;
}
.dds-form textarea{min-height:130px;resize:vertical}
.dds-form button{cursor:pointer;font:inherit}
.dds-form-note{font-size:.8rem;color:var(--dds-soft);margin:0}
.dds-info-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  background:#fffaf5;
  border-top:1px solid var(--dds-line);
  border-bottom:1px solid var(--dds-line);
}
.dds-info-item{text-align:center;padding:26px;border-right:1px solid var(--dds-line)}
.dds-info-item:last-child{border-right:0}
.dds-info-icon{font-size:1.8rem}
.dds-info-item h3{margin:5px 0;font-weight:500}
.dds-info-item p{margin:0;font-size:.88rem}
.dds-policies{background:#fffaf5}
.dds-policy-links{
  display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:28px;
}
.dds-policy-links a{
  text-decoration:none;border:1px solid var(--dds-line);
  border-radius:999px;padding:8px 14px;
}
.dds-policy-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:20px;
  max-width:1120px;
  margin:auto;
}
.dds-policy-card h3{margin-top:0;font-size:1.45rem;font-weight:500}
.dds-faq{max-width:900px;margin:auto}
.dds-faq details{
  background:#fffaf5;border:1px solid var(--dds-line);
  padding:16px 18px;margin:11px 0;
}
.dds-faq summary{cursor:pointer;font-weight:bold}
.dds-contact-links a{display:block;margin:7px 0}
.dds-footer{
  position:relative;text-align:center;
  padding:38px 20px 95px;background:#fffaf5;
}
.dds-footer:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:105px;
  background:url("assets/wildflowers.png") center bottom/cover no-repeat;
}
.dds-footer>*{position:relative;z-index:2}
.dds-footer a{text-decoration:none;margin:0 8px}
.dds-admin-note{
  max-width:1120px;margin:0 auto 30px;padding:14px 18px;
  border:1px dashed var(--dds-line);background:#fffaf5;font-size:.9rem;
}
@media(max-width:1100px){
  .dds-product-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:782px){
  body.admin-bar .dds-sticky-nav{top:46px}
}
@media(max-width:760px){
  .dds-intro,.dds-about-custom,.dds-two-col{grid-template-columns:1fr}
  .dds-intro-photo{min-height:300px}
  .dds-product-grid{grid-template-columns:repeat(2,1fr)}
  .dds-features{grid-template-columns:1fr}
  .dds-about{grid-template-columns:1fr;text-align:center}
  .dds-about-photo{margin:auto}
  .dds-custom-teaser{border-left:0;border-top:1px solid var(--dds-line)}
  .dds-info-strip{grid-template-columns:1fr 1fr}
  .dds-policy-grid{grid-template-columns:1fr}
  .dds-form-grid{grid-template-columns:1fr}
}
@media(max-width:480px){
  .dds-product-grid,.dds-info-strip{grid-template-columns:1fr}
  .dds-info-item{border-right:0;border-bottom:1px solid var(--dds-line)}
}


/* Clickable areas over the navigation words printed inside the header artwork. */
.dds-header-art{
  position:relative;
}
.dds-header-art-link{
  position:absolute;
  z-index:10;
  display:block;
  background:transparent;
  cursor:pointer;
}
.dds-header-art-link:focus{
  outline:2px solid var(--dds-blush);
  outline-offset:2px;
}

/* Positions correspond to the navigation printed in header-design.png. */
.dds-art-home{left:3.1%;top:10.8%;width:4.3%;height:6.5%}
.dds-art-shop{left:6.5%;top:10.8%;width:3.5%;height:6.5%}
.dds-art-custom{left:10.1%;top:10.8%;width:8.8%;height:6.5%}
.dds-art-about{left:77.2%;top:10.8%;width:8.9%;height:6.5%}
.dds-art-contact{left:87.0%;top:10.8%;width:6.3%;height:6.5%}
.dds-art-cart{left:94.7%;top:8.9%;width:3.8%;height:9%}

@media(max-width:760px){
  .dds-header-art-link{display:none}
}


/* ===== Version 1.2: jewelry carousel, lightbox, and request form ===== */
.dds-gallery-shell{
  position:relative;
  max-width:1420px;
  margin:0 auto;
  padding:0 54px;
}
.dds-product-grid{
  display:flex;
  gap:16px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scroll-snap-type:x mandatory;
  padding:4px 2px 18px;
  scrollbar-width:thin;
}
.dds-product-grid::-webkit-scrollbar{height:8px}
.dds-product-grid::-webkit-scrollbar-thumb{
  background:var(--dds-blush);
  border-radius:999px;
}
.dds-product-card{
  flex:0 0 calc((100% - 80px)/6);
  min-width:190px;
  scroll-snap-align:start;
}
.dds-gallery-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:8;
  width:42px;
  height:42px;
  border:1px solid var(--dds-line);
  border-radius:50%;
  background:rgba(255,250,245,.97);
  color:var(--dds-brown);
  font:inherit;
  font-size:1.65rem;
  display:grid;
  place-items:center;
  cursor:pointer;
  box-shadow:0 7px 18px rgba(84,51,31,.12);
}
.dds-gallery-arrow:hover{background:var(--dds-blush-pale)}
.dds-gallery-prev{left:4px}
.dds-gallery-next{right:4px}

.dds-product-media{
  position:relative;
  width:100%;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  overflow:hidden;
  color:inherit;
  font:inherit;
}
.dds-product-media img,
.dds-product-media .dds-product-placeholder{
  transition:transform .22s ease;
}
.dds-product-media:hover img,
.dds-product-media:hover .dds-product-placeholder{
  transform:scale(1.025);
}
.dds-product-expand{
  position:absolute;
  right:9px;
  bottom:9px;
  width:34px;
  height:34px;
  border-radius:50%;
  background:rgba(255,250,245,.94);
  display:grid;
  place-items:center;
  border:1px solid var(--dds-line);
  font-size:1rem;
}
.dds-request{
  width:100%;
  border:0;
  cursor:pointer;
  font:inherit;
  color:inherit;
}

/* Modal/lightbox */
.dds-modal[hidden]{display:none!important}
.dds-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.dds-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(44,28,18,.72);
}
.dds-modal-dialog{
  position:relative;
  z-index:2;
  width:min(920px,96vw);
  max-height:92vh;
  overflow:auto;
  background:var(--dds-cream);
  border:1px solid var(--dds-line);
  box-shadow:0 22px 70px rgba(0,0,0,.28);
  padding:26px;
}
.dds-modal-close{
  position:absolute;
  right:12px;
  top:10px;
  width:40px;
  height:40px;
  border:0;
  background:transparent;
  color:var(--dds-brown);
  font-size:2rem;
  cursor:pointer;
}
.dds-lightbox-image{
  width:100%;
  max-height:74vh;
  object-fit:contain;
  background:#fff;
}
.dds-lightbox-title{
  margin:15px 0 0;
  text-align:center;
  font-size:1.35rem;
  font-weight:500;
}
.dds-request-dialog{width:min(720px,96vw)}
.dds-request-dialog h2{
  margin:0 44px 7px 0;
  font-weight:500;
  font-size:2rem;
}
.dds-request-subtitle{
  margin:0 0 18px;
  color:var(--dds-soft);
}
.dds-request-success,
.dds-request-error{
  max-width:1000px;
  margin:18px auto 0;
  padding:13px 18px;
}
.dds-request-success{
  background:#eef5e9;
  border:1px solid #bfd2b6;
}
.dds-request-error{
  background:#fff0ee;
  border:1px solid #ddb7b0;
}
body.dds-modal-open{overflow:hidden}

@media(max-width:1180px){
  .dds-product-card{flex-basis:calc((100% - 48px)/4)}
}
@media(max-width:760px){
  .dds-gallery-shell{padding:0 42px}
  .dds-product-card{flex-basis:calc((100% - 16px)/2);min-width:210px}
  .dds-gallery-arrow{width:36px;height:36px}
}
@media(max-width:480px){
  .dds-gallery-shell{padding:0 36px}
  .dds-product-card{flex-basis:100%;min-width:240px}
  .dds-modal{padding:10px}
  .dds-modal-dialog{padding:20px}
}
