/* ============================================ */
/* ARDORE — Rich Product Description Styles v2  */
/* Soubor: ardore-description.css               */
/* Nahrát: Shoptet > Soubory > user/documents   */
/* Záhlaví:                                     */
/* <link href="/user/documents/ardore-description.css?v=2" rel="stylesheet"> */
/* ============================================ */

.ard-desc {
  --ard-accent: #eb65b0;
  --ard-accent-light: #fdf0f7;
  --ard-accent-dark: #c02482;
  --ard-text: #2a2a2a;
  --ard-text-muted: #6b6b6b;
  --ard-border: #e8e8e8;
  --ard-bg-subtle: #f9f9fb;
  --ard-radius: 10px;
  --ard-radius-sm: 6px;

  font-family: inherit;
  color: var(--ard-text);
 
  line-height: 1.75;
  max-width: 900px;
}

.ard-desc *, .ard-desc *::before, .ard-desc *::after { box-sizing: border-box; }

/* Typography */
.ard-desc h2.ard-desc__title {

  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 1.25rem 0;
  color: var(--ard-text);
}

.ard-desc h3 {

  font-weight: 600;
  margin: 2.25rem 0 0.85rem 0;
  color: var(--ard-text);
  padding-bottom: 0.45rem;
  border-bottom: 2px solid var(--ard-accent);
  display: inline-block;
}

.ard-desc > p {
  margin: 0 0 1.1rem 0;
}

.ard-desc a {
  color: var(--ard-accent-dark);
  text-decoration: underline;
  text-decoration-color: rgba(192, 36, 130, 0.3);
  text-underline-offset: 2px;
  transition: text-decoration-color 0.2s;
}
.ard-desc a:hover {
  text-decoration-color: var(--ard-accent-dark);
}

/* Features grid */
.ard-desc__features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin: 1.75rem 0;
}

.ard-desc__feature {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.3rem;
  padding: 1.1rem 1.2rem;
  border-radius: var(--ard-radius);
  background: var(--ard-bg-subtle);
  border: 1px solid var(--ard-border);
  transition: border-color 0.2s, box-shadow 0.2s;
}
.ard-desc__feature:hover {
  border-color: var(--ard-accent);
  box-shadow: 0 2px 12px rgba(235, 101, 176, 0.1);
}
.ard-desc__feature strong {

  font-weight: 600;
  color: var(--ard-text);
  line-height: 1.35;
}
.ard-desc__feature span {

  color: var(--ard-text-muted);
  line-height: 1.45;
}

/* Icons */
.ard-desc__icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  color: var(--ard-accent);
}

/* Parameters table */
.ard-desc__params {
  width: 100%;
  border-collapse: collapse;
  margin: 0.85rem 0 2rem 0;
 
}
.ard-desc__params th,
.ard-desc__params td {
  padding: 0.7rem 1.1rem;
  text-align: left;
  border-bottom: 1px solid var(--ard-border);
}
.ard-desc__params th {
  width: 35%;
  font-weight: 500;
  color: var(--ard-text-muted);
  background: var(--ard-bg-subtle);
  white-space: nowrap;
}
.ard-desc__params td {
  font-weight: 500;
  color: var(--ard-text);
}
.ard-desc__params td a {
  color: var(--ard-accent-dark);
  font-weight: 600;
}
.ard-desc__params tr:last-child th,
.ard-desc__params tr:last-child td {
  border-bottom: none;
}
.ard-desc__params tbody tr:hover {
  background: var(--ard-accent-light);
}

/* Tip box */
.ard-desc__tip {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
  padding: 1.15rem 1.4rem;
  margin: 2.25rem 0;
  border-radius: var(--ard-radius);
  background: var(--ard-accent-light);
  border-left: 3px solid var(--ard-accent);
}
.ard-desc__tip .ard-desc__icon {
  margin-top: 3px;
  width: 22px;
  height: 22px;
}
.ard-desc__tip strong {
  display: block;

  margin-bottom: 0.3rem;
  color: var(--ard-accent-dark);
}
.ard-desc__tip p {
  margin: 0;

  color: var(--ard-text);
  line-height: 1.7;
}

/* Box contents */
.ard-desc__box-contents {
  list-style: none;
  padding: 0;
  margin: 0.6rem 0 2rem 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.ard-desc__box-contents li {
  padding: 0.45rem 1rem;
  background: var(--ard-bg-subtle);
  border: 1px solid var(--ard-border);
  border-radius: 100px;

  font-weight: 500;
  color: var(--ard-text-muted);
}

/* Crosslinks */
.ard-desc__related {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
  padding: 1.4rem 0;
  margin-top: 1rem;
  border-top: 1px solid var(--ard-border);
}
.ard-desc__related > span {

  font-weight: 600;
  color: var(--ard-text-muted);
  margin-right: 0.25rem;
}
.ard-desc__related a {
  display: inline-block;
  padding: 0.45rem 1rem;

  font-weight: 600;
  color: var(--ard-accent-dark);
  background: var(--ard-accent-light);
  border: 1px solid rgba(192, 36, 130, 0.2);
  border-radius: 100px;
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s, transform 0.15s;
}
.ard-desc__related a:hover {
  background: rgba(192, 36, 130, 0.12);
  border-color: var(--ard-accent);
  transform: translateY(-1px);
}

/* Responsive */
@media (max-width: 768px) {
  .ard-desc__features { grid-template-columns: repeat(2, 1fr); }
  .ard-desc__params th { width: 40%; }
}

@media (max-width: 480px) {
  .ard-desc h2.ard-desc__title { font-size: 1.35rem; }
  .ard-desc__features { grid-template-columns: 1fr; gap: 0.75rem; }
  .ard-desc__feature {
    flex-direction: row; align-items: center;
    gap: 0.75rem; padding: 0.85rem 1rem;
  }
  .ard-desc__feature .ard-desc__icon { width: 28px; height: 28px; }
  .ard-desc__feature span { display: none; }
  .ard-desc__tip { flex-direction: column; gap: 0.5rem; }
  .ard-desc__box-contents { flex-direction: column; }
  .ard-desc__related { flex-direction: column; align-items: flex-start; }
}