/**
 * Rhinox Photos — elementor-custom.css
 * Extra Elementor widget overrides and theme integration.
 * @package RhinoxPhotos
 */

/* ── Force Elementor sections to use theme background ── */
.elementor-section.rhinox-dark  { background-color: var(--rhinox-bg)  !important; }
.elementor-section.rhinox-dark2 { background-color: var(--rhinox-bg2) !important; }
.elementor-section.rhinox-card  { background-color: var(--rhinox-card) !important; }

/* ── Elementor heading widget ── */
.elementor-widget-heading .elementor-heading-title {
  font-family: var(--rhinox-font-head) !important;
  color: var(--rhinox-white);
  line-height: 1 !important;
  letter-spacing: .03em;
}
.elementor-widget-heading .elementor-heading-title.rhinox-accent-head {
  color: var(--rhinox-accent) !important;
}

/* ── Elementor text editor ── */
.elementor-widget-text-editor { color: var(--rhinox-text); line-height: 1.7; }

/* ── Elementor button ── */
.elementor-widget-button .elementor-button {
  font-family: var(--rhinox-font-body) !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  border-radius: 50px !important;
  transition: background .25s, box-shadow .25s, transform .2s !important;
}
.elementor-widget-button .elementor-button.rhinox-btn-primary {
  background-color: var(--rhinox-accent) !important;
  color: #fff !important;
  border: none !important;
}
.elementor-widget-button .elementor-button.rhinox-btn-primary:hover {
  background-color: var(--rhinox-accent2) !important;
  box-shadow: 0 0 28px var(--rhinox-accent-glow) !important;
  transform: translateY(-2px) !important;
}

/* ── Elementor image widget ── */
.elementor-widget-image img {
  border-radius: var(--rhinox-radius);
}
.elementor-widget-image.rhinox-arc-style img {
  border: 2px solid rgba(255,92,0,.2);
  box-shadow: 0 8px 32px rgba(0,0,0,.6);
  transition: transform .4s;
}
.elementor-widget-image.rhinox-arc-style img:hover {
  transform: scale(1.04);
}

/* ── Elementor divider ── */
.elementor-widget-divider .elementor-divider-separator {
  border-color: var(--rhinox-border) !important;
}

/* ── Elementor icon box ── */
.elementor-widget-icon-box .elementor-icon-box-title { color: var(--rhinox-white) !important; }
.elementor-widget-icon-box .elementor-icon-box-description { color: var(--rhinox-text) !important; }
.elementor-widget-icon-box .elementor-icon i,
.elementor-widget-icon-box .elementor-icon svg { color: var(--rhinox-accent) !important; }

/* ── Elementor testimonial ── */
.elementor-widget-testimonial .elementor-testimonial-content { color: var(--rhinox-text) !important; font-style: italic; }
.elementor-widget-testimonial .elementor-testimonial-name { color: var(--rhinox-accent) !important; }

/* ── Elementor price table ── */
.elementor-widget-price-table .elementor-price-table__header { background: var(--rhinox-card) !important; }
.elementor-widget-price-table.rhinox-featured .elementor-price-table__header { background: var(--rhinox-accent) !important; }
.elementor-widget-price-table .elementor-price-table__price { color: var(--rhinox-white) !important; }
.elementor-widget-price-table .elementor-price-table__feature-item { color: var(--rhinox-text) !important; }

/* ── WPForms inside Elementor ── */
.elementor-widget-shortcode .wpforms-container .wpforms-form input,
.elementor-widget-shortcode .wpforms-container .wpforms-form select,
.elementor-widget-shortcode .wpforms-container .wpforms-form textarea {
  background: var(--rhinox-card) !important;
  border: 1px solid var(--rhinox-border) !important;
  color: var(--rhinox-white) !important;
  border-radius: 10px !important;
  font-family: var(--rhinox-font-body) !important;
  padding: 14px 18px !important;
  transition: border-color .25s !important;
}
.elementor-widget-shortcode .wpforms-container .wpforms-form input:focus,
.elementor-widget-shortcode .wpforms-container .wpforms-form textarea:focus {
  border-color: var(--rhinox-accent) !important;
  box-shadow: 0 0 0 3px var(--rhinox-accent-dim) !important;
  outline: none !important;
}
.elementor-widget-shortcode .wpforms-container .wpforms-submit {
  background: var(--rhinox-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 50px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  padding: 14px 36px !important;
  transition: background .25s, box-shadow .25s !important;
  width: 100% !important;
}
.elementor-widget-shortcode .wpforms-container .wpforms-submit:hover {
  background: var(--rhinox-accent2) !important;
  box-shadow: 0 0 24px var(--rhinox-accent-glow) !important;
}

/* ── Elementor Gallery (if used instead of custom) ── */
.elementor-widget-gallery .elementor-gallery-item {
  border-radius: var(--rhinox-radius) !important;
  overflow: hidden !important;
}

/* ── Rhinox custom CSS classes (usable in Elementor Advanced → CSS Classes) ──
   Usage: type these in any Elementor element's CSS Classes field:
   rhinox-card-block  = styled card
   rhinox-tag-label   = orange section tag
   rhinox-glow-text   = glowing orange text
   rhinox-pill-wrap   = flex wrap of pills
   ── */
.rhinox-card-block {
  background: var(--rhinox-card);
  border: 1px solid var(--rhinox-border);
  border-radius: var(--rhinox-radius);
  padding: 32px;
  transition: border-color .3s, transform .3s;
}
.rhinox-card-block:hover { border-color: rgba(255,92,0,.3); transform: translateY(-4px); }

.rhinox-tag-label {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: .7rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--rhinox-accent);
}
.rhinox-tag-label::before { content: ''; width: 28px; height: 2px; background: var(--rhinox-accent); border-radius: 1px; display: block; }

.rhinox-glow-text { color: var(--rhinox-accent) !important; text-shadow: 0 0 40px rgba(255,92,0,.4); }

.rhinox-pill-wrap { display: flex; flex-wrap: wrap; gap: 10px; }
.rhinox-pill-item {
  background: var(--rhinox-card); border: 1px solid var(--rhinox-border);
  padding: 8px 18px; border-radius: 50px;
  font-size: .78rem; font-weight: 500; color: var(--rhinox-text);
  transition: border-color .25s, color .25s;
}
.rhinox-pill-item:hover { border-color: var(--rhinox-accent); color: var(--rhinox-accent); }

/* ── Elementor full width fix ── */
.elementor-page .site-content,
.elementor-page #content { padding: 0 !important; }
.page-template-elementor_canvas #rhinox-header { display: none; }