/* DECETI Templates v0 — immutable Storage source.
 * Scoped replacement for the retired generic template-gallery styles.
 * Geometry only; colors are declared by templates-v0-palette-contract. */
.deceti-template-controls.deceti-templates-v0 {
  --deceti-template-nav-width: 260px;
  --deceti-template-gap: var(--spacing-template-grid-gap, 14px);
  --deceti-template-content-padding: var(--spacing-template-panel-padding, 18px);
  --deceti-template-content-pad-top: 0px;
  --deceti-template-radius: var(--radius-template-card, 10px);
  --deceti-template-btn-radius: var(--radius-template-control, 10px);
  --deceti-template-input-radius: var(--radius-template-control, 10px);
  --deceti-template-outline-width: 2px;
  display: flex;
  align-items: flex-start;
  column-gap: 20px;
  max-width: 100%;
  margin: 0 auto;
}
.deceti-template-controls.deceti-templates-v0 .navmenu {
  width: var(--deceti-template-nav-width);
  min-width: var(--deceti-template-nav-width);
  flex: 0 0 var(--deceti-template-nav-width);
  padding: var(--deceti-template-content-padding);
  margin: 0;
  box-sizing: border-box;
}
.deceti-template-controls.deceti-templates-v0 .s-content {
  flex: 1 1 auto;
  min-width: 0;
  padding: var(--deceti-template-content-padding);
  padding-top: var(--deceti-template-content-pad-top);
  box-sizing: border-box;
}
.deceti-template-controls.deceti-templates-v0 .template-item {
  margin: 10px 0;
  cursor: pointer;
  user-select: none;
}
.deceti-template-controls.deceti-templates-v0 .navmenu .template-item {
  padding: 15px 20px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
  text-align: left;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.deceti-template-controls.deceti-templates-v0 .navmenu .submenu {
  display: none;
  text-align: left;
}
.deceti-template-controls.deceti-templates-v0 .navmenu .template-item.active + .submenu { display: block; }
.deceti-template-controls.deceti-templates-v0 .navmenu .subtemplate-item {
  display: block;
  margin: 5px 0 5px 20px;
  padding: 10px 12px;
  font-size: 15px;
  line-height: 1.3;
  cursor: pointer;
  user-select: none;
}
.deceti-template-controls.deceti-templates-v0 .search-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
}
.deceti-template-controls.deceti-templates-v0 .search-bar input {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  padding: 14px 12px;
  font-size: 16px;
  line-height: 1.25;
  box-sizing: border-box;
}
.deceti-template-controls.deceti-templates-v0 .search-bar button {
  flex: 0 0 50px;
  width: 50px;
  height: 50px;
  margin: 0;
  padding: 0;
  font-size: 20px;
  cursor: pointer;
}
.deceti-template-controls.deceti-templates-v0 .c-grid.s-c-grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--deceti-template-gap);
  width: 100%;
}
.deceti-template-controls.deceti-templates-v0 .i-grid {
  flex: 0 0 calc(25% - var(--deceti-template-gap));
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  max-width: 310px;
  min-width: 0;
}
.deceti-template-controls.deceti-templates-v0 .item-box {
  width: 100%;
  padding: 15px;
  text-align: center;
  box-sizing: border-box;
  transition: transform .2s ease, outline .2s ease, background-color .2s ease;
  user-select: none;
}
.deceti-template-controls.deceti-templates-v0 .item-box:hover { transform: scale(1.025); }
.deceti-template-controls.deceti-templates-v0 .item-box img {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
  -webkit-user-drag: none;
}
.deceti-template-controls.deceti-templates-v0 .template-card-link,
.deceti-template-controls.deceti-templates-v0 .template-image-link {
  display: block;
  color: inherit;
  text-decoration: none;
}
.deceti-template-controls.deceti-templates-v0 .new-category-name {
  margin-top: 10px;
  font-size: 16px;
  font-weight: 700;
}
.deceti-template-controls.deceti-templates-v0 :is(a.btn.btn-customize, a.btn-customize, .btn.btn-customize, .btn-customize) {
  display: inline-block !important;
  padding: 10px 12px !important;
  margin-top: 12px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.deceti-template-controls.deceti-templates-v0 .shape-accordion { margin-top: 10px; }
.deceti-template-controls.deceti-templates-v0 .shape-accordion.is-hidden { display: none; }
.deceti-template-controls.deceti-templates-v0 .shape-accordion-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 15px 20px;
  font-size: 18px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}
.deceti-template-controls.deceti-templates-v0 .shape-accordion-panel { display: none; margin-top: 8px; }
.deceti-template-controls.deceti-templates-v0 .shape-accordion-panel.open { display: block; }
.deceti-template-controls.deceti-templates-v0 .shape-container { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.deceti-template-controls.deceti-templates-v0 .shape-button { padding: 8px 12px; font-size: 14px; line-height: 1.2; cursor: pointer; }
.deceti-template-controls.deceti-templates-v0 .size-container { margin-top: 10px; }
.deceti-template-controls.deceti-templates-v0 .size-select { width: 100%; padding: 10px; font-size: 16px; box-sizing: border-box; }
.deceti-template-controls.deceti-templates-v0 .button-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(20px, 1fr)); margin-top: 5px; }
.deceti-template-controls.deceti-templates-v0 .color-button { width: 25px; height: 25px; margin-top: 5px; border-radius: 50%; cursor: pointer; }
.deceti-template-controls.deceti-templates-v0 .color-button.is-red { background-color: red; }
.deceti-template-controls.deceti-templates-v0 .color-button.is-orange { background-color: orange; }
.deceti-template-controls.deceti-templates-v0 .color-button.is-yellow { background-color: #ff0; }
.deceti-template-controls.deceti-templates-v0 .color-button.is-green { background-color: green; }
.deceti-template-controls.deceti-templates-v0 .color-button.is-blue { background-color: #0060ff; }
.deceti-template-controls.deceti-templates-v0 .color-button.is-navy { background-color: #0d0d81; }
.deceti-template-controls.deceti-templates-v0 .color-button.is-violet { background-color: #7a19cc; }
.deceti-template-controls.deceti-templates-v0 .color-button.is-magenta { background-color: #de06cc; }
.deceti-template-controls.deceti-templates-v0 .color-button.is-black { background-color: #000; }
.deceti-template-controls.deceti-templates-v0 .deceti-template-image-placeholder { display: flex; align-items: center; justify-content: center; width: 180px; height: 180px; margin: 0 auto; }
@media (max-width: 1100px) { .deceti-template-controls.deceti-templates-v0 .i-grid { flex-basis: calc(33.333% - var(--deceti-template-gap)); } }
@media (max-width: 900px) { .deceti-template-controls.deceti-templates-v0 .i-grid { flex-basis: calc(50% - var(--deceti-template-gap)); } }
@media (max-width: 768px) {
  .deceti-template-controls.deceti-templates-v0 { display: block; }
  .deceti-template-controls.deceti-templates-v0 .navmenu { width: 100%; min-width: 0; margin-bottom: 18px; }
  .deceti-template-controls.deceti-templates-v0 .s-content { width: 100%; }
  .deceti-template-controls.deceti-templates-v0 .i-grid { flex-basis: 100%; max-width: 100%; }
}