/* ========================================================================== Guía Construcción · Fase 2 — estilos adicionales Hereda variables y componentes de la Fase 1 (--gc-primary, etc.) ========================================================================== */ /* Bloques inyectados dentro del
de Fase 1 */ .gc-injected-blocks { display: flex; flex-direction: column; gap: 18px; margin-top: 18px; } .gc-injected-blocks:empty { display: none; margin: 0; } .gc-card--injected { margin-top: 18px; } /* Filas no leídas en bandeja */ .gc-row--unread td { background: var(--gc-primary-soft, #fff1ea); } .gc-row--unread td:first-child { box-shadow: inset 3px 0 0 var(--gc-primary, #ff7438); } /* Barra de acciones de mensajes */ .gc-messages__bar { display: flex; gap: 10px; margin-bottom: 6px; } /* Tarjeta de mensaje */ .gc-message-card__head { margin-bottom: 16px; } .gc-message-card__head h1 { font-size: 22px; margin: 0 0 6px; } .gc-message-card__meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; color: var(--gc-text-soft, #6b7280); font-size: 13.5px; margin: 0; } .gc-message-card__meta svg { width: 15px; height: 15px; } .gc-message-card__body { font-size: 15px; line-height: 1.6; color: var(--gc-text, #23262b); } .gc-back { display: inline-flex; align-items: center; gap: 6px; color: var(--gc-text-soft, #6b7280); text-decoration: none; font-size: 14px; font-weight: 600; } .gc-back:hover { color: var(--gc-primary, #ff7438); } /* Tarjeta de cotización */ .gc-quote-card__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; background: var(--gc-light-bg, #f6f7f9); padding: 16px; border-radius: var(--gc-radius-sm, 9px); margin-bottom: 16px; } .gc-quote-card__grid span { display: block; font-size: 12px; color: var(--gc-text-soft, #6b7280); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 3px; } .gc-quote-card__grid strong { color: var(--gc-dark, #1f1f1f); font-size: 14.5px; } .gc-quote-card__top { display: flex; justify-content: space-between; gap: 18px; flex-wrap: wrap; } .gc-quote-card__top h3 { font-size: 17px; margin: 0 0 4px; } .gc-quote-card__actions, .gc-quote-card__detail { margin-top: 14px; display: flex; gap: 10px; flex-wrap: wrap; } .gc-quote-card__detail { flex-direction: column; padding-top: 14px; border-top: 1px solid var(--gc-border, #e7e8ec); } /* Formulario de cotización embebido en perfil público */ .gc-quote-inline { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--gc-border, #e7e8ec); } .gc-quote-form--embed { padding: 0; border-radius: 0; background: transparent; } /* Solicitud de servicio: experiencia guiada de una sola página. */ .gc-service-request { --gcsr-orange: var(--gc-primary, #ff7438); --gcsr-orange-dark: #d94e10; --gcsr-ink: #202630; --gcsr-muted: #707987; --gcsr-border: #e2e6eb; --gcsr-soft: #f7f8fa; width: 100%; max-width: 860px; margin-inline: auto; color: var(--gcsr-ink); font-family: var(--gc-font-body, Inter, Arial, sans-serif); } .gc-service-request, .gc-service-request * { box-sizing: border-box; } .gc-service-request__header { display: flex; align-items: flex-start; gap: 15px; margin-bottom: 18px; } .gc-service-request__header-icon { display: grid; flex: 0 0 46px; width: 46px; height: 46px; place-items: center; border-radius: 13px; background: #fff0e8; color: var(--gcsr-orange-dark); } .gc-service-request__header-icon :is(i,svg) { width: 22px; height: 22px; } .gc-service-request__eyebrow { display: block; margin: 0 0 3px; color: var(--gcsr-orange-dark); font-size: 10px; font-weight: 850; letter-spacing: .08em; line-height: 1.3; text-transform: uppercase; } .gc-service-request__header :is(h1,h2) { margin: 0 0 5px; color: var(--gcsr-ink); font-family: var(--gc-font-display, var(--gc-font-body, Inter, Arial, sans-serif)); font-size: clamp(22px,3vw,28px); font-weight: 850; letter-spacing: -.025em; line-height: 1.15; } .gc-service-request__header p { max-width: 650px; margin: 0; color: var(--gcsr-muted); font-size: 13px; line-height: 1.55; } .gc-service-request__recipient { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; padding: 13px 14px; border: 1px solid var(--gcsr-border); border-radius: 14px; background: #fff; box-shadow: 0 7px 22px rgba(25,34,46,.045); } .gc-service-request__recipient > img, .gc-service-request__recipient-logo { display: grid; flex: 0 0 46px; width: 46px; height: 46px; place-items: center; object-fit: contain; padding: 5px; border: 1px solid #e6e8ec; border-radius: 11px; background: #f5f6f8; color: #3f4854; } .gc-service-request__recipient-logo :is(i,svg) { width: 22px; height: 22px; } .gc-service-request__recipient-copy { display: grid; min-width: 0; gap: 1px; } .gc-service-request__recipient-copy small { color: #858d99; font-size: 10px; font-weight: 700; } .gc-service-request__recipient-copy strong { overflow: hidden; color: #252b34; font-size: 14px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; } .gc-service-request__recipient-copy span { color: #747d89; font-size: 11px; } .gc-service-request__private { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 6px; margin-left: auto; padding: 6px 9px; border-radius: 999px; background: #eaf8f0; color: #217145; font-size: 10px; font-weight: 800; } .gc-service-request__private :is(i,svg) { width: 14px; height: 14px; } .gc-service-request__steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 0 0 16px; padding: 0; list-style: none; } .gc-service-request__steps li { position: relative; display: flex; align-items: center; gap: 8px; min-height: 35px; padding: 6px 10px; border: 1px solid #e5e8ec; border-radius: 10px; background: #fafbfc; color: #68717e; font-size: 11px; } .gc-service-request__steps li > span { display: grid; flex: 0 0 22px; width: 22px; height: 22px; place-items: center; border-radius: 50%; background: #fff0e8; color: var(--gcsr-orange-dark); font-size: 10px; font-weight: 850; } .gc-service-request__steps strong { font-size: inherit; } .gc-service-request .gc-service-request__form { display: grid; gap: 16px; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; } .gc-service-request__section { padding: 21px; border: 1px solid var(--gcsr-border); border-radius: 16px; background: #fff; box-shadow: 0 8px 25px rgba(25,34,46,.04); } .gc-service-request__section > header { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid #eceef1; } .gc-service-request__section > header > span { display: grid; flex: 0 0 31px; width: 31px; height: 31px; place-items: center; border-radius: 9px; background: var(--gcsr-orange); color: #fff; font-size: 12px; font-weight: 850; } .gc-service-request__section > header h3 { margin: 0 0 2px; color: #252b34; font-size: 15px; font-weight: 820; line-height: 1.3; } .gc-service-request__section > header p { margin: 0; color: #818995; font-size: 11.5px; line-height: 1.45; } .gc-service-request__grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; } .gc-service-request__section > .gc-field + .gc-service-request__grid, .gc-service-request__type + .gc-service-request__grid { margin-top: 15px; } .gc-service-request__description { margin-top: 15px; } .gc-service-request .gc-field { display: flex; min-width: 0; flex-direction: column; gap: 6px; margin: 0; } .gc-service-request .gc-field label { margin: 0; color: #343a43; font: 750 12.5px/1.35 var(--gc-font-body, Inter, Arial, sans-serif); } .gc-service-request .gc-field label > span { color: #c8422f; } .gc-service-request .gc-field label small { display: inline-flex; margin-left: 4px; padding: 2px 6px; border-radius: 999px; background: #f0f2f4; color: #747d88; font-size: 9px; font-weight: 750; } .gc-service-request .gc-field :is(input,select,textarea) { -webkit-appearance: none; appearance: none; width: 100% !important; min-width: 0; min-height: 46px; margin: 0 !important; padding: 10px 12px !important; border: 1px solid #d7dce2 !important; border-radius: 10px !important; background-color: #fff !important; box-shadow: none !important; color: #252b34 !important; font: 500 13px/1.4 var(--gc-font-body, Inter, Arial, sans-serif) !important; letter-spacing: 0 !important; text-transform: none !important; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; } .gc-service-request .gc-field select { padding-right: 34px !important; background-image: linear-gradient(45deg,transparent 50%,#737b86 50%),linear-gradient(135deg,#737b86 50%,transparent 50%) !important; background-position: calc(100% - 17px) 50%,calc(100% - 12px) 50% !important; background-repeat: no-repeat !important; background-size: 5px 5px,5px 5px !important; } .gc-service-request .gc-field textarea { min-height: 118px; resize: vertical; } .gc-service-request .gc-field :is(input,select,textarea)::placeholder { color: #9ba2ab; opacity: 1; } .gc-service-request .gc-field :is(input,select,textarea):hover { border-color: #bfc5cd !important; } .gc-service-request .gc-field :is(input,select,textarea):focus { border-color: var(--gcsr-orange) !important; outline: none !important; box-shadow: 0 0 0 3px rgba(255,116,56,.14) !important; } .gc-service-request .gc-field.has-error :is(input,select,textarea) { border-color: #c93e34 !important; background-color: #fffafa !important; box-shadow: 0 0 0 3px rgba(201,62,52,.1) !important; } .gc-service-request .gc-field > small { display: block; margin: 0; color: #858d98; font-size: 10.5px; line-height: 1.4; } .gc-service-request__label-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .gc-service-request__label-row > span { flex: 0 0 auto; color: #858d98; font-size: 10px; font-weight: 700; } .gc-service-request__type { display: inline-flex; align-items: center; gap: 6px; width: fit-content; margin: 0; padding: 6px 9px; border-radius: 999px; background: #fff1e9; color: var(--gcsr-orange-dark); font-size: 10.5px; font-weight: 800; } .gc-service-request__type :is(i,svg) { width: 13px; height: 13px; } .gc-service-request__additional { margin-top: 15px; border: 1px solid #e2e6eb; border-radius: 11px; background: #fafbfc; } .gc-service-request__additional summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 13px; color: #3c444f; font-size: 11.5px; font-weight: 800; list-style: none; cursor: pointer; } .gc-service-request__additional summary::-webkit-details-marker { display: none; } .gc-service-request__additional summary > span { display: inline-flex; align-items: center; gap: 7px; } .gc-service-request__additional summary :is(i,svg) { width: 15px; height: 15px; color: var(--gcsr-orange-dark); transition: transform .16s ease; } .gc-service-request__additional[open] summary :is(i,svg) { transform: rotate(45deg); } .gc-service-request__additional summary small { color: #858d98; font-size: 9px; } .gc-service-request__additional > .gc-field { padding: 0 13px 13px; } .gc-service-request__footer { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px 18px; padding: 18px 19px; border: 1px solid #ffd5c1; border-radius: 16px; background: #fff8f4; } .gc-service-request__assurance { display: flex; align-items: flex-start; gap: 9px; min-width: 0; } .gc-service-request__assurance > :is(i,svg) { flex: 0 0 19px; width: 19px; height: 19px; margin-top: 1px; color: #258153; } .gc-service-request__assurance div { display: grid; gap: 2px; } .gc-service-request__assurance strong { color: #303741; font-size: 11.5px; } .gc-service-request__assurance span { color: #727b87; font-size: 10.5px; line-height: 1.4; } .gc-service-request .gc-service-request__submit { -webkit-appearance: none !important; appearance: none !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; min-width: 174px !important; min-height: 46px !important; margin: 0 !important; padding: 10px 17px !important; border: 1px solid var(--gcsr-orange) !important; border-radius: 11px !important; background: var(--gcsr-orange) !important; box-shadow: 0 8px 20px rgba(255,116,56,.24) !important; color: #fff !important; font: 800 12.5px/1 var(--gc-font-body, Inter, Arial, sans-serif) !important; letter-spacing: 0 !important; text-decoration: none !important; text-transform: none !important; cursor: pointer !important; } .gc-service-request .gc-service-request__submit:hover { border-color: #e95f24 !important; background: #e95f24 !important; box-shadow: 0 11px 25px rgba(255,116,56,.3) !important; transform: translateY(-1px); } .gc-service-request .gc-service-request__submit:focus-visible { outline: 3px solid rgba(255,116,56,.28) !important; outline-offset: 3px; } .gc-service-request .gc-service-request__submit[aria-busy="true"] { opacity: .72; cursor: wait !important; pointer-events: none; } .gc-service-request__submit :is(i,svg) { width: 16px; height: 16px; } .gc-service-request__footer > p { grid-column: 1 / -1; margin: -4px 0 0; color: #89909a; font-size: 9.5px; text-align: right; } .gc-service-request__footer > p span { color: #c8422f; } .gc-service-request__gate { display: flex; align-items: flex-start; gap: 13px; padding: 19px; border: 1px solid #e0e4e9; border-radius: 15px; background: #f8f9fa; } .gc-service-request__gate > span { display: grid; flex: 0 0 40px; width: 40px; height: 40px; place-items: center; border-radius: 11px; background: #fff0e8; color: var(--gcsr-orange-dark); } .gc-service-request__gate > span :is(i,svg) { width: 20px; height: 20px; } .gc-service-request__gate h3 { margin: 0 0 4px; color: #29303a; font-size: 14px; } .gc-service-request__gate p { margin: 0; color: #737c88; font-size: 12px; line-height: 1.5; } .gc-service-request .gc-service-request__gate-button { display: inline-flex !important; align-items: center !important; gap: 7px !important; min-height: 38px !important; margin-top: 11px !important; padding: 8px 12px !important; border: 1px solid var(--gcsr-orange) !important; border-radius: 9px !important; background: var(--gcsr-orange) !important; color: #fff !important; font: 800 11px/1 var(--gc-font-body, Inter, Arial, sans-serif) !important; text-decoration: none !important; } .gc-service-request__gate-button :is(i,svg) { width: 14px; height: 14px; } @media (max-width: 680px) { .gc-service-request__recipient { align-items: flex-start; } .gc-service-request__private { margin-left: 0; } .gc-service-request__recipient { flex-wrap: wrap; } .gc-service-request__recipient-copy { flex: 1 1 calc(100% - 60px); } .gc-service-request__steps strong { display: none; } .gc-service-request__steps li { justify-content: center; padding-inline: 5px; } .gc-service-request__section { padding: 17px; border-radius: 14px; } .gc-service-request__grid { grid-template-columns: 1fr; gap: 13px; } .gc-service-request__footer { grid-template-columns: 1fr; } .gc-service-request .gc-service-request__submit { width: 100% !important; } .gc-service-request__footer > p { text-align: left; } } @media (max-width: 420px) { .gc-service-request__header { gap: 11px; } .gc-service-request__header-icon { flex-basis: 40px; width: 40px; height: 40px; } .gc-service-request__header :is(h1,h2) { font-size: 21px; } .gc-service-request__section > header { gap: 9px; } } /* Acciones en perfil público (favorito + cotización) */ .gc-company__gc2-actions { margin: 4px 0 0; } .gc-company__gc2-buttons { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 4px; } .gc-favorite-action { transition: background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease; } .gc-favorite-action:hover { transform: translateY(-1px); } .gc-favorite-card--active { border-color: var(--gc-primary, #ff7438) !important; background: var(--gc-primary, #ff7438) !important; color: #fff !important; } .gc-favorite-card--active :is(i,svg) { fill: currentColor; } .gc-favorite-action[aria-busy="true"] { opacity: .7; cursor: wait; } .gc-action-toast { position: fixed; right: 20px; bottom: 20px; z-index: 99999; display: flex; max-width: min(390px,calc(100vw - 28px)); align-items: center; gap: 9px; padding: 13px 16px; border: 1px solid #dce5df; border-radius: 12px; background: #17201b; box-shadow: 0 16px 45px rgba(0,0,0,.25); color: #fff; font: 700 13px/1.35 var(--gc-font-body, Inter, Arial, sans-serif); animation: gc-action-toast-in .2s ease-out; } .gc-action-toast.is-error { border-color: #f1c7c7; background: #822d2d; } .gc-action-toast :is(i,svg) { width: 18px; height: 18px; color: #6ee7a0; } .gc-action-toast.is-error :is(i,svg) { color: #ffd1d1; } @keyframes gc-action-toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } } @media (max-width:620px) { .gc-action-toast { right: 14px; bottom: 14px; left: 14px; max-width: none; } } @media (prefers-reduced-motion:reduce) { .gc-action-toast { animation: none; } } /* Tarjetas de favoritos */ .gc-favorite-card { display: flex; flex-direction: column; gap: 12px; } .gc-favorite-card__head { display: flex; gap: 14px; align-items: flex-start; } .gc-favorite-card__head h3 { font-size: 16px; margin: 0 0 3px; } .gc-favorite-card__head h3 a { color: var(--gc-dark, #1f1f1f); text-decoration: none; } .gc-favorite-card__head h3 a:hover { color: var(--gc-primary, #ff7438); } .gc-favorite-card__type { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--gc-primary-dark, #e85f24); margin: 0 0 3px; } .gc-favorite-card__type svg { width: 14px; height: 14px; } .gc-favorite-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; } /* Tarjeta de membresía */ .gc-membership-card__plan { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; } .gc-membership-card__plan > svg { width: 30px; height: 30px; color: var(--gc-primary, #ff7438); } .gc-membership-card__plan strong { display: block; font-size: 18px; font-family: var(--gc-font-display, sans-serif); color: var(--gc-dark, #1f1f1f); margin-bottom: 4px; } .gc-membership-card__data { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 14px; } .gc-membership-card__data span { display: block; font-size: 12px; color: var(--gc-text-soft, #6b7280); margin-bottom: 3px; } .gc-membership-card__data strong { color: var(--gc-dark, #1f1f1f); font-size: 15px; } .gc-membership-card--current { border-left: 4px solid var(--gc-primary, #ff7438); } .gc-membership__title { font-size: 18px; margin: 8px 0 0; } .gc-plan-card { display: flex; flex-direction: column; gap: 10px; } .gc-plan-card h3 { font-size: 18px; margin: 0; } .gc-plan-card__limit { color: var(--gc-primary-dark, #e85f24); font-weight: 600; margin: 0; } .gc-plan-card--active { border: 2px solid var(--gc-primary, #ff7438); } .gc-plan-card .gc-req-list { margin: 6px 0; } .gc-plan-card .gc-req-list li { font-size: 13.5px; } .gc-plan-card button[disabled] { opacity: .6; cursor: not-allowed; margin-top: auto; } /* Gráfico */ .gc-chart-card canvas { width: 100% !important; max-height: 240px; } .gc-company-performance { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:16px 0; } @media (max-width:900px) { .gc-company-performance { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:520px) { .gc-company-performance { grid-template-columns:1fr; } } /* Switch (checkbox grande) */ .gc-switch span { padding: 9px 14px !important; } /* Notificación / aviso compacto */ .gc-notification-box { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: var(--gc-primary-soft, #fff1ea); border-radius: var(--gc-radius-sm, 9px); color: var(--gc-primary-dark, #e85f24); font-size: 14px; } /* Completitud de perfil */ .gc-profile-progress { display: flex; flex-direction: column; gap: 14px; border-left: 4px solid var(--gc-primary, #ff7438); } .gc-profile-progress__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; } .gc-profile-progress__head h2 { margin: 0 0 4px; font-size: 18px; } .gc-profile-progress__head p { margin: 0; color: var(--gc-text-soft, #6b7280); font-size: 13.5px; } .gc-profile-progress__pct { font-size: 28px; font-weight: 800; color: var(--gc-primary, #ff7438); font-family: var(--gc-font-display, sans-serif); line-height: 1; } .gc-progress { width: 100%; height: 10px; background: var(--gc-light-bg, #f0f1f3); border-radius: 999px; overflow: hidden; } .gc-progress__bar { display: block; height: 100%; background: linear-gradient(90deg, #ff8a52, var(--gc-primary, #ff7438)); border-radius: 999px; transition: width .4s ease; } .gc-profile-progress__missing { margin: 0; } .gc-profile-progress__missing .gc-tag svg { width: 13px; height: 13px; opacity: .6; } .gc-profile-progress .gc-button { align-self: flex-start; } /* Stats de perfil (reutilizable) */ .gc-profile-stats { display: flex; gap: 18px; flex-wrap: wrap; } .gc-profile-stats div { text-align: center; } .gc-profile-stats strong { display: block; font-size: 20px; color: var(--gc-dark, #1f1f1f); } .gc-profile-stats span { font-size: 12px; color: var(--gc-text-soft, #6b7280); } @media (max-width: 640px) { .gc-quote-card__top { flex-direction: column; } .gc-quote-card__top .gc-application__side { align-items: flex-start; } } /* Equipo de empresa */ .gc-company-team-layout { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.85fr); gap:20px; align-items:start; } .gc-company-team-list { display:grid; gap:12px; } .gc-company-team-card { display:grid; grid-template-columns:52px minmax(0,1fr) auto; gap:14px; align-items:start; padding:16px; border:1px solid var(--gc-border,#e7e8ec); border-radius:14px; background:#fff; } .gc-company-team-card__avatar,.gc-public-team__grid article>span { display:grid; place-items:center; width:52px; height:52px; border-radius:14px; color:#fff; background:#1f1f1f; font-size:21px; font-weight:850; } .gc-company-team-card h3,.gc-public-team h3 { margin:0 0 3px; font-size:16px; } .gc-company-team-card p { margin:0 0 7px; color:var(--gc-primary,#ff7438); font-weight:700; } .gc-company-team-card small { display:block; margin:0 0 9px; color:var(--gc-text-soft,#667085); line-height:1.5; } .gc-company-team-card__edit { min-width:90px; } .gc-company-team-card__edit summary { cursor:pointer; list-style:none; } .gc-company-team-card__edit summary::-webkit-details-marker { display:none; } .gc-company-team-card__edit[open] { grid-column:1/-1; padding-top:12px; border-top:1px solid var(--gc-border,#e7e8ec); } .gc-company-team-form { margin-top:12px; } .gc-button--danger { color:var(--gc-danger,#aa2c2c)!important; } .gc-button--danger:hover,.gc-button--danger:focus-visible { background:#fff2f2; color:#8f2020!important; } .gc-public-team__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; } .gc-public-team__grid article { display:flex; gap:13px; align-items:flex-start; padding:15px; border:1px solid var(--gc-border,#e7e8ec); border-radius:14px; } .gc-public-team__grid article>span { flex:none; width:44px; height:44px; border-radius:12px; font-size:18px; } .gc-public-team__grid strong { display:block; color:var(--gc-primary,#ff7438); font-size:13px; } .gc-public-team__grid p { margin:7px 0 0; color:var(--gc-text-soft,#667085); font-size:13px; line-height:1.5; } @media (max-width: 900px) { .gc-company-team-layout { grid-template-columns:1fr; } } @media (max-width: 600px) { .gc-company-team-card { grid-template-columns:44px 1fr; } .gc-company-team-card__edit { grid-column:1/-1; } } /* ================================================================ BOOST POR COMUNA ================================================================ */ .gc-boost { --boost-orange:#ff7438; --boost-dark:#1f1f1f; color:#344054; } .gc-boost * { box-sizing:border-box; } .gc-boost__hero { display:flex; justify-content:space-between; gap:28px; align-items:flex-start; padding:30px; border-radius:22px; color:#fff; background:linear-gradient(125deg,#1f1f1f 0%,#30241f 64%,#69331d 100%); box-shadow:0 18px 42px rgba(31,31,31,.16); overflow:hidden; position:relative; } .gc-boost__hero:after { content:""; position:absolute; width:230px; height:230px; right:-70px; bottom:-120px; border-radius:50%; background:rgba(255,116,56,.2); } .gc-boost__hero > * { position:relative; z-index:1; } .gc-boost__hero h1 { color:#fff; margin:8px 0 10px; max-width:760px; font-size:clamp(25px,3vw,38px); line-height:1.12; } .gc-boost__hero p { margin:0; max-width:720px; color:rgba(255,255,255,.78); font-size:15px; line-height:1.65; } .gc-boost__eyebrow { display:inline-flex; align-items:center; gap:7px; color:#ffb28e; font-weight:800; font-size:12px; letter-spacing:.08em; text-transform:uppercase; } .gc-boost__eyebrow svg { width:17px; height:17px; } .gc-boost__plan { flex:none; display:inline-flex; padding:9px 13px; border:1px solid rgba(255,255,255,.22); border-radius:999px; background:rgba(255,255,255,.1); font-size:12px; font-weight:800; } .gc-boost__stats { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:18px 0 28px; } .gc-boost__stats article { display:flex; align-items:center; gap:14px; padding:19px; background:#fff; border:1px solid #e8e9ee; border-radius:16px; box-shadow:0 8px 22px rgba(31,31,31,.05); } .gc-boost__stats article > span { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:#fff1ea; color:var(--boost-orange); } .gc-boost__stats svg { width:20px; height:20px; } .gc-boost__stats small,.gc-boost__stats strong { display:block; } .gc-boost__stats small { color:#667085; font-size:12px; margin-bottom:3px; } .gc-boost__stats strong { color:var(--boost-dark); font-size:23px; line-height:1; } .gc-boost__section { margin:0 0 30px; } .gc-boost__section-head { display:flex; justify-content:space-between; align-items:end; gap:20px; margin:0 0 16px; } .gc-boost__section-head span { display:block; margin-bottom:3px; color:var(--boost-orange); font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; } .gc-boost__section-head h2 { margin:0; color:var(--boost-dark); font-size:23px; } .gc-boost__section-head p { margin:0; max-width:520px; color:#667085; font-size:13px; } .gc-boost__active-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(265px,1fr)); gap:16px; } .gc-boost-card { padding:20px; border:1px solid #e6e8ed; border-top:3px solid #ff7438; border-radius:17px; background:#fff; box-shadow:0 9px 25px rgba(31,31,31,.055); } .gc-boost-card.is-suspended { border-top-color:#f79009; } .gc-boost-card.is-expired,.gc-boost-card.is-cancelled { border-top-color:#98a2b3; } .gc-boost-card__top { display:flex; align-items:center; justify-content:space-between; gap:10px; } .gc-boost-card__icon { display:grid; place-items:center; width:38px; height:38px; border-radius:11px; background:#fff1ea; color:#ff7438; } .gc-boost-card__icon svg { width:19px; height:19px; } .gc-boost-status { padding:6px 9px; border-radius:999px; color:#067647; background:#ecfdf3; font-size:11px; font-weight:800; } .gc-boost-status.is-suspended,.gc-boost-status.is-paused,.gc-boost-status.is-pending { color:#b54708; background:#fffaeb; } .gc-boost-status.is-expired,.gc-boost-status.is-cancelled { color:#475467; background:#f2f4f7; } .gc-boost-card h3 { margin:15px 0 2px; color:#1f1f1f; font-size:20px; } .gc-boost-card > p { margin:0; color:#667085; font-size:13px; } .gc-boost-card__dates { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:16px 0 12px; padding:12px; border-radius:11px; background:#f8f9fb; } .gc-boost-card__dates small,.gc-boost-card__dates strong { display:block; } .gc-boost-card__dates small { font-size:10px; color:#98a2b3; text-transform:uppercase; letter-spacing:.05em; } .gc-boost-card__dates strong { margin-top:3px; color:#344054; font-size:13px; } .gc-boost-card__remaining { display:flex; align-items:center; gap:6px; margin-bottom:12px; color:#067647; font-size:12px; } .gc-boost-card__remaining svg { width:15px; height:15px; } .gc-boost-card__notice { display:flex; gap:7px; margin:10px 0; padding:9px; border-radius:9px; background:#fffaeb; color:#93370d; font-size:11px; line-height:1.45; } .gc-boost-card__notice svg { flex:none; width:15px; height:15px; } .gc-boost-card__metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; padding:13px 0; border-top:1px solid #eef0f3; } .gc-boost-card__metrics span,.gc-boost-card__metrics strong { display:block; } .gc-boost-card__metrics span { color:#98a2b3; font-size:10px; } .gc-boost-card__metrics strong { color:#344054; font-size:14px; } .gc-boost-card .gc-button { width:100%; justify-content:center; margin-top:3px; } .gc-boost__purchase { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:22px; align-items:start; } .gc-boost__purchase-main,.gc-boost__help,.gc-boost__history { padding:23px; background:#fff; border:1px solid #e6e8ed; border-radius:18px; box-shadow:0 9px 25px rgba(31,31,31,.05); } .gc-boost-form fieldset { min-width:0; margin:0; padding:19px 0; border:0; border-top:1px solid #edf0f3; } .gc-boost-form legend { display:flex; gap:11px; align-items:center; width:100%; padding:0 0 14px; } .gc-boost-form legend > span { display:grid; place-items:center; width:30px; height:30px; flex:none; border-radius:9px; color:#fff; background:#1f1f1f; font-weight:800; } .gc-boost-form legend strong,.gc-boost-form legend small { display:block; } .gc-boost-form legend strong { color:#1f1f1f; font-size:14px; } .gc-boost-form legend small { margin-top:2px; color:#667085; font-size:11px; } .gc-boost-form__location { display:grid; grid-template-columns:1fr 1fr; gap:14px; } .gc-boost-limit { margin:0 0 14px; opacity:.78; } .gc-boost-limit.is-blocking { opacity:1; border-color:#f79009; } .gc-boost-form :is(select,input) { width:100%; } .gc-boost-form__packages { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; } .gc-boost-package { position:relative; display:flex; flex-direction:column; min-height:132px; padding:17px; border:1px solid #dfe3e8; border-radius:14px; cursor:pointer; transition:.18s ease; } .gc-boost-package:hover { border-color:#ff9f73; transform:translateY(-1px); } .gc-boost-package:has(input:checked) { border-color:#ff7438; box-shadow:0 0 0 3px rgba(255,116,56,.12); background:#fffaf7; } .gc-boost-package input { position:absolute; opacity:0; pointer-events:none; } .gc-boost-package__check { position:absolute; top:12px; right:12px; display:grid; place-items:center; width:21px; height:21px; border:1px solid #d0d5dd; border-radius:50%; color:transparent; } .gc-boost-package:has(input:checked) .gc-boost-package__check { color:#fff; border-color:#ff7438; background:#ff7438; } .gc-boost-package__check svg { width:13px; height:13px; } .gc-boost-package > strong { color:#1f1f1f; font-size:16px; } .gc-boost-package__price { margin:9px 0 4px; color:#ff7438; font-size:20px; font-weight:850; } .gc-boost-package__price :is(del,ins) { display:block; text-decoration:none; } .gc-boost-package small { margin-top:auto; color:#667085; font-size:10px; } .gc-boost-package.is-disabled { opacity:.5; cursor:not-allowed; } .gc-boost-form__footer { display:flex; align-items:center; justify-content:space-between; gap:18px; padding-top:17px; border-top:1px solid #edf0f3; } .gc-boost-form__footer > div { display:flex; align-items:center; gap:9px; color:#475467; } .gc-boost-form__footer > div svg { width:21px; height:21px; color:#12b76a; } .gc-boost-form__footer strong,.gc-boost-form__footer small { display:block; } .gc-boost-form__footer strong { font-size:12px; } .gc-boost-form__footer small { font-size:10px; color:#98a2b3; } .gc-boost__help { position:sticky; top:18px; } .gc-boost__help h3 { margin:0 0 16px; color:#1f1f1f; font-size:17px; } .gc-boost__help ol { list-style:none; margin:0; padding:0; } .gc-boost__help li { display:flex; gap:10px; margin:0 0 14px; } .gc-boost__help li > span { display:grid; place-items:center; width:25px; height:25px; flex:none; border-radius:8px; color:#fff; background:#1f1f1f; font-size:11px; font-weight:800; } .gc-boost__help li p,.gc-boost__help li strong,.gc-boost__help li small { display:block; margin:0; } .gc-boost__help li strong { color:#344054; font-size:12px; } .gc-boost__help li small { margin-top:2px; color:#667085; font-size:10px; line-height:1.45; } .gc-boost__help-note { display:flex; gap:8px; margin-top:17px; padding:12px; border-radius:11px; background:#fff5f0; color:#7a2e0e; font-size:11px; line-height:1.55; } .gc-boost__help-note svg { flex:none; width:17px; height:17px; color:#ff7438; } .gc-boost__help-note p { margin:0; } .gc-boost__membership-date { display:flex; justify-content:space-between; margin-top:15px; padding-top:14px; border-top:1px solid #edf0f3; font-size:11px; } .gc-boost__membership-date span { color:#667085; } .gc-boost__membership-date strong { color:#344054; } .gc-boost__history { margin-top:22px; } @media (max-width:980px) { .gc-boost__purchase { grid-template-columns:1fr; } .gc-boost__help { position:static; } } @media (max-width:760px) { .gc-boost__hero { flex-direction:column; padding:23px; } .gc-boost__stats { grid-template-columns:1fr; } .gc-boost__section-head { align-items:flex-start; flex-direction:column; gap:5px; } .gc-boost-form__packages { grid-template-columns:1fr; } } @media (max-width:560px) { .gc-boost__purchase-main,.gc-boost__help,.gc-boost__history { padding:17px; border-radius:14px; } .gc-boost-form__location { grid-template-columns:1fr; } .gc-boost-form__footer { align-items:stretch; flex-direction:column; } .gc-boost-form__footer .gc-button { justify-content:center; width:100%; } .gc-boost-card__metrics { grid-template-columns:1fr 1fr 1fr; } } /* ========================================================================== Registro profesional de perfiles ========================================================================== */ .gc-publish-page { padding: 32px 20px 64px; background: radial-gradient(circle at 8% 10%, rgba(255,116,56,.08), transparent 24rem), linear-gradient(180deg, #fbfbfc 0%, #f5f6f8 100%); } .gc-wizard { max-width: 1180px; gap: 22px; } .gc-wizard, .gc-wizard * { box-sizing: border-box; } .gc-wizard__crumb { display: flex; align-items: center; gap: 6px; margin: 0 0 12px; color: #747a84; font-size: 13px; } .gc-wizard__crumb a { color: inherit; text-decoration: none; } .gc-wizard__crumb a:hover { color: var(--gc-primary, #ff7438); } .gc-wizard__crumb :is(i[data-lucide], svg.lucide) { width: 14px; height: 14px; } .gc-wizard__hero { position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 258px; padding: clamp(30px, 5vw, 54px); overflow: hidden; border-radius: 24px; background: radial-gradient(circle at 86% 18%, rgba(255,116,56,.45), transparent 28%), linear-gradient(135deg, #171717 0%, #292929 100%); box-shadow: 0 18px 55px rgba(22,26,32,.14); color: #fff; } .gc-wizard__hero::after { content: ''; position: absolute; right: -90px; bottom: -180px; width: 360px; height: 360px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; } .gc-wizard__hero-copy { position: relative; z-index: 1; max-width: 760px; } .gc-wizard__eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; color: #ffc1a6; font-size: 13px; font-weight: 750; letter-spacing: .03em; text-transform: uppercase; } .gc-wizard__eyebrow :is(i[data-lucide], svg.lucide) { width: 17px; height: 17px; } .gc-wizard__intro h1 { max-width: 680px; margin: 0; color: #fff; font-size: clamp(32px, 5vw, 50px); font-weight: 850; letter-spacing: -.045em; line-height: 1.04; } .gc-wizard__sub { max-width: 720px; margin: 16px 0 0; color: rgba(255,255,255,.76); font-size: 16px; line-height: 1.65; } .gc-wizard__trust { display: flex; flex-wrap: wrap; gap: 12px 22px; margin: 22px 0 0; padding: 0; list-style: none; } .gc-wizard__trust li { display: inline-flex; align-items: center; gap: 7px; color: rgba(255,255,255,.88); font-size: 13.5px; font-weight: 650; } .gc-wizard__trust :is(i[data-lucide], svg.lucide) { width: 17px; height: 17px; color: #ff8f5f; } .gc-wizard__hero-mark { position: relative; z-index: 1; display: grid; width: 112px; height: 112px; place-items: center; flex: 0 0 auto; margin-left: 28px; border: 1px solid rgba(255,255,255,.2); border-radius: 28px; background: rgba(255,255,255,.08); color: #ff9b70; transform: rotate(5deg); } .gc-wizard__hero-mark :is(i[data-lucide], svg.lucide) { width: 56px; height: 56px; } .gc-wizard__form { margin: 0; } .gc-wizard__layout { display: grid; grid-template-columns: 278px minmax(0, 1fr); gap: 22px; align-items: start; } .gc-wizard__aside { position: sticky; top: 24px; display: grid; gap: 14px; } .gc-wizard__aside-card, .gc-wizard__summary { border: 1px solid #e5e7eb; border-radius: 18px; background: #fff; box-shadow: 0 10px 34px rgba(22,26,32,.05); } .gc-wizard__aside-card { padding: 20px 12px; } .gc-wizard__aside-kicker { margin: 0 10px 14px; color: #9298a2; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; } /* Progreso lateral */ .gc-stepper { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; } .gc-stepper__item { position: relative; margin: 0; padding: 0; color: #7b818b; } .gc-stepper__item:not(:last-child)::after { content: ''; position: absolute; z-index: 0; top: 35px; bottom: -9px; left: 23px; width: 2px; background: #eceef1; } .gc-stepper__item.is-done:not(:last-child)::after { background: #8fd3ad; } .gc-stepper__button { position: relative; z-index: 1; display: flex; width: 100%; align-items: center; gap: 11px; padding: 9px 10px; border: 0; border-radius: 11px; background: transparent; color: inherit; font: inherit; font-size: 13.5px; font-weight: 650; text-align: left; cursor: pointer; } .gc-stepper__button:not(:disabled):hover { background: #f7f8f9; color: #1f1f1f; } .gc-stepper__button:disabled { cursor: default; } .gc-stepper__num, .gc-stepper__check { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 50%; background: #f0f1f3; color: #8e949d; font-size: 12px; font-weight: 800; } .gc-stepper__check { display: none; background: #1c9c60; color: #fff; } .gc-stepper__check :is(i[data-lucide], svg.lucide) { width: 14px; height: 14px; } .gc-stepper__item.is-active .gc-stepper__button { background: #fff3ee; color: #d95720; } .gc-stepper__item.is-active .gc-stepper__num { background: var(--gc-primary, #ff7438); color: #fff; box-shadow: 0 0 0 4px rgba(255,116,56,.14); } .gc-stepper__item.is-done .gc-stepper__num { display: none; } .gc-stepper__item.is-done .gc-stepper__check { display: inline-flex; } .gc-stepper__item.is-done { color: #333842; } /* Resumen lateral */ .gc-wizard__summary { padding: 18px; } .gc-wizard__summary-head { display: flex; align-items: center; gap: 11px; padding-bottom: 14px; border-bottom: 1px solid #eceef1; } .gc-wizard__summary-icon { display: grid; width: 40px; height: 40px; place-items: center; flex: 0 0 auto; border-radius: 12px; background: #fff1eb; color: var(--gc-primary, #ff7438); } .gc-wizard__summary-icon :is(i[data-lucide], svg.lucide) { width: 20px; height: 20px; } .gc-wizard__summary-head div { display: grid; min-width: 0; } .gc-wizard__summary-head small { color: #9298a2; font-size: 11px; } .gc-wizard__summary-head strong { overflow: hidden; color: #1f1f1f; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; } .gc-wizard__summary dl { display: grid; gap: 11px; margin: 15px 0 0; } .gc-wizard__summary dl div { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; } .gc-wizard__summary dt, .gc-wizard__summary dd { margin: 0; font-size: 12px; } .gc-wizard__summary dt { color: #9298a2; } .gc-wizard__summary dd { max-width: 145px; color: #343942; font-weight: 700; text-align: right; } .gc-wizard__draft-state { display: flex; align-items: flex-start; gap: 7px; margin: 15px 0 0; padding-top: 13px; border-top: 1px solid #eceef1; color: #838994; font-size: 10.5px; line-height: 1.45; } .gc-wizard__draft-state :is(i[data-lucide], svg.lucide) { width: 14px; height: 14px; flex: 0 0 auto; color: #1c9c60; } .gc-wizard__mobile-progress { display: none; } /* Contenido y formularios */ .gc-wizard__card { min-height: 570px; padding: clamp(25px, 4vw, 42px); border: 1px solid #e5e7eb; border-radius: 20px; box-shadow: 0 14px 42px rgba(22,26,32,.055); } .gc-step[hidden], .gc-foreign-fields[hidden], [data-gc-specialty-empty][hidden] { display: none !important; } .gc-step { display: none; } .gc-step.is-active { display: block; animation: gc-wizard-enter .22s ease; } @keyframes gc-wizard-enter { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } } .gc-step__head { max-width: 720px; margin-bottom: 26px; } .gc-step__number { display: block; margin-bottom: 7px; color: var(--gc-primary, #ff7438); font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; } .gc-step h2 { margin: 0; color: #1f1f1f; font-size: clamp(24px, 3.5vw, 31px); font-weight: 820; letter-spacing: -.03em; line-height: 1.15; } .gc-step__hint { margin: 10px 0 0; color: #6f7580; font-size: 14px; line-height: 1.6; } .gc-step__hint strong { color: #343942; } .gc-form-section { padding: 22px; border: 1px solid #e7e9ed; border-radius: 16px; background: #fcfcfd; } .gc-form-section + .gc-form-section { margin-top: 16px; } .gc-form-section__head { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 20px; } .gc-form-section__head > span { display: grid; width: 34px; height: 34px; place-items: center; flex: 0 0 auto; border-radius: 10px; background: #fff0e9; color: var(--gc-primary, #ff7438); } .gc-form-section__head > span :is(i[data-lucide], svg.lucide) { width: 18px; height: 18px; } .gc-form-section__head h3 { margin: 1px 0 2px; color: #252a32; font-size: 15px; } .gc-form-section__head p { margin: 0; color: #878d96; font-size: 12.5px; } .gc-wizard .gc-field { display: flex; flex-direction: column; min-width: 0; gap: 7px; margin-bottom: 16px; } .gc-wizard .gc-field:last-child { margin-bottom: 0; } .gc-wizard .gc-grid-2, .gc-wizard .gc-grid-3 { align-items: start; } .gc-wizard .gc-field label { color: #333841; font-size: 13px; font-weight: 720; } .gc-wizard .gc-field label > span { color: #cf3d34; } .gc-wizard .gc-field label small { margin-left: 4px; color: #9298a2; font-size: 10.5px; font-weight: 600; } .gc-wizard .gc-field :is(input, select, textarea) { width: 100%; min-height: 48px; margin: 0; padding: 11px 13px; border: 1px solid #d9dce1; border-radius: 10px; background: #fff; color: #252a32; font: inherit; font-size: 14px; transition: border-color .15s, box-shadow .15s; } .gc-wizard .gc-field textarea { min-height: 94px; resize: vertical; line-height: 1.5; } .gc-wizard .gc-field :is(input, select, textarea):focus { border-color: var(--gc-primary, #ff7438); outline: none; box-shadow: 0 0 0 3px rgba(255,116,56,.14); } .gc-wizard .gc-field :is(input, textarea)::placeholder { color: #a2a7af; } .gc-field__help { color: #878d96; font-size: 11.5px; line-height: 1.4; } .gc-field__label-row { display: flex; justify-content: space-between; gap: 12px; } .gc-field__label-row > span { color: #9298a2; font-size: 11px; } .gc-identity-foreign-toggle { margin: -4px 0 18px; } .gc-foreign-fields { padding: 18px; margin-bottom: 18px; border: 1px dashed #d7dbe0; border-radius: 12px; background: #fff; } .gc-wizard__error-summary { display: grid; gap: 3px; margin-bottom: 20px; padding: 14px 16px; border: 1px solid #e9a7a2; border-left: 4px solid #c9453c; border-radius: 10px; background: #fff7f6; color: #8e2923; } .gc-wizard__error-summary[hidden] { display: none; } .gc-wizard__error-summary strong { font-size: 13px; } .gc-wizard__error-summary span { font-size: 12px; } .gc-input-error { border-color: #c9453c !important; box-shadow: 0 0 0 3px rgba(201,69,60,.11) !important; } .gc-field__error { color: #b52f28; font-size: 11.5px; font-weight: 650; } /* Tipos de cuenta */ .gc-type-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; } .gc-type-card { position: relative; display: flex; min-height: 278px; flex-direction: column; gap: 14px; padding: 20px; border: 1.5px solid #e2e4e8; border-radius: 16px; background: #fff; cursor: pointer; transition: transform .16s, border-color .16s, box-shadow .16s; } .gc-type-card:hover { border-color: #ffb08e; box-shadow: 0 12px 28px rgba(31,35,41,.07); transform: translateY(-2px); } .gc-type-card > input { position: absolute; opacity: 0; pointer-events: none; } .gc-type-card__top { display: flex; align-items: center; justify-content: space-between; } .gc-type-card__icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 13px; background: #fff0ea; color: var(--gc-primary, #ff7438); } .gc-type-card__icon :is(i[data-lucide], svg.lucide) { width: 23px; height: 23px; } .gc-type-card__choice { display: grid; width: 24px; height: 24px; place-items: center; border: 1.5px solid #d6d9de; border-radius: 50%; color: transparent; } .gc-type-card__choice :is(i[data-lucide], svg.lucide) { width: 13px; height: 13px; } .gc-type-card__text { display: grid; gap: 5px; } .gc-type-card__text strong { color: #242931; font-size: 15px; } .gc-type-card__text span { color: #777d87; font-size: 12.5px; line-height: 1.45; } .gc-type-card ul { display: grid; gap: 7px; margin: auto 0 0; padding: 13px 0 0; border-top: 1px solid #eceef1; list-style: none; } .gc-type-card li { display: flex; align-items: flex-start; gap: 6px; color: #5f6570; font-size: 11.5px; line-height: 1.35; } .gc-type-card li :is(i[data-lucide], svg.lucide) { width: 13px; height: 13px; flex: 0 0 auto; margin-top: 1px; color: #1c9c60; } .gc-type-card:has(input:focus-visible) { outline: 3px solid rgba(255,116,56,.22); outline-offset: 2px; } .gc-type-card:has(input:checked) { border-color: var(--gc-primary, #ff7438); background: #fff9f6; box-shadow: 0 10px 26px rgba(255,116,56,.1); } .gc-type-card:has(input:checked) .gc-type-card__choice { border-color: var(--gc-primary, #ff7438); background: var(--gc-primary, #ff7438); color: #fff; } /* Especialidades */ .gc-specialty-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 20px; } .gc-specialty-toolbar > label { position: relative; flex: 1 1 auto; } .gc-specialty-toolbar > label :is(i[data-lucide], svg.lucide) { position: absolute; z-index: 1; top: 50%; left: 13px; width: 18px; height: 18px; color: #8c929c; transform: translateY(-50%); pointer-events: none; } .gc-specialty-toolbar input { width: 100%; min-height: 46px; padding: 10px 13px 10px 42px; border: 1px solid #d9dce1; border-radius: 10px; background: #fff; font: inherit; font-size: 14px; } .gc-specialty-toolbar input:focus { border-color: var(--gc-primary, #ff7438); outline: 0; box-shadow: 0 0 0 3px rgba(255,116,56,.14); } .gc-specialty-counter { flex: 0 0 auto; padding: 8px 11px; border-radius: 999px; background: #fff0ea; color: #c95220; font-size: 12px; font-weight: 750; } .gc-chips { display: flex; flex-wrap: wrap; gap: 10px; } .gc-chip { cursor: pointer; } .gc-chip[hidden] { display: none; } .gc-chip input { position: absolute; opacity: 0; pointer-events: none; } .gc-chip span { display: inline-flex; min-height: 40px; align-items: center; padding: 8px 15px; border: 1.5px solid #dde0e4; border-radius: 999px; background: #fff; color: #414650; font-size: 13px; font-weight: 630; transition: all .15s; } .gc-chip:hover span { border-color: #ffad89; } .gc-chip.is-checked span { border-color: var(--gc-primary, #ff7438); background: #fff2ec; color: #cf5521; } .gc-chip.is-checked span::before { content: '✓'; margin-right: 6px; font-weight: 900; } .gc-chip.is-disabled span { opacity: .42; cursor: not-allowed; } .gc-specialty-empty { margin: 20px 0; color: #777d87; font-size: 13px; text-align: center; } .gc-wizard__tip, .gc-wizard__final-note { display: flex; align-items: flex-start; gap: 11px; margin-top: 24px; padding: 14px 16px; border-radius: 12px; background: #fff8e8; color: #725418; } .gc-wizard__tip > :is(i[data-lucide], svg.lucide), .gc-wizard__final-note > :is(i[data-lucide], svg.lucide) { width: 19px; height: 19px; flex: 0 0 auto; } .gc-wizard__tip div, .gc-wizard__final-note div { display: grid; gap: 2px; } .gc-wizard__tip strong, .gc-wizard__final-note strong { font-size: 12.5px; } .gc-wizard__tip span, .gc-wizard__final-note span { font-size: 12px; line-height: 1.45; } /* Cobertura */ .gc-option-card { display: flex; align-items: flex-start; gap: 12px; margin-top: 16px; padding: 16px; border: 1.5px solid #e1e4e8; border-radius: 13px; background: #fff; cursor: pointer; } .gc-option-card > input { position: absolute; opacity: 0; pointer-events: none; } .gc-option-card__check { display: grid; width: 23px; height: 23px; place-items: center; flex: 0 0 auto; border: 1.5px solid #d3d7dc; border-radius: 7px; color: transparent; } .gc-option-card__check :is(i[data-lucide], svg.lucide) { width: 14px; height: 14px; } .gc-option-card > span:last-child { display: grid; gap: 3px; } .gc-option-card strong { color: #30353d; font-size: 13px; } .gc-option-card small { color: #7b818b; font-size: 11.5px; } .gc-option-card:has(input:checked) { border-color: var(--gc-primary, #ff7438); background: #fff8f5; } .gc-option-card:has(input:checked) .gc-option-card__check { border-color: var(--gc-primary, #ff7438); background: var(--gc-primary, #ff7438); color: #fff; } /* Planes */ .gc-plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .gc-plan-pick { position: relative; cursor: pointer; } .gc-plan-pick > input { position: absolute; opacity: 0; pointer-events: none; } .gc-plan-pick__body { position: relative; display: flex; min-height: 205px; height: 100%; flex-direction: column; padding: 20px; border: 1.5px solid #e0e3e7; border-radius: 15px; background: #fff; transition: border-color .15s, box-shadow .15s; } .gc-plan-pick__badge { position: absolute; top: -10px; right: 14px; padding: 5px 9px; border-radius: 999px; background: #1f1f1f; color: #fff; font-size: 9.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; } .gc-plan-pick__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; } .gc-plan-pick__name { color: #2d323a; font-size: 13px; font-weight: 800; } .gc-plan-pick__radio { display: grid; width: 22px; height: 22px; place-items: center; border: 1.5px solid #d3d7dc; border-radius: 50%; color: transparent; } .gc-plan-pick__radio :is(i[data-lucide], svg.lucide) { width: 12px; height: 12px; } .gc-plan-pick__price { display: block; margin: 13px 0 8px; color: #1f1f1f; font-size: 23px; font-weight: 850; letter-spacing: -.025em; } .gc-plan-pick__desc { display: block; color: #747a84; font-size: 12px; line-height: 1.45; } .gc-plan-pick__feature { display: flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 14px; color: #444a54; font-size: 11.5px; font-weight: 700; } .gc-plan-pick__feature :is(i[data-lucide], svg.lucide) { width: 14px; height: 14px; color: #1c9c60; } .gc-plan-pick__unavailable { display: block; margin-top: 8px; color: #a55d19; font-size: 10.5px; font-weight: 700; } .gc-plan-pick:has(input:checked) .gc-plan-pick__body { border-color: var(--gc-primary, #ff7438); background: #fff9f6; box-shadow: 0 10px 28px rgba(255,116,56,.09); } .gc-plan-pick:has(input:checked) .gc-plan-pick__radio { border-color: var(--gc-primary, #ff7438); background: var(--gc-primary, #ff7438); color: #fff; } .gc-plan-pick:has(input:disabled) { opacity: .58; cursor: not-allowed; } .gc-wizard__final-note { background: #eff8f3; color: #2f684a; } /* Acciones */ .gc-wizard__nav { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 30px; padding-top: 22px; border-top: 1px solid #eceef1; } .gc-wizard__nav .gc-button { min-height: 46px; gap: 8px; border-radius: 10px; } .gc-wizard__nav .gc-button :is(i[data-lucide], svg.lucide) { width: 17px; height: 17px; } .gc-wizard__submit { min-width: 222px; } .gc-wizard__submit.is-loading { opacity: .72; cursor: wait; } .gc-wizard__login { margin: 0; color: #777d87; font-size: 13px; text-align: center; } .gc-wizard__login a { color: #d95620; font-weight: 750; text-decoration: none; } .gc-wizard .screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; } @media (max-width: 980px) { .gc-wizard__layout { grid-template-columns: 1fr; } .gc-wizard__aside { position: static; display: none; } .gc-wizard__mobile-progress { display: block; margin-bottom: 13px; padding: 15px 17px; border: 1px solid #e5e7eb; border-radius: 14px; background: #fff; } .gc-wizard__mobile-progress > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; } .gc-wizard__mobile-progress strong { color: #30353d; font-size: 13px; } .gc-wizard__mobile-progress span { color: #858b95; font-size: 11px; } .gc-wizard__progress-track { height: 5px; overflow: hidden; border-radius: 999px; background: #eceef1; } .gc-wizard__progress-track > span { display: block; width: 20%; height: 100%; border-radius: inherit; background: var(--gc-primary, #ff7438); transition: width .2s ease; } .gc-type-list { grid-template-columns: 1fr; } .gc-type-card { min-height: 0; } .gc-type-card ul { margin-top: 0; } } @media (max-width: 720px) { .gc-publish-page { padding: 16px 12px 40px; } .gc-wizard { gap: 15px; } .gc-wizard__crumb { margin-left: 4px; } .gc-wizard__hero { min-height: 0; padding: 28px 23px; border-radius: 18px; } .gc-wizard__hero-mark { display: none; } .gc-wizard__intro h1 { font-size: 33px; } .gc-wizard__sub { font-size: 14px; } .gc-wizard__trust { display: grid; gap: 8px; } .gc-wizard__card { min-height: 0; padding: 24px 18px; border-radius: 16px; } .gc-form-section { padding: 17px 14px; } .gc-plan-grid { grid-template-columns: 1fr; } .gc-specialty-toolbar { align-items: stretch; flex-direction: column; } .gc-specialty-counter { width: fit-content; } .gc-wizard__nav { align-items: stretch; flex-direction: column-reverse; } .gc-wizard__nav > span:empty { display: none; } .gc-wizard__nav .gc-button { width: 100%; justify-content: center; } .gc-wizard__nav .gc-btn-ghost { border-color: transparent; } } .gc-plan-card__price { font-size: 22px; font-weight: 800; color: var(--gc-dark, #1f1f1f); margin: 0; letter-spacing: -.01em; } .gc-company__gc2-meta { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; } .gc-company__gc2-meta .gc-badge { width: fit-content; } /* CTA "Publicar perfil" para el header */ .gc-publish-cta { display: inline-flex; align-items: center; gap: 10px; } /* Panel de perfil (maestro/proveedor) */ .gc-header-actions { display: flex; gap: 10px; flex-wrap: wrap; } .gc-catalog-soon .gc-empty--inline { padding: 18px; } /* ========================================================================== Dashboards internos (SPEC-dashboards) ========================================================================== */ .gcd { --gcd-brand: var(--gc-primary, #ff7438); --gcd-dark: #1f1f1f; --gcd-border: #e7e8ec; --gcd-muted: #9aa0a8; --gcd-soft: #f6f7f9; display: flex; min-height: 100vh; background: #fafbfc; font-family: inherit; } .gcd *, .gcd *::before, .gcd *::after { box-sizing: border-box; } /* Sidebar */ .gcd-sidebar { width: 270px; flex: none; background: #fff; border-right: 1px solid var(--gcd-border); padding: 20px 12px 16px; display: flex; flex-direction: column; gap: 14px; position: sticky; top: 0; align-self: flex-start; height: 100vh; height: 100dvh; min-height: 0; overflow: hidden; z-index: 30; } .gcd-sidebar__brand { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 0 6px; flex: none; } .gcd-sidebar__logo { width: 32px; height: 32px; border-radius: 8px; background: var(--gcd-brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; } .gcd-sidebar__brand-name { min-width: 0; font-weight: 400; color: var(--gcd-dark); font-size: 15px; } .gcd-sidebar__brand-name strong { font-weight: 800; } .gcd-sidebar__close { display: none; align-items: center; justify-content: center; width: 38px; height: 38px; margin-left: auto; padding: 0; border: 1px solid var(--gcd-border); border-radius: 10px; background: #fff; color: var(--gcd-dark); cursor: pointer; } .gcd-sidebar__close :is(i, svg) { width: 19px; height: 19px; } .gcd-sidebar__user { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 10px; background: var(--gcd-soft); border-radius: 10px; flex: none; } .gcd-sidebar__user-info { min-width: 0; } .gcd-sidebar__avatar { width: 36px; height: 36px; border-radius: 999px; object-fit: cover; flex: none; } .gcd-sidebar__name { display: block; max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; color: var(--gcd-dark); } .gcd-sidebar__role { display: block; font-size: 12px; color: var(--gcd-muted); } .gcd-sidebar__nav-area { position: relative; display: flex; min-height: 0; flex: 1 1 auto; overflow: hidden; } .gcd-sidebar__nav-area::before, .gcd-sidebar__nav-area::after { content: ""; position: absolute; right: 4px; left: 0; z-index: 2; height: 22px; pointer-events: none; opacity: 0; transition: opacity .16s ease; } .gcd-sidebar__nav-area::before { top: 0; background: linear-gradient(#fff, rgba(255,255,255,0)); } .gcd-sidebar__nav-area::after { bottom: 0; background: linear-gradient(rgba(255,255,255,0), #fff); } .gcd-sidebar__nav-area.has-scroll-top::before, .gcd-sidebar__nav-area.has-scroll-bottom::after { opacity: 1; } .gcd-sidebar__nav { display: flex; flex-direction: column; gap: 4px; width: 100%; min-height: 0; padding: 2px 7px 12px 2px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: #c7cbd1 transparent; -webkit-overflow-scrolling: touch; } .gcd-sidebar__nav::-webkit-scrollbar { width: 7px; } .gcd-sidebar__nav::-webkit-scrollbar-track { background: transparent; } .gcd-sidebar__nav::-webkit-scrollbar-thumb { background: #c7cbd1; border: 2px solid #fff; border-radius: 999px; } .gcd-sidebar__nav::-webkit-scrollbar-thumb:hover { background: var(--gcd-brand); } .gcd-sidebar__nav:focus-visible { outline: 2px solid rgba(255,116,56,.42); outline-offset: -2px; border-radius: 9px; } .gcd-sidebar__group { font-size: 10.5px; text-transform: uppercase; letter-spacing: .07em; color: var(--gcd-muted); font-weight: 700; margin: 12px 10px 4px; } .gcd-sidebar__link { display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 9px 10px; border-radius: 8px; text-decoration: none; color: #3a3f47; font-size: 14px; flex: none; } .gcd-sidebar__link:hover { background: var(--gcd-soft); } .gcd-sidebar__link.is-active { background: rgba(255,116,56,.1); color: var(--gcd-brand); font-weight: 600; } .gcd-sidebar__link.is-locked { color: var(--gcd-muted); } .gcd-sidebar__link:focus-visible, .gcd-sidebar__close:focus-visible, .gcd-sidebar__scroll-cue:focus-visible { outline: 3px solid rgba(255,116,56,.3); outline-offset: 2px; } .gcd-sidebar__link :is(i[data-lucide], svg.lucide) { width: 18px; height: 18px; flex: none; } .gcd-sidebar__link span { flex: 1 1 auto; } .gcd-sidebar__lock { opacity: .7; } .gcd-sidebar__scroll-cue { display: none; position: absolute; right: 14px; bottom: 8px; z-index: 4; align-items: center; gap: 4px; min-height: 32px; padding: 6px 10px; border: 1px solid #ffd4c2; border-radius: 999px; background: #fff; box-shadow: 0 5px 18px rgba(31,31,31,.12); color: var(--gcd-brand); font: inherit; font-size: 11.5px; font-weight: 700; cursor: pointer; } .gcd-sidebar__nav-area.has-scroll-bottom .gcd-sidebar__scroll-cue { display: inline-flex; } .gcd-sidebar__scroll-cue :is(i, svg) { width: 15px; height: 15px; } .gcd-sidebar__plan { border-top: 1px solid var(--gcd-border); padding: 14px 3px 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex: none; } .gcd-sidebar__plan-badge { font-size: 12px; font-weight: 700; padding: 5px 10px; border-radius: 999px; } .gcd-plan--basico { background: var(--gcd-soft); color: #4b5057; } .gcd-plan--destacado { background: #fff1ea; color: #d2570f; } .gcd-plan--premium { background: var(--gcd-dark); color: #fff; } .gcd-sidebar__upgrade { font-size: 13px; color: var(--gcd-brand); text-decoration: none; font-weight: 600; } .gcd-sidebar__backdrop { display: none; } /* Main */ .gcd-main { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; } .gcd-topbar { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 14px; padding: 18px 26px; border-bottom: 1px solid var(--gcd-border); background: rgba(255,255,255,.97); backdrop-filter: blur(8px); } .gcd-topbar__toggle { display: none; background: transparent; border: 0; padding: 6px; color: var(--gcd-dark); cursor: pointer; } .gcd-topbar__title { flex: 1 1 auto; } .gcd-topbar__title h1 { margin: 0; font-size: 20px; color: var(--gcd-dark); } .gcd-topbar__title p { margin: 2px 0 0; font-size: 13.5px; color: var(--gcd-muted); } .gcd-topbar__actions { display: flex; gap: 8px; } .gcd-topbar__action { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 10px; color: #3a3f47; text-decoration: none; border: 1px solid var(--gcd-border); } .gcd-topbar__action:hover { background: var(--gcd-soft); color: var(--gcd-brand); } .gcd-body { padding: 26px; display: flex; flex-direction: column; gap: 22px; } /* KPIs */ .gcd-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; } .gcd-kpi { background: #fff; border: 1px solid var(--gcd-border); border-radius: 14px; padding: 16px; display: flex; align-items: center; gap: 12px; } .gcd-kpi__ic { width: 42px; height: 42px; border-radius: 10px; background: var(--gcd-soft); color: var(--gcd-brand); display: inline-flex; align-items: center; justify-content: center; flex: none; } .gcd-kpi__ic :is(i[data-lucide], svg.lucide) { width: 22px; height: 22px; } .gcd-kpi__body { display: flex; flex-direction: column; min-width: 0; } .gcd-kpi__label { font-size: 12.5px; color: var(--gcd-muted); } .gcd-kpi__value { font-size: 22px; font-weight: 800; color: var(--gcd-dark); letter-spacing: -.01em; } .gcd-kpi__value--locked { color: var(--gcd-muted); } .gcd-kpi__value--locked :is(i[data-lucide], svg.lucide) { width: 20px; height: 20px; } .gcd-kpi__sub { font-size: 11.5px; color: var(--gcd-muted); } .gcd-kpi.is-locked { background: repeating-linear-gradient(45deg, var(--gcd-soft), var(--gcd-soft) 10px, #fff 10px, #fff 20px); } /* Paneles */ .gcd-panels { display: grid; grid-template-columns: 1fr; gap: 16px; } .gcd-panel { background: #fff; border: 1px solid var(--gcd-border); border-radius: 14px; padding: 20px; } .gcd-panel__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; } .gcd-panel__head h2 { margin: 0; font-size: 16px; color: var(--gcd-dark); } .gcd-panel__head a { font-size: 13.5px; color: var(--gcd-brand); text-decoration: none; font-weight: 600; } /* Locked panel */ .gcd-locked { background: linear-gradient(135deg, #fff5f0 0%, #fff 60%); border: 1px dashed var(--gcd-brand); border-radius: 14px; padding: 24px; text-align: center; } .gcd-locked__ic { width: 46px; height: 46px; border-radius: 999px; background: var(--gcd-brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 10px; } .gcd-locked__title { margin: 0 0 4px; font-size: 17px; color: var(--gcd-dark); } .gcd-locked__desc { margin: 0 0 6px; font-size: 14px; color: #4b5057; } .gcd-locked__meta { margin: 0 0 12px; font-size: 13px; color: var(--gcd-muted); } .gcd-locked__cta { display: inline-block; background: var(--gcd-brand); color: #fff; padding: 10px 20px; border-radius: 10px; text-decoration: none; font-weight: 600; } .gcd-locked__cta:hover { background: #e85f24; } /* Leads (contactos / cotizaciones) */ .gcd-leads { display: flex; flex-direction: column; gap: 6px; } .gcd-lead { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 10px; } .gcd-lead:hover { background: var(--gcd-soft); } .gcd-lead__avatar { width: 36px; height: 36px; border-radius: 999px; background: var(--gcd-brand); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; flex: none; } .gcd-lead__body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; } .gcd-lead__name { font-size: 14px; color: var(--gcd-dark); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .gcd-lead__asunto { font-size: 12.5px; color: var(--gcd-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .gcd-lead__meta { display: flex; align-items: center; gap: 8px; flex: none; } .gcd-lead__fecha { font-size: 12px; color: var(--gcd-muted); } .gcd-lead__open { color: var(--gcd-muted); } .gcd-lead__open:hover { color: var(--gcd-brand); } /* Stage badges */ .gcd-stage { font-size: 11px; font-weight: 700; padding: 3px 9px; border-radius: 999px; } .gcd-stage--nuevo { background: #eaf4ff; color: #1d6fd6; } .gcd-stage--cotizado { background: #fff8e0; color: #a37500; } .gcd-stage--negociando { background: #fff1ea; color: #d2570f; } .gcd-stage--ganado { background: #ecf8f0; color: #1a9255; } .gcd-stage--perdido { background: #f4f4f4; color: #6b7280; } /* Kanban */ .gcd-kanban { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; } .gcd-kanban__col { background: var(--gcd-soft); border-radius: 10px; padding: 10px; min-height: 120px; } .gcd-kanban__title { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--gcd-muted); font-weight: 700; margin: 0 0 8px; display: flex; justify-content: space-between; } .gcd-kanban__title span { color: var(--gcd-brand); } .gcd-kanban__card { background: #fff; border-radius: 8px; padding: 8px 10px; font-size: 13px; margin-bottom: 6px; border: 1px solid var(--gcd-border); } .gcd-empty-inline { padding: 20px; text-align: center; color: var(--gcd-muted); } .gcd-empty-inline :is(i[data-lucide], svg.lucide) { width: 28px; height: 28px; margin-bottom: 6px; } .gcd-hint { color: var(--gcd-muted); font-size: 13.5px; } .gcd-empty { padding: 40px 20px; text-align: center; } .gcd-cta { display: inline-block; background: var(--gcd-brand); color: #fff; padding: 10px 20px; border-radius: 10px; text-decoration: none; font-weight: 600; margin-top: 10px; } /* Responsive */ @media (max-width: 1024px) { .gcd-sidebar { position: fixed; top: 0; left: 0; width: min(88vw, 310px); height: 100vh; height: 100dvh; z-index: 50; transform: translateX(-104%); visibility: hidden; transition: transform .22s ease, visibility 0s linear .22s; box-shadow: none; } .gcd-sidebar.is-open { transform: translateX(0); visibility: visible; transition-delay: 0s; box-shadow: 12px 0 36px rgba(0,0,0,.2); } .gcd-sidebar__close { display: inline-flex; } .gcd-sidebar__name { max-width: 205px; } .gcd-sidebar__backdrop { display: block; position: fixed; inset: 0; z-index: 45; width: 100%; height: 100%; padding: 0; border: 0; background: rgba(17,24,39,.46); opacity: 0; visibility: hidden; cursor: default; transition: opacity .22s ease, visibility 0s linear .22s; } .gcd.is-sidebar-open .gcd-sidebar__backdrop { opacity: 1; visibility: visible; transition-delay: 0s; } .gcd-topbar__toggle { display: inline-flex; } } @media (max-width: 780px) { .gcd-kpis { grid-template-columns: 1fr 1fr; } .gcd-kanban { grid-template-columns: 1fr; } .gcd-body { padding: 16px; } .gcd-topbar { padding: 14px 16px; } } @media (max-width: 520px) { .gcd-kpis { grid-template-columns: 1fr; } .gcd-sidebar { width: min(92vw, 330px); padding-top: max(16px, env(safe-area-inset-top)); padding-bottom: max(14px, env(safe-area-inset-bottom)); } } body.gcd-sidebar-lock { overflow: hidden; } @media (prefers-reduced-motion: reduce) { .gcd-sidebar, .gcd-sidebar__backdrop, .gcd-sidebar__nav-area::before, .gcd-sidebar__nav-area::after { transition: none !important; scroll-behavior: auto !important; } } /* Cotizaciones 6.9.8: cierre automático y comparación de hasta cinco ofertas. */ .gcopp-auto-close > div { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 10px 12px; border: 1px solid #e2e5e9; border-radius: 10px; background: #fff8f4; } .gcopp-auto-close svg { width: 20px; color: #ff7438; flex: 0 0 auto; } .gcopp-auto-close span { display: grid; gap: 2px; } .gcopp-auto-close strong { color: #1f1f1f; } .gcopp-auto-close small { color: #626a73; } .gcopp-comparison { margin: 0 0 24px; border: 1px solid #e1e4e8; border-radius: 14px; background: #fff; overflow: hidden; } .gcopp-comparison > header { display: flex; align-items: end; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid #eceef1; background: #fafafa; } .gcopp-comparison > header span { color: #d95519; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; } .gcopp-comparison > header h4 { margin: 3px 0 0; color: #1f1f1f; font-size: 18px; } .gcopp-comparison > header small { color: #68717b; } .gcopp-comparison__scroll { max-width: 100%; overflow-x: auto; scrollbar-width: thin; scrollbar-color: #ff7438 #f1f2f4; } .gcopp-comparison__scroll:focus-visible { outline: 3px solid rgba(255,116,56,.25); outline-offset: -3px; } .gcopp-comparison table { width: 100%; min-width: 760px; border-collapse: collapse; table-layout: fixed; } .gcopp-comparison th, .gcopp-comparison td { padding: 13px 15px; border-right: 1px solid #eceef1; border-bottom: 1px solid #eceef1; text-align: left; vertical-align: top; } .gcopp-comparison th:first-child { width: 145px; color: #4e5660; background: #fafafa; font-size: 12px; } .gcopp-comparison thead th { color: #1f1f1f; background: #fff3ed; font-size: 13px; } .gcopp-comparison tbody td { color: #333a43; font-size: 13px; } .gcopp-comparison tr.is-total td { color: #1f1f1f; font-size: 15px; font-weight: 800; } .gcopp-comparison .gcopp-verified { display: flex; width: fit-content; margin-top: 5px; } .gcopp-comparison .gcopp-verified svg { width: 13px; height: 13px; } .gcopp-comparison form { margin: 0; } .gcopp-comparison__selected { display: inline-flex; align-items: center; gap: 5px; color: #087a3c; } .gcopp-comparison__selected svg { width: 16px; height: 16px; } @media (max-width: 700px) { .gcopp-comparison > header { align-items: flex-start; flex-direction: column; gap: 5px; padding: 15px; } .gcopp-comparison table { min-width: 700px; } .gcopp-comparison th, .gcopp-comparison td { padding: 11px 12px; } } /* Contención: ocultar layout viejo de Fase 1 si se cuela dentro del nuevo dashboard */ .gcd .gc-app { display: contents !important; } .gcd .gc-sidebar { display: none !important; } .gcd .gc-main { padding: 0 !important; } .gcd .gc-main__header { padding: 0 0 16px !important; } /* Galería de fotos */ .gcd-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin-top: 16px; } .gcd-gallery__item { position: relative; border-radius: 12px; overflow: hidden; border: 1px solid var(--gcd-border, #e7e8ec); } .gcd-gallery__item img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; } .gcd-gallery__title { display: block; padding: 8px 10px; font-size: 13px; color: #3a3f47; } .gcd-gallery__del { position: absolute; top: 6px; right: 6px; } .gcd-gallery__del button { background: rgba(0,0,0,.55); color: #fff; border: 0; border-radius: 8px; padding: 4px 6px; cursor: pointer; } /* Tabla */ .gcd-table { width: 100%; border-collapse: collapse; font-size: 14px; } .gcd-table th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: #9aa0a8; padding: 8px 10px; border-bottom: 1px solid #e7e8ec; } .gcd-table td { padding: 10px; border-bottom: 1px solid #f0f1f3; color: #1f1f1f; } .gcd-table__actions { white-space: nowrap; display: flex; gap: 4px; } /* Plantillas */ .gcd-plantillas { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; } .gcd-plantilla { padding: 14px; } .gcd-plantilla__head { display: flex; align-items: center; justify-content: space-between; } .gcd-plantilla__head h4 { margin: 0; font-size: 15px; } .gcd-plantilla__actions { display: flex; gap: 4px; } .gcd-plantilla__body { margin: 8px 0 0; font-size: 13.5px; color: #4b5057; line-height: 1.5; } /* Wrap de vistas reutilizadas dentro del dashboard */ .gcd-vista-wrap { display: flex; flex-direction: column; gap: 16px; } .gcd-vista-wrap .gc-main__header { margin: 0; padding: 0 0 8px; } .gcd-vista-wrap .gc-card { margin: 0; } .gcd-vista-wrap .gc-membership-card { margin-bottom: 14px; } .gcd-vista-wrap .gc-form { margin: 0; } .gcd-vista-wrap .gc-stats { margin: 0; } /* Membresía: spacing entre planes */ .gcd-vista-wrap .gc-plan-card { margin-bottom: 10px; } .gcd-vista-wrap .gc-plan-grid, .gcd-vista-wrap .gc-membership-card__plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; } /* Membresías WooCommerce */ .gcd-vista-wrap .gc-membership-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; margin-bottom: 24px; } .gcd-vista-wrap .gc-plan-card { align-items: stretch; min-width: 0; } .gcd-vista-wrap .gc-plan-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; } .gcd-vista-wrap .gc-plan-card__head h3 { margin: 0; } .gcd-vista-wrap .gc-plan-card .gc-button { margin-top: auto; width: 100%; } .gcd-vista-wrap .gc-plan-card__state { display: inline-flex; align-items: center; gap: 7px; min-height: 42px; color: var(--gc-text-soft, #6b7280); font-size: 13px; font-weight: 700; } .gcd-vista-wrap .gc-plan-card__state :is(i[data-lucide], svg.lucide) { width: 17px; height: 17px; color: var(--gc-success, #168354); } .gcd-vista-wrap .gc-membership-card__notice { display: flex; align-items: flex-start; gap: 8px; padding: 11px 13px; margin: 0 0 16px; border: 1px solid #f2c48d; background: #fff8ed; color: #87520e; font-size: 13px; border-radius: 8px; } .gcd-vista-wrap .gc-membership-card__notice :is(i[data-lucide], svg.lucide) { flex: 0 0 auto; width: 18px; height: 18px; } .gcd-vista-wrap .gc-membership-billing { margin-top: 24px; } .gcd-vista-wrap .gc-membership-billing .gc-section__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; } .gcd-vista-wrap .gc-membership-billing .gc-section__head h2, .gcd-vista-wrap .gc-membership-billing .gc-section__head p { margin: 0; } .gcd-vista-wrap .gc-membership-billing .gc-section__head p { margin-top: 4px; color: var(--gc-text-soft, #6b7280); } .gcd-vista-wrap .gc-membership-orders a { color: var(--gc-primary-dark, #e85f24); font-weight: 700; } @media (max-width: 640px) { .gcd-vista-wrap .gc-membership-plans { grid-template-columns: 1fr; } .gcd-vista-wrap .gc-membership-billing .gc-section__head { flex-direction: column; } } /* Mini galería en resumen */ .gcd-gallery--mini { grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 8px; } .gcd-gallery--mini .gcd-gallery__item { border-radius: 8px; } .gcd-gallery--mini .gcd-gallery__item img { aspect-ratio: 1; } @media (max-width: 520px) { .gcd-gallery--mini { grid-template-columns: repeat(2, 1fr); } } /* Mini plantilla en resumen */ .gcd-plantilla-mini { padding: 10px 0; border-bottom: 1px solid var(--gcd-border, #e7e8ec); } .gcd-plantilla-mini:last-child { border-bottom: 0; } .gcd-plantilla-mini strong { font-size: 14px; color: var(--gcd-dark, #1f1f1f); } .gcd-plantilla-mini p { margin: 2px 0 0; font-size: 13px; color: #6b7280; } /* Kanban full (vista standalone CRM) */ .gc-crm-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; } .gc-crm-header__help { display: inline-flex; align-items: center; gap: 7px; margin: 0 0 3px; color: #6b7280; font-size: 13px; } .gc-crm-header__help :is(i[data-lucide], svg.lucide) { width: 17px; height: 17px; color: var(--gcd-brand, #ff7438); } .gcd-kanban--full { min-height: 400px; align-items: stretch; overflow-x: auto; padding: 2px 2px 12px; scroll-snap-type: x proximity; } .gcd-kanban--full .gcd-kanban__col { min-width: 210px; min-height: 340px; transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease; scroll-snap-align: start; border: 1px solid transparent; } .gcd-kanban--full .gcd-kanban__col.is-drag-over { background: #fff4ee; border-color: var(--gcd-brand, #ff7438); box-shadow: inset 0 0 0 1px rgba(255,116,56,.15); } .gcd-kanban__cards { min-height: 270px; } .gcd-kanban__card strong { display: block; font-size: 13.5px; color: var(--gcd-dark, #1f1f1f); } .gcd-kanban__card small { display: block; font-size: 12px; color: #9aa0a8; margin-top: 3px; } .gcd-kanban--full .gcd-kanban__card { position: relative; padding: 10px; transition: opacity .18s ease, transform .18s ease, box-shadow .18s ease; } .gcd-kanban--full .gcd-kanban__card:hover { border-color: #d8dbe0; box-shadow: 0 6px 18px rgba(31,31,31,.07); } .gcd-kanban__card-main { display: flex; align-items: flex-start; gap: 7px; } .gcd-kanban__card-main > a { min-width: 0; flex: 1; color: inherit; text-decoration: none; } .gcd-kanban__drag { width: 24px; height: 28px; flex: none; display: inline-flex; align-items: center; justify-content: center; margin: -3px 0 0 -4px; color: #a1a7af; border-radius: 6px; cursor: grab; touch-action: none; } .gcd-kanban__drag:hover, .gcd-kanban__drag:focus-visible { color: var(--gcd-brand, #ff7438); background: #fff1ea; outline: none; } .gcd-kanban__drag:active { cursor: grabbing; } .gcd-kanban__drag :is(i[data-lucide], svg.lucide) { width: 17px; height: 17px; pointer-events: none; } .gcd-kanban__card.is-dragging { opacity: .42; transform: rotate(1deg) scale(.98); } .gcd-kanban__card.is-saving { opacity: .6; pointer-events: none; } .gcd-kanban__card.is-saving::after { content: ""; position: absolute; top: 9px; right: 9px; width: 13px; height: 13px; border: 2px solid #ffd8c7; border-top-color: var(--gcd-brand, #ff7438); border-radius: 50%; animation: gcd-crm-spin .65s linear infinite; } .gcd-kanban__empty { margin: 8px 0 0; padding: 22px 8px; color: #a1a7af; border: 1px dashed #d7dade; border-radius: 8px; text-align: center; font-size: 12px; } .gcd-kanban__empty[hidden] { display: none; } .gcd-kanban__mobile-stage { display: none; margin-top: 10px; } .gcd-kanban__mobile-stage > span { font-size: 11px; font-weight: 700; color: #6b7280; } .gcd-kanban__mobile-stage select { width: 100%; min-height: 38px; margin-top: 4px; padding: 7px 32px 7px 9px; border: 1px solid #d9dce1; border-radius: 8px; background-color: #fff; font-size: 13px; } .gc-crm-live { position: fixed; right: 24px; bottom: 24px; z-index: 80; max-width: min(360px, calc(100vw - 32px)); padding: 11px 15px; color: #fff; background: #1f1f1f; border-radius: 10px; box-shadow: 0 12px 32px rgba(0,0,0,.2); opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; font-size: 13.5px; } .gc-crm-live.is-visible { opacity: 1; transform: translateY(0); } .gc-crm-live.is-error { background: #a52a2a; } @keyframes gcd-crm-spin { to { transform: rotate(360deg); } } @media (max-width: 780px), (hover: none) { .gc-crm-header { align-items: flex-start; flex-direction: column; gap: 8px; } .gc-crm-header__help { display: none; } .gcd-kanban--full { grid-template-columns: repeat(5, minmax(82vw, 1fr)); margin-inline: -2px; } .gcd-kanban--full .gcd-kanban__col { min-width: 0; } .gcd-kanban__drag { display: none; } .gcd-kanban__mobile-stage { display: block; } } /* Alertas: transición de salida y botón cerrar */ .gc-alert { position: relative; display: flex; align-items: center; gap: 10px; padding: 12px 40px 12px 14px; transition: opacity .25s, transform .25s; } .gc-alert.is-closing { opacity: 0; transform: translateY(-6px); pointer-events: none; } .gc-alert__close { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); background: transparent; border: 0; padding: 6px; cursor: pointer; color: inherit; opacity: .6; border-radius: 6px; } .gc-alert__close:hover { opacity: 1; background: rgba(0,0,0,.05); } .gc-alert__close :is(i[data-lucide], svg.lucide) { width: 16px; height: 16px; } /* Empleos: header y gauge */ .gcd-empleos-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; } .gcd-empleos-header h2 { margin: 0 0 4px; font-size: 20px; color: var(--gcd-dark, #1f1f1f); } .gcd-empleos-header p { margin: 0; color: var(--gcd-muted, #9aa0a8); font-size: 13.5px; } .gcd-empleos-header__gauge { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; min-width: 140px; } .gcd-gauge { width: 140px; height: 6px; background: #f0f1f3; border-radius: 999px; overflow: hidden; } .gcd-gauge__fill { height: 100%; background: var(--gcd-brand, #ff7438); transition: width .3s; } .gcd-empleos-kpi { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; } .gcd-empleos-kpi > div:first-child { display: flex; flex-direction: column; } .gcd-empleos-kpi > div:first-child strong { font-size: 20px; color: var(--gcd-dark, #1f1f1f); font-weight: 800; } .gcd-empleos-kpi > div:first-child span { font-size: 12px; color: var(--gcd-muted, #9aa0a8); } .gcd-empleos-kpi .gcd-gauge { flex: 1 1 100px; min-width: 100px; } /* Canvas de visitas: contener altura para que Chart.js no lo estire */ .gc-visitas-chart, canvas.gc-visitas-chart { width: 100% !important; max-width: 100% !important; height: 180px !important; max-height: 180px !important; display: block; } .gcd-panel .gc-visitas-chart { height: 160px !important; max-height: 160px !important; } /* Modal de edición rápida */ /* ========================================================================== Portafolio profesional · Mis obras ========================================================================== */ .gcd-portfolio { display: flex; flex-direction: column; gap: 20px; } .gcd-portfolio__hero { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding: 4px 0 2px; } .gcd-portfolio__hero > div { max-width: 760px; } .gcd-eyebrow { display: block; margin-bottom: 7px; color: var(--gcd-brand, #ff7438); font-size: 11px; font-weight: 800; letter-spacing: .11em; } .gcd-portfolio__hero h1 { margin: 0; color: var(--gcd-dark, #1f1f1f); font-size: clamp(26px, 3vw, 34px); line-height: 1.12; letter-spacing: -.025em; } .gcd-portfolio__hero p { max-width: 700px; margin: 9px 0 0; color: #626972; font-size: 14.5px; line-height: 1.6; } .gcd-portfolio__new { flex: none; margin-top: 18px; } .gcd-portfolio__stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; } .gcd-portfolio-stat { display: flex; align-items: center; gap: 12px; min-height: 78px; padding: 15px 17px; background: #fff; border: 1px solid var(--gcd-border, #e7e8ec); border-radius: 13px; } .gcd-portfolio-stat__icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; flex: none; color: var(--gcd-brand, #ff7438); background: #fff3ed; border-radius: 11px; } .gcd-portfolio-stat__icon svg { width: 21px; height: 21px; } .gcd-portfolio-stat > div { display: flex; flex-direction: column; } .gcd-portfolio-stat strong { color: var(--gcd-dark, #1f1f1f); font-size: 20px; line-height: 1.1; } .gcd-portfolio-stat span:last-child { margin-top: 3px; color: var(--gcd-muted, #727984); font-size: 12.5px; } .gcd-work-editor { overflow: hidden; background: #fff; border: 1px solid var(--gcd-border, #e7e8ec); border-radius: 15px; box-shadow: 0 8px 28px rgba(31, 31, 31, .045); } .gcd-work-editor > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 20px; color: var(--gcd-dark, #1f1f1f); cursor: pointer; list-style: none; transition: background-color .2s ease; } .gcd-work-editor > summary::-webkit-details-marker { display: none; } .gcd-work-editor > summary:hover { background: #fafafa; } .gcd-work-editor > summary:focus-visible { outline: 3px solid rgba(255, 116, 56, .28); outline-offset: -3px; } .gcd-work-editor > summary > span { display: inline-flex; align-items: center; gap: 9px; } .gcd-work-editor > summary svg { width: 19px; height: 19px; color: var(--gcd-brand, #ff7438); } .gcd-work-editor > summary strong { font-size: 15px; } .gcd-work-editor > summary small { color: var(--gcd-muted, #727984); font-size: 12.5px; } .gcd-work-editor[open] > summary { border-bottom: 1px solid var(--gcd-border, #e7e8ec); } .gcd-work-form { margin: 0; } .gcd-work-steps { display: grid; grid-template-columns: repeat(3, 1fr); padding: 0 28px; background: #fbfbfc; border-bottom: 1px solid var(--gcd-border, #e7e8ec); } .gcd-work-step { position: relative; display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 72px; padding: 10px; color: #858b93; background: transparent; border: 0; border-bottom: 3px solid transparent; cursor: pointer; font: inherit; } .gcd-work-step::after { position: absolute; top: 50%; right: -8px; width: 16px; height: 1px; background: #dfe1e5; content: ""; } .gcd-work-step:last-child::after { display: none; } .gcd-work-step > span { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; flex: none; color: #717780; background: #fff; border: 1px solid #d8dbe0; border-radius: 999px; font-size: 12px; font-weight: 800; } .gcd-work-step strong { font-size: 13px; } .gcd-work-step.is-active { color: var(--gcd-dark, #1f1f1f); border-bottom-color: var(--gcd-brand, #ff7438); } .gcd-work-step.is-active > span { color: #fff; background: var(--gcd-brand, #ff7438); border-color: var(--gcd-brand, #ff7438); } .gcd-work-step.is-complete > span { color: #16834a; background: #eaf7f0; border-color: #b9e2ca; } .gcd-work-step:focus-visible { outline: 3px solid rgba(255, 116, 56, .25); outline-offset: -4px; } .gcd-work-pane { max-width: 860px; min-height: 390px; margin: 0 auto; padding: 30px 32px; } .gcd-work-pane[hidden] { display: none !important; } .gcd-work-pane__head { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 24px; } .gcd-work-pane__icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; flex: none; color: var(--gcd-brand, #ff7438); background: #fff3ed; border-radius: 11px; } .gcd-work-pane__icon svg { width: 21px; height: 21px; } .gcd-work-pane__head h2 { margin: 1px 0 3px; color: var(--gcd-dark, #1f1f1f); font-size: 19px; line-height: 1.25; } .gcd-work-pane__head p { margin: 0; color: #747b84; font-size: 13.5px; line-height: 1.5; } .gcd-work-form .gc-field { margin-bottom: 18px; } .gcd-work-form .gc-field label { display: block; margin-bottom: 7px; color: #30343a; font-size: 13px; font-weight: 700; } .gcd-work-form .gc-field label span { color: #cf3c32; } .gcd-work-form .gc-field input, .gcd-work-form .gc-field select, .gcd-work-form .gc-field textarea { width: 100%; min-height: 46px; padding: 11px 13px; color: var(--gcd-dark, #1f1f1f); background: #fff; border: 1px solid #d8dbe0; border-radius: 9px; box-shadow: none; font: inherit; font-size: 14px; line-height: 1.4; } .gcd-work-form .gc-field textarea { min-height: 170px; resize: vertical; } .gcd-work-form .gc-field input:focus, .gcd-work-form .gc-field select:focus, .gcd-work-form .gc-field textarea:focus { border-color: var(--gcd-brand, #ff7438); outline: 3px solid rgba(255, 116, 56, .14); } .gcd-work-form .gc-field > small { display: block; margin-top: 5px; color: #8a9098; font-size: 11.5px; } .gcd-field-footer { display: flex; justify-content: space-between; gap: 16px; margin-top: 6px; color: #8a9098; font-size: 11.5px; } .gcd-copy-guide { display: flex; align-items: flex-start; gap: 11px; padding: 14px 15px; color: #554433; background: #fff9ee; border: 1px solid #f2dfba; border-radius: 10px; } .gcd-copy-guide > svg { width: 19px; height: 19px; flex: none; color: #b37314; } .gcd-copy-guide strong { display: block; margin-bottom: 2px; font-size: 12.5px; } .gcd-copy-guide p { margin: 0; font-size: 12px; line-height: 1.5; } .gcd-upload-zone { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 190px; padding: 25px; text-align: center; background: #fcfcfd; border: 2px dashed #cfd3d9; border-radius: 13px; cursor: pointer; transition: border-color .2s, background-color .2s, transform .2s; } .gcd-upload-zone:hover, .gcd-upload-zone.is-dragging { background: #fff7f3; border-color: var(--gcd-brand, #ff7438); } .gcd-upload-zone.is-dragging { transform: scale(.995); } .gcd-upload-zone.has-error { background: #fff7f6; border-color: #d7463e; } .gcd-upload-zone.is-disabled { cursor: not-allowed; opacity: .7; } .gcd-upload-zone input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; } .gcd-upload-zone:focus-within { outline: 3px solid rgba(255, 116, 56, .2); outline-offset: 2px; } .gcd-upload-zone__icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 10px; color: var(--gcd-brand, #ff7438); background: #fff0e8; border-radius: 999px; } .gcd-upload-zone__icon svg { width: 23px; height: 23px; } .gcd-upload-zone strong { color: #363a40; font-size: 13.5px; } .gcd-upload-zone > span:last-child { margin-top: 5px; color: #858b93; font-size: 11.5px; } .gcd-upload-preview { display: grid; grid-template-columns: repeat(auto-fill, minmax(185px, 1fr)); gap: 10px; margin-top: 13px; } .gcd-upload-preview:empty { display: none; } .gcd-upload-preview__item { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 7px; background: #fff; border: 1px solid var(--gcd-border, #e7e8ec); border-radius: 9px; } .gcd-upload-preview__item.has-error { border-color: #e09792; background: #fff8f7; } .gcd-upload-preview__item img { width: 52px; height: 52px; flex: none; object-fit: cover; border-radius: 7px; } .gcd-upload-preview__item span { min-width: 0; } .gcd-upload-preview__item strong, .gcd-upload-preview__item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .gcd-upload-preview__item strong { color: #3b3f45; font-size: 11.5px; } .gcd-upload-preview__item small { margin-top: 2px; color: #8a9098; font-size: 10.5px; } .gcd-photo-tips { display: flex; justify-content: center; flex-wrap: wrap; gap: 9px 18px; margin-top: 15px; } .gcd-photo-tips span { display: inline-flex; align-items: center; gap: 5px; color: #777e87; font-size: 11.5px; } .gcd-photo-tips svg { width: 14px; height: 14px; color: var(--gcd-brand, #ff7438); } .gcd-existing-photos { margin-bottom: 18px; } .gcd-existing-photos > p { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 8px; font-size: 12.5px; } .gcd-existing-photos > p small { color: #858b93; } .gcd-existing-photos__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 9px; } .gcd-existing-photo { position: relative; overflow: hidden; background: #f7f7f8; border: 1px solid var(--gcd-border, #e7e8ec); border-radius: 9px; } .gcd-existing-photo img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; } .gcd-existing-photo label { display: flex; align-items: center; gap: 5px; padding: 6px 8px; color: #4f555d; background: #fff; font-size: 11px; cursor: pointer; } .gcd-existing-photo label + label { border-top: 1px solid #eceef0; } .gcd-existing-photo__remove { color: #a43831 !important; } .gcd-work-form__actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 22px; background: #fbfbfc; border-top: 1px solid var(--gcd-border, #e7e8ec); } .gcd-work-form__actions > div, .gcd-work-form__actions [data-work-submit] { display: inline-flex; align-items: center; gap: 8px; } .gcd-work-form__actions [hidden] { display: none !important; } .gcd-work-form__actions button, .gcd-work-form__actions a { min-height: 40px; } .gcd-portfolio-list { padding: 20px; background: #fff; border: 1px solid var(--gcd-border, #e7e8ec); border-radius: 15px; } .gcd-portfolio-list__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 16px; } .gcd-portfolio-list__head h2 { margin: 0; color: var(--gcd-dark, #1f1f1f); font-size: 18px; } .gcd-portfolio-list__head p { margin: 4px 0 0; color: #7a818a; font-size: 12.5px; } .gcd-portfolio-list__head > span { flex: none; padding: 5px 10px; color: #60666e; background: #f3f4f5; border-radius: 999px; font-size: 11.5px; font-weight: 700; } .gcd-work-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(265px, 1fr)); gap: 15px; } .gcd-work-card-v2 { overflow: hidden; background: #fff; border: 1px solid var(--gcd-border, #e7e8ec); border-radius: 13px; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; } .gcd-work-card-v2:hover { border-color: #d2d5da; box-shadow: 0 10px 24px rgba(31, 31, 31, .07); transform: translateY(-2px); } .gcd-work-card-v2__media { position: relative; overflow: hidden; background: #f1f2f3; } .gcd-work-card-v2__media > img, .gcd-work-card-v2__media > span:not(.gcd-work-status):not(.gcd-work-card-v2__photos) { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; color: #9aa0a8; } .gcd-work-card-v2__media > span svg { width: 34px; height: 34px; } .gcd-work-status, .gcd-work-card-v2__photos { position: absolute; top: 10px; display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 7px; font-size: 10.5px; font-weight: 800; backdrop-filter: blur(6px); } .gcd-work-status { left: 10px; } .gcd-work-status--publicada { color: #126b3c; background: rgba(235, 250, 241, .92); } .gcd-work-status--borrador { color: #5e6268; background: rgba(246, 246, 247, .93); } .gcd-work-card-v2__photos { right: 10px; color: #fff; background: rgba(20, 22, 25, .68); } .gcd-work-status svg, .gcd-work-card-v2__photos svg { width: 12px; height: 12px; } .gcd-work-card-v2__body { padding: 15px; } .gcd-work-card-v2__category { display: inline-block; margin-bottom: 6px; color: var(--gcd-brand, #ff7438); font-size: 10.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; } .gcd-work-card-v2 h3 { margin: 0; color: var(--gcd-dark, #1f1f1f); font-size: 15.5px; line-height: 1.35; } .gcd-work-card-v2__meta { display: flex; flex-wrap: wrap; gap: 6px 11px; margin: 8px 0 0; color: #7d838b; font-size: 11px; } .gcd-work-card-v2__meta span { display: inline-flex; align-items: center; gap: 4px; } .gcd-work-card-v2__meta svg { width: 12px; height: 12px; } .gcd-work-card-v2__excerpt { min-height: 38px; margin: 9px 0 0; color: #656c75; font-size: 12px; line-height: 1.55; } .gcd-work-card-v2__actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 13px; padding-top: 12px; border-top: 1px solid #eff0f2; } .gcd-work-card-v2__actions form { margin: 0; } .gcd-work-card-v2__actions .gc-btn-sm { display: inline-flex; align-items: center; gap: 6px; } .gcd-work-card-v2__actions svg { width: 14px; height: 14px; } .gcd-portfolio-empty { max-width: 580px; margin: 0 auto; padding: 44px 20px; text-align: center; } .gcd-portfolio-empty > span { display: inline-flex; align-items: center; justify-content: center; width: 62px; height: 62px; margin-bottom: 12px; color: var(--gcd-brand, #ff7438); background: #fff1e9; border-radius: 999px; } .gcd-portfolio-empty > span svg { width: 28px; height: 28px; } .gcd-portfolio-empty h3 { margin: 0; color: var(--gcd-dark, #1f1f1f); font-size: 18px; } .gcd-portfolio-empty p { margin: 7px auto 16px; color: #747b84; font-size: 13px; line-height: 1.6; } @media (max-width: 760px) { .gcd-portfolio__hero { flex-direction: column; } .gcd-portfolio__new { width: 100%; margin-top: 0; } .gcd-work-steps { padding: 0 10px; } .gcd-work-step { min-height: 62px; } .gcd-work-step strong { display: none; } .gcd-work-pane { min-height: 0; padding: 24px 18px; } .gcd-work-form .gc-grid-2 { grid-template-columns: 1fr; gap: 0; } .gcd-work-form__actions { align-items: stretch; flex-direction: column-reverse; } .gcd-work-form__actions > div, .gcd-work-form__actions [data-work-submit] { width: 100%; flex-wrap: wrap; } .gcd-work-form__actions button { flex: 1 1 auto; } .gcd-work-form__actions > a { text-align: center; } .gcd-existing-photos > p { flex-direction: column; } } @media (max-width: 520px) { .gcd-portfolio__stats { grid-template-columns: 1fr; } .gcd-work-editor > summary { align-items: flex-start; flex-direction: column; } .gcd-work-form__actions [data-work-submit] { flex-direction: column-reverse; } .gcd-work-form__actions [data-work-submit] button { width: 100%; } .gcd-portfolio-list { padding: 15px; } .gcd-portfolio-list__head { flex-direction: column; gap: 9px; } .gcd-work-grid { grid-template-columns: 1fr; } } @media (prefers-reduced-motion: reduce) { .gcd-work-card-v2, .gcd-upload-zone { transition: none; } .gcd-work-card-v2:hover { transform: none; } } /* ========================================================================== * Oportunidades de cotización · v6.9 * Componentes aislados para evitar colisiones con Elementor y el tema activo. * ========================================================================== */ .gcopp { --opp-orange: var(--gcd-brand, #ff7438); --opp-ink: #1f1f1f; --opp-muted: #68707b; --opp-line: #e6e8eb; --opp-soft: #f7f8fa; width: 100%; color: var(--opp-ink); } .gcopp *, .gcopp *::before, .gcopp *::after { box-sizing: border-box; } .gcopp-hero { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-bottom: 22px; padding: 26px 28px; background: linear-gradient(135deg, #1f1f1f 0%, #2c2c2c 72%, #3b2b25 100%); border: 1px solid rgba(255,255,255,.08); border-radius: 20px; box-shadow: 0 16px 36px rgba(31,31,31,.12); } .gcopp-hero h1 { margin: 3px 0 7px; color: #fff; font-size: clamp(24px, 3vw, 34px); line-height: 1.12; } .gcopp-hero p { max-width: 720px; margin: 0; color: rgba(255,255,255,.72); font-size: 14px; line-height: 1.55; } .gcopp-kicker { color: #ffad88; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; } .gcopp-hero > .gc-button { flex: 0 0 auto; background: var(--opp-orange); border-color: var(--opp-orange); box-shadow: 0 8px 22px rgba(255,116,56,.26); } .gcopp-hero__trust, .gcopp-plan-pill { display: flex; align-items: center; gap: 12px; min-width: 225px; padding: 13px 15px; color: #fff; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); border-radius: 14px; } .gcopp-hero__trust > svg, .gcopp-plan-pill > svg { width: 23px; height: 23px; color: #ffad88; flex: 0 0 auto; } .gcopp-hero__trust span, .gcopp-plan-pill span { display: grid; gap: 2px; } .gcopp-hero__trust strong, .gcopp-plan-pill strong { font-size: 13px; } .gcopp-hero__trust small, .gcopp-plan-pill small { color: rgba(255,255,255,.66); font-size: 11px; } .gcopp-form { max-width: 980px; margin: 0 auto; padding: 28px; border: 1px solid var(--opp-line); border-radius: 20px; box-shadow: 0 14px 34px rgba(31,31,31,.07); } .gcopp-role-context { display: flex; align-items: center; gap: 11px; margin-bottom: 20px; padding: 13px 15px; color: #37404a; background: #fff5ef; border: 1px solid #ffd8c5; border-radius: 12px; } .gcopp-role-context > svg { width: 21px; height: 21px; color: #d45b24; flex: 0 0 auto; } .gcopp-role-context > span { display: grid; gap: 2px; } .gcopp-role-context strong { font-size: 13px; } .gcopp-role-context small { color: var(--opp-muted); font-size: 11px; } .gcopp-company-fields { margin: 4px -8px 0; padding: 1px 8px 17px; background: #fbfbfc; border: 1px solid #eceef0; border-radius: 14px; } .gcopp .gc-field.is-muted { opacity: .62; } .gcopp-section-title { display: flex; align-items: center; gap: 12px; margin: 28px 0 18px; padding-bottom: 13px; border-bottom: 1px solid var(--opp-line); } .gcopp-section-title:first-of-type { margin-top: 0; } .gcopp-section-title > span { display: grid; place-items: center; width: 34px; height: 34px; color: #fff; background: var(--opp-orange); border-radius: 10px; font-size: 13px; font-weight: 800; box-shadow: 0 5px 12px rgba(255,116,56,.2); } .gcopp-section-title h2 { margin: 0; color: var(--opp-ink); font-size: 17px; } .gcopp-section-title p { margin: 2px 0 0; color: var(--opp-muted); font-size: 12px; } .gcopp-consent { display: flex; align-items: flex-start; gap: 9px; margin: 22px 0; color: #515861; font-size: 13px; line-height: 1.45; } .gcopp-consent input { width: 17px; height: 17px; margin-top: 1px; accent-color: var(--opp-orange); flex: 0 0 auto; } .gcopp-form__actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding-top: 20px; border-top: 1px solid var(--opp-line); } .gcopp-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin-bottom: 18px; } .gcopp-kpis article { display: flex; align-items: center; gap: 13px; min-height: 82px; padding: 17px; background: #fff; border: 1px solid var(--opp-line); border-radius: 15px; box-shadow: 0 5px 16px rgba(31,31,31,.035); } .gcopp-kpis article > svg { width: 23px; height: 23px; padding: 9px; box-sizing: content-box; color: #dd5d25; background: #fff0e8; border-radius: 11px; } .gcopp-kpis span { display: grid; color: var(--opp-muted); font-size: 12px; } .gcopp-kpis strong { color: var(--opp-ink); font-size: 23px; line-height: 1.1; } .gcopp-filters { margin-bottom: 18px; padding: 0; background: #fff; border: 1px solid var(--opp-line); border-radius: 17px; box-shadow: 0 5px 16px rgba(31,31,31,.035); overflow: hidden; } .gcopp-filters__head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; border-bottom: 1px solid var(--opp-line); } .gcopp-filters__head > div { display: grid; gap: 2px; } .gcopp-filters__head strong { color: var(--opp-ink); font-size: 14px; } .gcopp-filters__head span { color: var(--opp-muted); font-size: 11px; } .gcopp-filters__head a { display: inline-flex; align-items: center; gap: 5px; color: #b84d1d; font-size: 11px; font-weight: 700; text-decoration: none; white-space: nowrap; } .gcopp-filters__head a svg { width: 14px; height: 14px; } .gcopp-filters__grid { display: grid; grid-template-columns: minmax(190px, 1.35fr) minmax(165px, 1fr) minmax(165px, 1fr) minmax(180px, 1fr) minmax(140px, .8fr) auto; align-items: end; gap: 10px; padding: 15px 16px 17px; background: var(--opp-soft); } .gcopp-filters__grid > div { display: grid; gap: 5px; min-width: 0; } .gcopp-filters label { color: #555d66; font-size: 11px; font-weight: 800; text-transform: uppercase; } .gcopp-filters input, .gcopp-filters select { width: 100%; min-height: 44px; margin: 0; padding: 9px 12px; background: #fff; border: 1px solid #d9dde2; border-radius: 9px; font: inherit; font-size: 13px; } .gcopp-filters select:focus { border-color: var(--opp-orange); box-shadow: 0 0 0 3px rgba(255,116,56,.12); outline: 0; } .gcopp-filters select:disabled { color: #9399a2; background: #f1f2f4; cursor: not-allowed; } .gcopp-filters .gc-button { min-height: 44px; justify-content: center; white-space: nowrap; } .gcopp-list { display: grid; gap: 14px; } .gcopp-card { overflow: hidden; margin: 0; padding: 0; border: 1px solid var(--opp-line); border-radius: 17px; box-shadow: 0 7px 20px rgba(31,31,31,.045); } .gcopp-card.is-expanded { border-color: #ffc7ad; box-shadow: 0 12px 30px rgba(255,116,56,.09); } .gcopp-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 19px 21px 13px; } .gcopp-card h2 { margin: 7px 0 3px; color: var(--opp-ink); font-size: 18px; line-height: 1.25; } .gcopp-card > header p { margin: 0; color: var(--opp-muted); font-size: 12px; } .gcopp-card__badges { display: flex; flex-wrap: wrap; gap: 6px; } .gcopp-status { display: inline-flex; align-items: center; min-height: 24px; padding: 4px 9px; border-radius: 999px; font-size: 10px; font-weight: 800; letter-spacing: .025em; } .gcopp-status.is-positive { color: #18754b; background: #e9f8f1; } .gcopp-status.is-negative { color: #9c3232; background: #fff0f0; } .gcopp-status.is-neutral { color: #5d6470; background: #eef0f3; } .gcopp-status.is-direct { color: #95501c; background: #fff2df; } .gcopp-status.is-private { color: #4059a8; background: #edf1ff; } .gcopp-status.is-match { color: #126b46; background: #e7f8ef; } .gcopp-status.is-category { color: #88510f; background: #fff4d8; } .gcopp-status.is-zone { color: #295f91; background: #eaf4ff; } .gcopp-status.is-public { color: #5d6470; background: #eef0f3; } .gcopp-status > svg { width: 12px; height: 12px; margin-right: 4px; } .gcopp-card__metric { display: grid; min-width: 74px; padding: 9px 12px; text-align: center; background: var(--opp-soft); border-radius: 11px; } .gcopp-card__metric strong { color: var(--opp-ink); font-size: 20px; } .gcopp-card__metric span { color: var(--opp-muted); font-size: 10px; } .gcopp-summary { display: flex; flex-wrap: wrap; gap: 7px 14px; padding: 0 21px 17px; } .gcopp-summary span { display: inline-flex; align-items: center; gap: 5px; color: #5f6670; font-size: 12px; } .gcopp-summary svg { width: 14px; height: 14px; color: #e26731; } .gcopp-card > footer { padding: 12px 21px; background: #fafafa; border-top: 1px solid #eceef0; } .gcopp-detail { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr); gap: 18px; padding: 20px 21px; background: #fbfbfc; border-top: 1px solid var(--opp-line); } .gcopp-detail--provider { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); } .gcopp-detail h3 { margin: 0 0 12px; color: var(--opp-ink); font-size: 15px; } .gcopp-detail__request { min-width: 0; padding: 17px; background: #fff; border: 1px solid var(--opp-line); border-radius: 13px; } .gcopp-detail__request > p { color: #525a64; font-size: 13px; line-height: 1.6; } .gcopp-files { display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0; } .gcopp-files a { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 7px 9px; color: #b74b19; background: #fff3ed; border-radius: 8px; font-size: 11px; font-weight: 700; text-decoration: none; } .gcopp-files svg { width: 14px; height: 14px; } .gcopp-request-facts { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin-top: 15px; } .gcopp-request-facts span { display: grid; gap: 2px; padding: 9px; color: #525a64; background: var(--opp-soft); border-radius: 8px; font-size: 11px; } .gcopp-request-facts strong { color: #7a818a; font-size: 9px; text-transform: uppercase; } .gcopp-owner-commercial, .gcopp-provider-commercial { margin-top: 13px; padding: 12px; background: var(--opp-soft); border-radius: 9px; } .gcopp-owner-commercial h4 { margin: 0 0 8px; color: #343a42; font-size: 12px; } .gcopp-owner-commercial p { margin: 4px 0; color: #555d66; font-size: 11px; } .gcopp-provider-commercial { display: grid; gap: 7px; } .gcopp-provider-commercial p { display: grid; gap: 2px; margin: 0; } .gcopp-provider-commercial strong { color: #7a818a; font-size: 9px; text-transform: uppercase; } .gcopp-provider-commercial span { color: #3e454e; font-size: 11px; } .gcopp-privacy-note { display: flex; align-items: flex-start; gap: 7px; margin: 12px 0; padding: 10px 11px; color: #59616b; background: #f3f5f8; border-radius: 8px; font-size: 11px; line-height: 1.45; } .gcopp-privacy-note svg, .gcopp-proposal-detail__notice svg { width: 15px; height: 15px; flex: 0 0 auto; } .gcopp-requester-contact { display: flex; align-items: flex-start; gap: 10px; margin-top: 13px; padding: 12px; color: #285b43; background: #edf9f3; border: 1px solid #bfe6d1; border-radius: 10px; } .gcopp-requester-contact > svg { width: 20px; height: 20px; flex: 0 0 auto; } .gcopp-requester-contact > div { display: grid; gap: 2px; min-width: 0; } .gcopp-requester-contact strong { font-size: 11px; text-transform: uppercase; } .gcopp-requester-contact span { color: #263d32; font-size: 13px; font-weight: 700; } .gcopp-requester-contact small { overflow-wrap: anywhere; color: #527162; font-size: 10px; } .gcopp-requester-contact a { color: #176b48; text-decoration: none; } .gcopp-proposals { display: grid; align-content: start; gap: 10px; min-width: 0; } .gcopp-proposal { padding: 16px; background: #fff; border: 1px solid var(--opp-line); border-radius: 13px; box-shadow: 0 4px 12px rgba(31,31,31,.025); } .gcopp-proposal > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; } .gcopp-proposal h4 { margin: 0 0 2px; font-size: 14px; } .gcopp-proposal h4 a { color: var(--opp-ink); text-decoration: none; } .gcopp-verified { display: inline-flex; align-items: center; gap: 3px; margin-left: 5px; padding: 3px 6px; color: #176b48; background: #e9f8f1; border-radius: 999px; font-size: 9px; font-weight: 800; vertical-align: middle; } .gcopp-verified svg { width: 11px; height: 11px; } .gcopp-proposal header span { color: var(--opp-muted); font-size: 11px; } .gcopp-proposal__price { color: #c64d16; font-size: 15px; white-space: nowrap; } .gcopp-proposal__headline { display: grid; justify-items: end; gap: 5px; text-align: right; } .gcopp-proposal__status { display: inline-flex; padding: 4px 7px; color: #59616b; background: #f0f1f3; border-radius: 999px; font-size: 9px; font-weight: 800; text-transform: uppercase; } .gcopp-proposal__status.is-accepted { color: #176b48; background: #e9f8f1; } .gcopp-proposal__status.is-rejected, .gcopp-proposal__status.is-withdrawn { color: #8b4650; background: #faecee; } .gcopp-proposal.is-selected { border-color: #9ed8bd; box-shadow: 0 0 0 2px rgba(23,107,72,.08); } .gcopp-proposal.is-inactive { background: #fcfcfc; } .gcopp-proposal dl { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 6px; margin: 13px 0; } .gcopp-proposal dl > div { min-width: 0; padding: 8px; background: var(--opp-soft); border-radius: 7px; } .gcopp-proposal dt { color: #818791; font-size: 9px; font-weight: 800; text-transform: uppercase; } .gcopp-proposal dd { overflow-wrap: anywhere; margin: 2px 0 0; color: #373d44; font-size: 11px; } .gcopp-proposal > p { color: #565e68; font-size: 12px; line-height: 1.55; } .gcopp-proposal-detail { margin-top: 13px; border: 1px solid #e3e5e8; border-radius: 10px; } .gcopp-proposal-detail > summary { display: flex; align-items: center; justify-content: center; min-height: 42px; padding: 9px 12px; color: #b84b1a; background: #fff8f4; border-radius: 9px; cursor: pointer; font-size: 12px; font-weight: 800; list-style: none; } .gcopp-proposal-detail > summary::-webkit-details-marker { display: none; } .gcopp-proposal-detail > summary span { align-items: center; gap: 6px; } .gcopp-proposal-detail > summary svg { width: 15px; height: 15px; } .gcopp-proposal-detail__closed { display: inline-flex; } .gcopp-proposal-detail__open { display: none; } .gcopp-proposal-detail[open] > summary { border-bottom: 1px solid #f0d9ce; border-radius: 9px 9px 0 0; } .gcopp-proposal-detail[open] .gcopp-proposal-detail__closed { display: none; } .gcopp-proposal-detail[open] .gcopp-proposal-detail__open { display: inline-flex; } .gcopp-proposal-detail__body { display: grid; gap: 12px; padding: 14px; } .gcopp-proposal-detail__body section { min-width: 0; padding: 13px; background: #fbfbfc; border: 1px solid #eceef0; border-radius: 9px; } .gcopp-proposal-detail__body h5 { display: flex; align-items: center; gap: 6px; margin: 0 0 10px; color: #272b30; font-size: 12px; } .gcopp-proposal-detail__body h5 svg { width: 15px; height: 15px; color: #d45b24; } .gcopp-proposal-detail__grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; } .gcopp-proposal-detail__grid > div { display: grid; gap: 3px; min-width: 0; padding: 9px; background: #fff; border-radius: 7px; } .gcopp-proposal-detail__grid span, .gcopp-price-breakdown span, .gcopp-proposal-detail__conditions > span { color: #818791; font-size: 9px; font-weight: 800; text-transform: uppercase; } .gcopp-proposal-detail__grid strong { overflow-wrap: anywhere; color: #373d44; font-size: 11px; } .gcopp-proposal-detail__grid a, .gcopp-proposal__contact a { color: #b74b19; text-decoration: none; } .gcopp-price-breakdown { display: grid; gap: 7px; } .gcopp-price-breakdown > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; background: #fff; border-radius: 7px; } .gcopp-price-breakdown strong { color: #373d44; font-size: 12px; } .gcopp-price-breakdown .is-total { margin-top: 2px; padding-top: 11px; border-top: 1px solid #e7e9ec; } .gcopp-price-breakdown .is-total strong { color: #c64d16; font-size: 15px; } .gcopp-proposal-detail__conditions { margin-top: 9px; padding: 10px; background: #fff; border-radius: 7px; } .gcopp-proposal-detail__conditions p { margin: 5px 0 0; color: #535b65; font-size: 11px; line-height: 1.55; } .gcopp-proposal-detail__notice, .gcopp-proposal-detail__empty { margin: 0; color: #666e78; font-size: 11px; line-height: 1.5; } .gcopp-proposal-detail__notice { padding: 10px; background: #fff6e9; border-radius: 7px; } .gcopp-proposal-detail__body .gcopp-files { margin: 0; } .gcopp-proposal__contact { display: flex; align-items: center; gap: 9px; margin-top: 12px; padding: 10px; background: #fff9f5; border: 1px solid #ffe1d3; border-radius: 9px; } .gcopp-proposal__contact > svg { width: 18px; color: #d45b24; } .gcopp-proposal__contact span { display: grid; } .gcopp-proposal__contact strong { font-size: 12px; } .gcopp-proposal__contact small { color: var(--opp-muted); font-size: 10px; } .gcopp-decision { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--opp-line); } .gcopp-proposal-form { min-width: 0; padding: 18px; background: #fff; border: 1px solid var(--opp-line); border-radius: 13px; } .gcopp-proposal-form h3 { padding-bottom: 11px; border-bottom: 1px solid var(--opp-line); } .gcopp-limit-note { margin: 9px 0 0; color: #a5462f; font-size: 11px; } .gcopp-cancel { display: flex; justify-content: flex-end; padding: 11px 21px; background: #fafafa; border-top: 1px solid var(--opp-line); } .gcopp-empty-inline { display: flex; align-items: center; gap: 10px; padding: 15px; color: var(--opp-muted); background: #fff; border: 1px dashed #d9dde2; border-radius: 11px; } .gcopp-empty-inline svg { width: 21px; color: #d8642e; } .gcopp-empty-inline p { margin: 0; font-size: 12px; } .gcopp-empty { padding: 42px 24px; border: 1px dashed #d9dde2; border-radius: 17px; } .gcopp-empty > svg { width: 36px; height: 36px; color: #da622b; } .gc3-detail-actions { display: grid; gap: 8px; margin-top: 14px; } .gc3-product-note { margin: 10px 0; color: #626a74; font-size: 12px; line-height: 1.45; } @media (max-width: 1280px) { .gcopp-filters__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 900px) { .gcopp-hero { align-items: flex-start; flex-direction: column; } .gcopp-hero__trust, .gcopp-plan-pill { width: 100%; min-width: 0; } .gcopp-filters__grid { grid-template-columns: 1fr 1fr; } .gcopp-detail, .gcopp-detail--provider { grid-template-columns: 1fr; } } @media (max-width: 700px) { .gcopp-hero { padding: 21px; border-radius: 16px; } .gcopp-form { padding: 19px; border-radius: 15px; } .gcopp-kpis { grid-template-columns: 1fr; } .gcopp-kpis article { min-height: 68px; } .gcopp-filters__head { align-items: flex-start; flex-direction: column; gap: 8px; } .gcopp-filters__grid { grid-template-columns: 1fr; } .gcopp-filters .gc-button { width: 100%; } .gcopp-card > header { padding: 16px; } .gcopp-summary { padding: 0 16px 15px; } .gcopp-detail { padding: 15px; } .gcopp-proposal dl { grid-template-columns: 1fr 1fr; } .gcopp-proposal-detail__grid { grid-template-columns: 1fr; } .gcopp-request-facts { grid-template-columns: 1fr; } } @media (max-width: 480px) { .gcopp-card > header { flex-direction: column; } .gcopp-card__metric { display: inline-grid; grid-auto-flow: column; align-items: center; gap: 5px; min-width: 0; } .gcopp-card__metric strong { font-size: 16px; } .gcopp-proposal > header { flex-direction: column; } .gcopp-proposal__headline { justify-items: start; text-align: left; } .gcopp-proposal__price { white-space: normal; } .gcopp-form__actions, .gcopp-decision { align-items: stretch; flex-direction: column-reverse; } .gcopp-form__actions .gc-button, .gcopp-decision .gc-button { justify-content: center; width: 100%; } } /* Portafolio visible en el perfil público */ .gc-public-portfolio__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 16px; } .gc-public-portfolio__head h2 { margin: 0; } .gc-public-portfolio__head p { margin: 4px 0 0; color: #717780; font-size: 13px; } .gc-public-works { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 15px; } .gc-public-work { overflow: hidden; background: #fff; border: 1px solid #e7e8ec; border-radius: 12px; } .gc-public-work__cover { position: relative; background: #f1f2f3; } .gc-public-work__cover img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; } .gc-public-work__count { position: absolute; right: 9px; bottom: 9px; display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; color: #fff; background: rgba(20, 22, 25, .7); border-radius: 7px; font-size: 11px; font-weight: 700; } .gc-public-work__count svg { width: 13px; height: 13px; } .gc-public-work__body { padding: 14px; } .gc-public-work__body small { display: block; margin-bottom: 4px; color: #ff7438; font-size: 10.5px; font-weight: 800; text-transform: uppercase; } .gc-public-work__body h3 { margin: 0; color: #1f1f1f; font-size: 15px; } .gc-public-work__meta { display: flex; flex-wrap: wrap; gap: 5px 10px; margin: 7px 0 0; color: #7a8189; font-size: 11px; } .gc-public-work__meta span { display: inline-flex; align-items: center; gap: 4px; } .gc-public-work__meta svg { width: 12px; height: 12px; } .gc-public-work__body > p:last-child { margin: 9px 0 0; color: #626a73; font-size: 12px; line-height: 1.55; } .gcd-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; } .gcd-modal[hidden] { display: none; } .gcd-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.55); backdrop-filter: blur(3px); } .gcd-modal__box { position: relative; background: #fff; border-radius: 16px; width: 100%; max-width: 560px; max-height: 90vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,.25); } .gcd-modal__box--wide { max-width: 820px; } .gcd-modal__head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid #e7e8ec; } .gcd-modal__head h3 { margin: 0; font-size: 18px; color: #1f1f1f; } .gcd-modal__head p { margin: 3px 0 0; font-size: 12px; color: #6b7280; } .gcd-modal__close { background: transparent; border: 0; font-size: 24px; color: #6b7280; cursor: pointer; line-height: 1; padding: 4px 8px; border-radius: 6px; } .gcd-modal__close:hover { background: #f6f7f9; color: #1f1f1f; } .gcd-modal__form { padding: 20px 22px; display: flex; flex-direction: column; gap: 14px; } .gcd-modal__form label { display: block; font-weight: 600; font-size: 13px; margin-bottom: 5px; color: #1f1f1f; } .gcd-modal__form input[type="text"], .gcd-modal__form input[type="date"], .gcd-modal__form input[type="number"], .gcd-modal__form textarea, .gcd-modal__form select { width: 100%; padding: 10px 12px; border: 1px solid #e7e8ec; border-radius: 8px; font-size: 14px; font-family: inherit; background: #fff; } .gcd-modal__form input[type="text"]:focus, .gcd-modal__form input[type="date"]:focus, .gcd-modal__form input[type="number"]:focus, .gcd-modal__form textarea:focus, .gcd-modal__form select:focus { border-color: #ff7438; outline: 0; } .gcd-modal__form small { display: block; margin-top: 5px; color: #6b7280; font-size: 12px; } .gcd-modal__portada { display: flex; flex-direction: column; gap: 6px; } .gcd-portada-preview { width: 100%; height: 160px; background: #f6f7f9; border: 1px dashed #e7e8ec; border-radius: 10px; display: flex; align-items: center; justify-content: center; overflow: hidden; color: #9aa0a8; } .gcd-portada-preview img { width: 100%; height: 100%; object-fit: cover; } .gcd-portada-preview :is(i[data-lucide], svg.lucide) { width: 32px; height: 32px; } .gcd-modal__portada small { font-size: 12px; color: #9aa0a8; } .gcd-modal__foot { display: flex; justify-content: flex-end; gap: 10px; padding-top: 10px; } @media (max-width: 700px) { .gcd-modal { padding: 8px; } .gcd-modal__form .gc-grid-2, .gcd-modal__form .gc-grid-3 { grid-template-columns: 1fr; } } /* Cards de empleos */ .gcd-empleos-list { display: flex; flex-direction: column; gap: 10px; } .gcd-empleo-card { display: flex; align-items: center; gap: 14px; padding: 12px; background: #fff; border: 1px solid #e7e8ec; border-radius: 12px; } .gcd-empleo-card:hover { border-color: #ff7438; } .gcd-empleo-card__thumb { width: 60px; height: 60px; border-radius: 10px; overflow: hidden; background: #f6f7f9; flex: none; display: flex; align-items: center; justify-content: center; color: #9aa0a8; } .gcd-empleo-card__thumb img { width: 100%; height: 100%; object-fit: cover; } .gcd-empleo-card__thumb :is(i[data-lucide], svg.lucide) { width: 24px; height: 24px; } .gcd-empleo-card__body { flex: 1 1 auto; min-width: 0; } .gcd-empleo-card__body h4 { margin: 0 0 4px; font-size: 15px; color: #1f1f1f; } .gcd-empleo-card__meta { margin: 0; display: flex; flex-wrap: wrap; gap: 12px; font-size: 12.5px; color: #9aa0a8; } .gcd-empleo-card__meta span { display: inline-flex; align-items: center; gap: 4px; } .gcd-empleo-card__meta :is(i[data-lucide], svg.lucide) { width: 13px; height: 13px; } .gcd-empleo-card__estado { padding: 2px 8px; border-radius: 999px; background: #ecf8f0; color: #1a9255; font-weight: 600; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; } .gcd-empleo-card__actions { display: flex; gap: 4px; flex: none; } /* Badge de notificación en sidebar */ .gcd-sidebar__badge { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; background: #ff7438; color: #fff; font-size: 11px; font-weight: 700; border-radius: 999px; margin-left: auto; } .gcd-sidebar__link.is-active .gcd-sidebar__badge { background: #fff; color: #ff7438; } /* Filtros de postulaciones */ .gcd-postu-filtros { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; background: #fff; border: 1px solid #e7e8ec; border-radius: 12px; padding: 14px; margin: 14px 0; } .gcd-postu-filtros__grupo { display: flex; flex-direction: column; gap: 4px; min-width: 160px; flex: 1 1 auto; } .gcd-postu-filtros__grupo label { font-size: 12px; color: #6b7280; font-weight: 600; } .gcd-postu-filtros__grupo select { padding: 8px 10px; border: 1px solid #e7e8ec; border-radius: 8px; font-size: 14px; background: #fff; } /* Lista de postulaciones */ .gcd-postu-list { display: flex; flex-direction: column; gap: 10px; } .gcd-postu-card { display: flex; gap: 14px; padding: 14px; background: #fff; border: 1px solid #e7e8ec; border-radius: 12px; transition: border-color .15s; } .gcd-postu-card:hover { border-color: #ff7438; } .gcd-postu-card__avatar img { border-radius: 999px; } .gcd-postu-card__avatar-icon { width: 48px; height: 48px; border-radius: 999px; background: #f6f7f9; color: #ff7438; display: inline-flex; align-items: center; justify-content: center; } .gcd-postu-card__avatar-icon :is(i[data-lucide], svg.lucide) { width: 22px; height: 22px; } .gcd-kanban__card { display: block; color: inherit; text-decoration: none; } .gcd-kanban__card:hover { border-color: #ff7438; } .gcd-work-list { display: grid; gap: 14px; margin-top: 16px; } .gcd-work-card { border: 1px solid #e7e8ec; border-radius: 8px; padding: 16px; background: #fff; } .gcd-work-card > header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; } .gcd-work-card h3, .gcd-work-card p { margin: 0; } .gcd-work-card p { color: #6b7280; font-size: 13px; margin-top: 3px; } .gcd-schedule { display: grid; gap: 8px; margin-bottom: 18px; } .gcd-schedule__row { display: grid; grid-template-columns: minmax(140px, 1fr) 120px 20px 120px; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid #eef0f3; } .gcd-credential-list { display: grid; gap: 8px; margin-top: 18px; } .gcd-credential { display: flex; justify-content: space-between; align-items: center; gap: 12px; border: 1px solid #e7e8ec; border-radius: 8px; padding: 12px; } .gcd-credential > div { display: flex; align-items: center; gap: 10px; } .gc-professional-trust { margin-top: 18px; } .gcd-rating { display: inline-flex; align-items: center; gap: 5px; color: #9a6500; font-weight: 700; } .gcd-rating :is(i[data-lucide], svg.lucide) { width: 17px; height: 17px; } .gcd-public-schedule { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; margin: 12px 0; } .gcd-public-schedule span, .gcd-public-credentials span { border: 1px solid #e7e8ec; border-radius: 8px; padding: 9px 11px; font-size: 13px; } .gcd-public-schedule strong { display: block; } .gcd-public-credentials { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; } .gcd-public-credentials span { display: inline-flex; align-items: center; gap: 6px; color: #166534; } .gcd-public-credentials :is(i[data-lucide], svg.lucide) { width: 17px; height: 17px; } .gcd-review-list { display: grid; gap: 10px; margin-top: 16px; } .gcd-review-list blockquote { margin: 0; padding: 12px; border: 1px solid #e7e8ec; border-radius: 8px; } .gcd-review-list blockquote div { color: #e6a700; display: flex; gap: 2px; } .gcd-review-list blockquote :is(i[data-lucide], svg.lucide) { width: 15px; height: 15px; } .gcd-review-list blockquote p { margin: 8px 0; } .gcd-review-list cite { color: #6b7280; font-size: 12px; } .gcd-review-form { margin-top: 16px; border-top: 1px solid #e7e8ec; padding-top: 16px; } @media (max-width: 640px) { .gcd-schedule__row { grid-template-columns: 1fr 1fr; } .gcd-schedule__row > span { display: none; } } .gcd-proposal-form, .gcd-proposal { margin-top: 16px; padding: 16px; border: 1px solid #d9dde3; border-radius: 8px; background: #fafbfc; } .gcd-proposal h4, .gcd-proposal-form h4 { margin: 0 0 14px; } .gcd-proposal__amounts { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)); gap: 8px; margin-bottom: 12px; } .gcd-proposal__amounts span { display: flex; flex-direction: column; padding: 10px; background: #fff; border: 1px solid #e7e8ec; border-radius: 8px; font-size: 12px; color: #6b7280; } .gcd-proposal__amounts strong { color: #1f1f1f; font-size: 16px; margin-top: 3px; } .gcd-proposal__amounts .is-total { border-color: #ff7438; } @media (max-width: 700px) { .gcd-proposal__amounts { grid-template-columns: 1fr 1fr; } } .gcd-postu-card__body { flex: 1 1 auto; min-width: 0; } .gcd-postu-card__head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .gcd-postu-card__head h4 { margin: 0; font-size: 15px; color: #1f1f1f; } .gcd-postu-card__meta { margin: 4px 0 0; display: flex; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: #6b7280; } .gcd-postu-card__meta span { display: inline-flex; align-items: center; gap: 4px; } .gcd-postu-card__meta :is(i[data-lucide], svg.lucide) { width: 13px; height: 13px; } .gcd-postu-card__mensaje { margin: 6px 0 0; font-size: 13px; color: #4b5057; line-height: 1.4; } .gcd-postu-card__actions { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; } .gcd-postu-card__actions select { padding: 6px 8px; border: 1px solid #e7e8ec; border-radius: 6px; font-size: 12.5px; background: #fff; } /* Badges de estado */ .gc-badge { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; } .gc-badge--enviada { background: #eaf4ff; color: #1d6fd6; } .gc-badge--vista { background: #fff8e0; color: #a37500; } .gc-badge--en_revision { background: #fff1ea; color: #d2570f; } .gc-badge--aceptada { background: #ecf8f0; color: #1a9255; } .gc-badge--rechazada { background: #f4f4f4; color: #6b7280; } /* Paginador */ .gcd-pager { display: flex; justify-content: space-between; align-items: center; margin: 18px 0 6px; padding: 12px; background: #fff; border: 1px solid #e7e8ec; border-radius: 10px; } .gcd-pager span { font-size: 13px; color: #6b7280; } /* ========================================================================== * Sistema temporal UX/UI — fechas, meses y horas * ========================================================================== */ .gc-temporal-control { position: relative; display: flex; align-items: center; width: 100%; min-width: 0; } .gc-temporal-control .flatpickr-wrapper { display: block; width: 100%; } .gc-temporal-control input.flatpickr-input, .gc-temporal-control input.form-control, .gc-temporal-control > input[type="date"], .gc-temporal-control > input[type="time"] { width: 100%; min-height: 46px; margin: 0; padding: 11px 42px 11px 42px !important; color: #25282d; background: #fff; border: 1px solid #d9dde3; border-radius: 10px; box-shadow: 0 1px 2px rgba(31, 31, 31, .03); font: inherit; font-size: 14px; line-height: 1.35; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; } .gc-temporal-control input::placeholder { color: #959ba3; opacity: 1; } .gc-temporal-control input:hover { border-color: #bbc1c9; } .gc-temporal-control input:focus, .gc-temporal-control.is-open input { outline: 0; border-color: var(--gcd-brand, #ff7438); box-shadow: 0 0 0 3px rgba(255, 116, 56, .14); } .gc-temporal-control__icon { position: absolute; z-index: 2; left: 13px; top: 50%; display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; color: #858c95; pointer-events: none; transform: translateY(-50%); } .gc-temporal-control__icon svg { width: 18px; height: 18px; stroke-width: 1.9; } .gc-temporal-control:focus-within .gc-temporal-control__icon, .gc-temporal-control.is-open .gc-temporal-control__icon { color: var(--gcd-brand, #ff7438); } .gc-temporal-control__clear { position: absolute; z-index: 3; right: 8px; top: 50%; display: none; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; color: #737a83; background: transparent; border: 0; border-radius: 7px; cursor: pointer; transform: translateY(-50%); } .gc-temporal-control.has-value .gc-temporal-control__clear { display: inline-flex; } .gc-temporal-control__clear:hover, .gc-temporal-control__clear:focus-visible { color: #1f1f1f; background: #f1f2f4; outline: 0; } .gc-temporal-control__clear svg { width: 15px; height: 15px; } /* Selector visual de horas: evita los controles numéricos poco intuitivos del navegador. */ .gc-time-control { overflow: visible; } .gc-time-control__source { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; clip-path: inset(50%) !important; } .gc-time-trigger { display: flex; align-items: center; width: 100%; min-height: 46px; margin: 0; padding: 10px 42px; color: #8b929b; background: #fff; border: 1px solid #d9dde3; border-radius: 10px; box-shadow: 0 1px 2px rgba(31, 31, 31, .03); font: inherit; text-align: left; cursor: pointer; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; } .gc-time-trigger:hover { border-color: #bbc1c9; background: #fff; } .gc-time-trigger:focus-visible, .gc-time-control.is-open .gc-time-trigger { outline: 0; border-color: var(--gcd-brand, #ff7438); box-shadow: 0 0 0 3px rgba(255, 116, 56, .14); } .gc-time-trigger.has-error { border-color: #d53f3f; box-shadow: 0 0 0 3px rgba(213, 63, 63, .12); } .gc-time-trigger__value { color: #8b929b; font-size: 14px; font-weight: 600; letter-spacing: .01em; } .gc-time-trigger.has-value .gc-time-trigger__value { color: #25282d; font-size: 15px; font-variant-numeric: tabular-nums; } .gc-time-trigger__hint { margin-left: auto; color: #8a9098; font-size: 11px; font-weight: 700; text-transform: uppercase; } .gc-time-panel { position: absolute; z-index: 100000; top: calc(100% + 8px); left: 0; width: min(360px, calc(100vw - 32px)); padding: 14px; color: #25282d; background: #fff; border: 1px solid #e2e5e9; border-radius: 14px; box-shadow: 0 18px 44px rgba(31, 31, 31, .18); } .gc-time-panel[hidden] { display: none !important; } .gc-time-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid #eceef1; } .gc-time-panel__head > div { display: grid; gap: 2px; } .gc-time-panel__head strong { font-size: 14px; } .gc-time-panel__head span { color: #7c838c; font-size: 11px; } .gc-time-panel__preview { min-width: 76px; padding: 7px 10px; color: #d95519; background: #fff3ed; border-radius: 9px; font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; text-align: center; } .gc-time-panel__section { margin-top: 13px; } .gc-time-panel__label { display: block; margin-bottom: 7px; color: #6f767f; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; } .gc-time-panel__hours, .gc-time-panel__minutes { display: grid; gap: 5px; } .gc-time-panel__hours { grid-template-columns: repeat(6, 1fr); } .gc-time-panel__minutes { grid-template-columns: repeat(4, 1fr); } .gc-time-option { min-width: 0; min-height: 34px; padding: 6px 4px; color: #43484f; background: #f7f8f9; border: 1px solid transparent; border-radius: 8px; font: inherit; font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; cursor: pointer; } .gc-time-option:hover, .gc-time-option:focus-visible { color: #c94c14; background: #fff3ed; border-color: #ffd1bc; outline: 0; } .gc-time-option.is-selected { color: #fff; background: var(--gcd-brand, #ff7438); border-color: var(--gcd-brand, #ff7438); } .gc-time-panel__actions { display: flex; align-items: center; gap: 5px; margin: 14px -14px -14px; padding: 10px 12px; background: #fafafa; border-top: 1px solid #eceef1; border-radius: 0 0 14px 14px; } .gc-time-panel__actions > span { flex: 1 1 auto; } .gc-time-action { min-height: 34px; padding: 7px 9px; border: 0; border-radius: 8px; font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; } .gc-time-action--quiet { color: #646b74; background: transparent; } .gc-time-action--quiet:hover, .gc-time-action--quiet:focus-visible { color: #c94c14; background: #fff0e8; outline: 0; } .gc-time-action--primary { color: #fff; background: var(--gcd-brand, #ff7438); } .gc-time-action--primary:hover, .gc-time-action--primary:focus-visible { background: #e65f25; outline: 0; } .gc-time-action--primary:disabled { color: #989ea6; background: #e7e9ec; cursor: not-allowed; } /* Selector de mes y año: evita el comportamiento distinto de cada navegador. */ .gc-month-control { gap: 8px; padding-left: 36px; } .gc-month-control__source { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; clip-path: inset(50%) !important; } .gc-month-control select { width: auto; min-width: 0; min-height: 46px; margin: 0; padding: 10px 34px 10px 12px; color: #25282d; background-color: #fff; border: 1px solid #d9dde3; border-radius: 10px; box-shadow: 0 1px 2px rgba(31, 31, 31, .03); font: inherit; font-size: 14px; cursor: pointer; } .gc-month-control__month { flex: 1 1 62%; } .gc-month-control__year { flex: 1 1 38%; } .gc-month-control select:hover { border-color: #bbc1c9; } .gc-month-control select:focus { outline: 0; border-color: var(--gcd-brand, #ff7438); box-shadow: 0 0 0 3px rgba(255, 116, 56, .14); } /* Calendario flotante alineado con la identidad visual del plugin. */ .flatpickr-calendar { overflow: hidden; padding: 8px; border: 1px solid #e2e5e9; border-radius: 14px; box-shadow: 0 18px 44px rgba(31, 31, 31, .16); font-family: inherit; } .flatpickr-months { margin: -8px -8px 6px; padding: 9px 8px 5px; background: #fff8f4; } .flatpickr-months .flatpickr-month { height: 38px; color: #292c31; fill: #292c31; } .flatpickr-current-month { padding-top: 10px; font-size: 15px; } .flatpickr-current-month .flatpickr-monthDropdown-months, .flatpickr-current-month input.cur-year { font-weight: 700; } .flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month { top: 6px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 8px; border-radius: 8px; } .flatpickr-months .flatpickr-prev-month:hover, .flatpickr-months .flatpickr-next-month:hover { background: #ffe9dd; } .flatpickr-weekdays { height: 32px; } span.flatpickr-weekday { color: #747b84; font-size: 11px; text-transform: uppercase; } .flatpickr-day { max-width: 39px; color: #34383e; border-radius: 9px; font-weight: 600; } .flatpickr-day:hover, .flatpickr-day:focus { color: #1f1f1f; background: #fff0e8; border-color: #ffd6c3; } .flatpickr-day.today { color: #d95519; background: #fff8f4; border-color: #ff9b70; } .flatpickr-day.today:hover, .flatpickr-day.today:focus, .flatpickr-day.selected, .flatpickr-day.selected:hover, .flatpickr-day.selected:focus { color: #fff; background: var(--gcd-brand, #ff7438); border-color: var(--gcd-brand, #ff7438); } .flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover { color: #d0d3d8; } .flatpickr-calendar.hasTime .flatpickr-time { height: 54px; max-height: 54px; margin: 2px -8px -8px; border-color: #e9ebee; } .flatpickr-time input { color: #292c31; font-size: 16px; } .flatpickr-time input:hover, .flatpickr-time input:focus { background: #fff3ed; } .gc-calendar-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 7px -8px -8px; padding: 8px 10px; background: #fafafa; border-top: 1px solid #eceef1; } .gc-calendar-actions button { padding: 6px 9px; color: #5e646c; background: transparent; border: 0; border-radius: 7px; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; } .gc-calendar-actions button:hover, .gc-calendar-actions button:focus-visible { color: #d95519; background: #fff0e8; outline: 0; } /* Horario semanal con etiquetas que continúan siendo claras en móvil. */ .gcd-time-slot { display: grid; gap: 4px; min-width: 0; } .gcd-time-slot > span { color: #7d838b; font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; } .gcd-time-separator { color: #91969d; font-size: 12px; text-align: center; } @media (max-width: 640px) { .gcd-schedule__row { grid-template-columns: 1fr 1fr; gap: 10px; padding: 13px 0; } .gcd-schedule__row > .gc-chip-check { grid-column: 1 / -1; } .gcd-schedule__row > .gcd-time-separator { display: none; } .gc-time-panel { position: fixed; top: auto; right: 10px; bottom: 10px; left: 10px; width: auto; max-height: calc(100vh - 20px); overflow-y: auto; border-radius: 16px; box-shadow: 0 22px 60px rgba(31, 31, 31, .28); } .gc-time-panel__hours { gap: 6px; } .gc-time-option { min-height: 38px; } .gc-time-panel__actions { position: sticky; bottom: -14px; } } @media (prefers-reduced-motion: reduce) { .gc-temporal-control input, .gc-month-control select, .gc-time-trigger { transition: none; } .flatpickr-calendar.animate.open { animation: none; } } /* Mensajería 6.9.9: bandejas y conversaciones */ .gc-message-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}.gc-message-tabs a{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid #e2e8f0;border-radius:999px;color:#334155;text-decoration:none;background:#fff;font-weight:700}.gc-message-tabs a.is-active{background:#1f1f1f;border-color:#1f1f1f;color:#fff}.gc-message-tabs span{min-width:22px;padding:2px 6px;border-radius:999px;background:rgba(148,163,184,.2);text-align:center;font-size:12px}.gc-conversation-list{overflow:hidden;padding:0}.gc-conversation-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:center;padding:15px 18px;border-bottom:1px solid #eef2f7;color:#1f2937;text-decoration:none}.gc-conversation-row:last-child{border-bottom:0}.gc-conversation-row:hover{background:#f8fafc}.gc-conversation-row.is-unread{background:#fff8f3}.gc-conversation-row__avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#fff0e8;color:#ff7438}.gc-conversation-row__avatar svg{width:20px;height:20px}.gc-conversation-row__body{display:grid;gap:2px;min-width:0}.gc-conversation-row__body span,.gc-conversation-row__body small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gc-conversation-row__body small{color:#64748b}.gc-conversation-row__meta{display:grid;justify-items:end;gap:7px;color:#64748b;font-size:12px}.gc-conversation-row__meta b{display:grid;place-items:center;min-width:22px;height:22px;border-radius:999px;background:#ff7438;color:#fff}.gc-thread-history{display:grid;gap:12px;margin-bottom:18px}.gc-thread-history>h2{margin:0}.gc-thread-message{max-width:82%;padding:12px 14px;border-radius:14px 14px 14px 4px;background:#f1f5f9}.gc-thread-message.is-mine{margin-left:auto;border-radius:14px 14px 4px 14px;background:#fff0e8}.gc-thread-message header{display:flex;justify-content:space-between;gap:20px;margin-bottom:6px;font-size:12px}.gc-thread-message p{margin:0;white-space:normal}.gc-thread-message time{color:#64748b}@media(max-width:640px){.gc-conversation-row{grid-template-columns:38px minmax(0,1fr);padding:13px}.gc-conversation-row__meta{grid-column:2;grid-row:2;display:flex;justify-content:space-between}.gc-thread-message{max-width:95%}}